Depending on the error in my back-end, I would like to display the corresponding error in my front-end, for example if an email address or a pseudo is already use in my DB (I work with nuxt-auth local provider) At the moment, my custom message is displayed in my editor console like this: [nuxt] [request error] [unhandled] [500] E-mail adrress already use !
But in my console browser have an 500 (Internal Server Error) from POST http://localhost:3000/api/auth/register
Btw if I enter an address that is not yet known, my code works
//register.post.ts
export default defineEventHandler(async event => {
let e;
const response = await readBody(event);
console.log(response);
const userEmail = response.email;
const searchMailIntoDB = await client.query(`SELECT mail
from profil
where mail = '${userEmail}'`);
const isEmailExist = searchMailIntoDB.rows[0];
const userPseudo = response.pseudo;
const searchPseudoIntoDB = await client.query(`SELECT pseudo
from profil
where mail = '${userPseudo}'`);
const isPseudoExist = searchPseudoIntoDB.rows[0];
if (isEmailExist) {
throw new Error("E-mail address already in use!");
} else if (isPseudoExist) {
throw new Error("Pseudo already in use!");
} else {
console.log("Create new account..");
}
});
//connexion.vue
async function signUpWithCredentials() {
const credentials = {
email: signUpEmail.value,
password: signUpPassword.value,
firstName: firstName.value,
lastName: lastName.value,
gender: gender.value,
pseudo: pseudo.value
};
try {
await signUp(credentials, {callbackUrl: '/allPosts', redirect: true, external: true});
} catch (e) {
console.log(e);
}
}