Hi, I'm having issues with email verification - it runs fine on my local dev server, but as soon as I run a local build server I get the issue, so I think it's something to do with my build process.
I'm running a vue.js app on a Fast API backend and I've double checked my implementation with the documentation to check I haven't missed anything. I'm running a managed development supertokens core.
The issue I have is that when I click the email verification link, I get a 404 error. As per my set up, the email verification link is localhost:3000/auth/verify-email?token=SOME_TOKEN&rid=emailverification
In my vue.js router at /auth/verify-email I have a vue.js component that loads and there is a checkAuth function that runs beforeEnter as follows:
async function checkAuth(to, from, next) {
const canAccess = await Session.doesSessionExist();
if (!canAccess) return next("/signin");
else return next();
}
In my vue.js component that loads at /auth/verify-email I have a consumeVerificationCode() function that runs on mounted, having checked if there's a Session as per the documentation, see below:
async mounted() {
if (!this.session) {
await this.getSession();
this.consumeVerificationCode();
} else if (this.session) {
this.consumeVerificationCode();
}
},
The consumeVerificationCode() function is as follows:
async consumeVerificationCode() {
try {
let response = await verifyEmail();
if (response.status === "EMAIL_VERIFICATION_INVALID_TOKEN_ERROR") {
// This can happen if the verification code is expired or invalid.
// You should ask the user to retry
toast.error(
"Oops! Seems like the verification link expired. Please try again later."
);
this.$router.push("/auth/verify-email"); // back to the email sending screen.
} else {
// email was verified successfully.
toast.success("Email verified successfully!");
this.$router.push(this.userId + "/onboarding");
}
} catch (err) {
if (err.isSuperTokensGeneralError === true) {
// this may be a custom error message sent from the API by you.
toast.error(err.message);
} else {
toast.error(
"Oops! Seems like the verification link expired. Please try again later."
);
}
}
},
verifyEmail is imported as follows:
import { verifyEmail } from "supertokens-web-js/recipe/emailverification";
The 404 error I receive isn't my custom 404 page - it displays what's seen in the attachment below
