Users not appearing into Clerk's Database after Signing-up

Answered

Sun bear posted this in #help-forum

Sun bearOP

2024-02-18T15:02:52.000Z

It looks like the sign-up process is completed because the user does get redirected back to my log-in page after signing up, however for some reason it looks like the user is not inserted into the user database after signing up.

I did try to look-up this issue but I wasn't able to find a solution yet. I would like to know what could cause this issue and how can I fix it.

I've attached some screenshots as well and I can provide more details if required.

Answered by Sun bear

How I solved it: With the help of Chat Gippitty and the example for the Sign-up process in here: https://clerk.com/docs/custom-flows/email-password

Thank you very much for your help as well Adam, and I hope you're having an awesome day!

View full answer

93 Replies

Asiatic Lion

2024-02-19T15:16:04.000Z

Hi, @Sun bear I'd like to tell you take a look at the status code of signup api request.

@Asiatic Lion Hi, <@998405690718703696> I'd like to tell you take a look at the status code of signup api request.

Sun bearOP

2024-02-19T15:36:12.000Z

Hey Witty. Thanks for the reply, had no idea that's a thing. Would i find that in the console logs or somewhere else ? Or do I have to manually log it ?

Asiatic Lion

2024-02-19T15:38:06.000Z

you'd better to check the both.
In the console logs and you can log it on the backend part right below code for creating new user.

@Asiatic Lion you'd better to check the both. In the console logs and you can log it on the backend part right below code for creating new user.

Sun bearOP

2024-02-19T15:46:09.000Z

Thank you, it did not appear but I added some console logs with gpt and I think I got it, but have no idea what it means. Can you have a look and let me know if you know what that code means ?

Asiatic Lion

2024-02-19T15:48:21.000Z

Signup attempt status: missing_requirements

is this on frontend code? would you provide me the code for this log?

@Asiatic Lion is this on frontend code? would you provide me the code for this log?

Sun bearOP

2024-02-19T15:49:08.000Z

const handleFormSubmit = async () => {
    console.log("Form Submitted", formData);

    // Check if signUp is defined
    if (!signUp) {
        console.error("signUp function is not available.");
        // Optionally, handle this error case, e.g., by showing a user-friendly message
        return;
    }

    try {
        const signUpResult = await signUp.create({
            emailAddress: formData.accountDetails.email,
            password: formData.accountDetails.password,
            // Optionally add firstName, lastName if Clerk supports it in your setup
        });

        console.log("SignUp attempt status:", signUpResult.status); // Log Clerk sign-up status

        // On successful sign-up with Clerk, proceed with submitting additional data
        const response = await fetch(`/${lang}/signup/submit`, {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json',
            },
            body: JSON.stringify(formData),
        });

        console.log('HTTP Status Code from signup/submit:', response.status); // Log the HTTP status code

        let data = await response.json();

        if (!response.ok) {
            console.error(`Error submitting form data: ${response.status} ${response.statusText}`, 'Error details:', data);
            return; // Handle error, e.g., show error message
        }

        console.log('Data submitted successfully:', data);
        router.push(`/${lang}/login`);
    } catch (error) {
        console.error('Error during sign-up or data submission:', error);
        // Handle error, e.g., show error message
    }
};

I think this is the code responsible for it.

Asiatic Lion

2024-02-19T15:54:50.000Z

when execute signUp.create, required fields are missing.

try to log requiredFields now.

or requiredFields...

Sun bearOP

2024-02-19T15:59:01.000Z

https://tenor.com/view/chatgpt-jarvis-iron-man-unsure-gif-758258540099951503

@Asiatic Lion when execute signUp.create, required fields are missing.

Sun bearOP

2024-02-19T16:01:03.000Z

I think it worked, we have more information in the logs now!

But it doesn't seem to say what fields it wants. Don't we already provide the 2 fields it complains about ?

Asiatic Lion

2024-02-19T16:04:11.000Z

you only logged missing fields?

really weird.

Sun bearOP

2024-02-19T16:04:51.000Z

It added these logs:

        console.log("SignUp attempt status:", signUpResult.status); // Log Clerk sign-up status
        if (signUpResult.status === 'missing_requirements') {
            console.log("Missing required fields:", signUpResult.requiredFields);
            // Optionally, inform the user which fields are required but missing
        }

        // Check if sign-up is not complete due to missing requirements
        if (signUpResult.status !== 'complete') {
            console.error("Sign-up incomplete, missing requirements:", signUpResult.requiredFields);
            return; // Exit the function if sign-up is not complete
        }

I have found something in regards with the error in the meantime https://clerk.com/docs/references/javascript/sign-up/sign-up

For the missing_requirements

Sun bearOP

2024-02-19T16:18:54.000Z

And I found this as well: https://clerk.com/docs/custom-flows/email-password

I'm going to try this suggestion

Asiatic Lion

2024-02-19T16:23:04.000Z

I think, email_address is unverified ones.

try to log unverifiedFields

@Asiatic Lion I think, email_address is unverified ones.

Sun bearOP

2024-02-19T16:24:44.000Z

Yeah, dead end here.

Asiatic Lion

2024-02-19T16:25:29.000Z

emailAddress which you did before, is right.

@Asiatic Lion try to log unverifiedFields

Sun bearOP

2024-02-19T16:30:33.000Z

I'm going to need your help with logging those, because it looks like GPT is not familiar with logging those. What do I need to add in my code ?

const handleFormSubmit = async () => {
    console.log("Form Submitted", formData);

    if (!signUp) {
        console.error("signUp function is not available.");
        return;
    }

    try {
        const signUpResult = await signUp.create({
            emailAddress: formData.accountDetails.email,
            password: formData.accountDetails.password,
        });

        console.log("SignUp attempt status:", signUpResult.status);
        if (signUpResult.status === 'missing_requirements') {
            console.log("Missing required fields:", signUpResult.requiredFields);
        }

        if (signUpResult.status !== 'complete') {
            console.error("Sign-up incomplete, missing requirements:", signUpResult.requiredFields);
            return;
        }

        const response = await fetch(`/${lang}/signup/submit`, {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json',
            },
            body: JSON.stringify(formData),
        });

        console.log('HTTP Status Code from signup/submit:', response.status);

        let data = await response.json();

        if (!response.ok) {
            console.error(`Error submitting form data: ${response.status} ${response.statusText}`, 'Error details:', data);
            return;
        }

        console.log('Data submitted successfully:', data);
        router.push(`/${lang}/login`);
    } catch (error) {
        console.error('Error during sign-up or data submission:', error);
      
    }
};

Asiatic Lion

2024-02-19T16:32:17.000Z

const handleFormSubmit = async () => {
    console.log("Form Submitted", formData);

    if (!signUp) {
        console.error("signUp function is not available.");
        return;
    }

    try {
        const signUpResult = await signUp.create({
            emailAddress: formData.accountDetails.email,
            password: formData.accountDetails.password,
        });

        console.log("SignUp attempt status:", signUpResult.status);
        console.log("Required fields: signUpResult.requiredFields);
        console.log("unverified fields: signUpResult.unverifiedFields);
        console.log("missing fields: signUpResult.missingFields);

        const response = await fetch(`/${lang}/signup/submit`, {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json',
            },
            body: JSON.stringify(formData),
        });

        console.log('HTTP Status Code from signup/submit:', response.status);

        let data = await response.json();

        if (!response.ok) {
            console.error(`Error submitting form data: ${response.status} ${response.statusText}`, 'Error details:', data);
            return;
        }

        console.log('Data submitted successfully:', data);
        router.push(`/${lang}/login`);
    } catch (error) {
        console.error('Error during sign-up or data submission:', error);
      
    }
};

@Asiatic Lion const handleFormSubmit = async () => { console.log("Form Submitted", formData); if (!signUp) { console.error("signUp function is not available."); return; } try { const signUpResult = await signUp.create({ emailAddress: formData.accountDetails.email, password: formData.accountDetails.password, }); console.log("SignUp attempt status:", signUpResult.status); console.log("Required fields: signUpResult.requiredFields); console.log("unverified fields: signUpResult.unverifiedFields); console.log("missing fields: signUpResult.missingFields); const response = await fetch(`/${lang}/signup/submit`, { method: 'POST', headers: { 'Content-Type': 'application/json', }, body: JSON.stringify(formData), }); console.log('HTTP Status Code from signup/submit:', response.status); let data = await response.json(); if (!response.ok) { console.error(`Error submitting form data: ${response.status} ${response.statusText}`, 'Error details:', data); return; } console.log('Data submitted successfully:', data); router.push(`/${lang}/login`); } catch (error) { console.error('Error during sign-up or data submission:', error); } };

Sun bearOP

2024-02-19T16:33:51.000Z

Thank you ðŸ™ðŸ»
For some reason now it redirected me to the log-in page again, here are the logs.

Asiatic Lion

2024-02-19T16:34:50.000Z

Whoops. my mistake. change to this again

console.log("SignUp attempt status:", signUpResult.status);
        console.log("Required fields:",  signUpResult.requiredFields);
        console.log("unverified fields: ", signUpResult.unverifiedFields);

@Asiatic Lion Whoops. my mistake. change to this again console.log("SignUp attempt status:", signUpResult.status); console.log("Required fields:", signUpResult.requiredFields); console.log("unverified fields: ", signUpResult.unverifiedFields);

Sun bearOP

2024-02-19T16:35:33.000Z

By the way, VSCode told me to do it like this in terms of paranthesis and whatnot (otherwise it gave errors)

Asiatic Lion

2024-02-19T16:36:32.000Z

so change to this.

console.log("SignUp attempt status:", signUpResult.status);
console.log("Required fields:", signUpResult.requiredFields);
console.log("unverified fields: ", signUpResult.unverifiedFields);

@Asiatic Lion so change to this. console.log("SignUp attempt status:", signUpResult.status); console.log("Required fields:", signUpResult.requiredFields); console.log("unverified fields: ", signUpResult.unverifiedFields);

Sun bearOP

2024-02-19T16:36:44.000Z

Oh yup now it works!

Sun bearOP

2024-02-19T16:37:54.000Z

Here are the new logs

Asiatic Lion

2024-02-19T16:39:09.000Z

Take a look at this. you should verify emailAddress before create signup.

it's not that verification email...

Sun bearOP

2024-02-19T16:42:21.000Z

https://tenor.com/view/confused-mikhail-varshavski-doctor-mike-i-dont-get-it-i-dont-understand-gif-26545894

Hold on

I am already verifying the e-mail

What does "unverified" stand for in this situation ?

Asiatic Lion

2024-02-19T16:45:22.000Z

ahh~~ so if you click signup button, what happens?

Sun bearOP

2024-02-19T16:45:34.000Z

It just redirects me back to the log-in page

Asiatic Lion

2024-02-19T16:45:40.000Z

you get verification code or link?

Sun bearOP

2024-02-19T16:46:05.000Z

Nope

Because the user doesn't even make it in here

It's like you never signed up in the first place

Which is strange, cause looking at their codes, we receive code 200

Which means, the sign-up is in theory working

As far as I understand

https://clerk.com/docs/reference/frontend-api/tag/Sign-Ups#operation/createSignUps

Asiatic Lion

2024-02-19T16:50:04.000Z

ahh~~ as you said, after creating signup, you should get verification link

Sun bearOP

2024-02-19T16:50:38.000Z

I don't get it because I also verified my e-mail and spam folders

There is no verification e-mail

Asiatic Lion

2024-02-19T16:51:00.000Z

to do that, await signUpAttempt.prepareEmailAddressVerification();
add this code right below the code signUp.create()

Sun bearOP

2024-02-19T16:51:46.000Z

Asiatic Lion

2024-02-19T16:54:28.000Z

signUpResult.prepareEmailAddressVerification({email_link: "email_link", email_link: your_login_url})

Sun bearOP

2024-02-19T16:55:19.000Z

Asiatic Lion

2024-02-19T16:57:00.000Z

change to prepareEmailAddressVerificationParams

Sun bearOP

2024-02-19T16:57:37.000Z

Asiatic Lion

2024-02-19T16:59:34.000Z

Oh no... my brain is boiling now...

signUpResult.prepareEmailAddressVerification({strategy: "email_link", redirectUrl: your_login_url})

change your_login_url to your real url...

@Asiatic Lion Oh no... my brain is boiling now... signUpResult.prepareEmailAddressVerification({strategy: "email_link", redirectUrl: your_login_url})

Sun bearOP

2024-02-19T17:00:13.000Z

That one worked!

Now for login url does it want my login page url or something from Clerk ?

Asiatic Lion

2024-02-19T17:00:32.000Z

your login page url

Sun bearOP

2024-02-19T17:00:56.000Z

app/[lang]/login/page.tsx

That's the url

Asiatic Lion

2024-02-19T17:01:45.000Z

ðŸ˜† then you need to get current lang first...

Sun bearOP

2024-02-19T17:01:59.000Z

Did they just introduce AI to VSCode or what is going on

It didn't use to auto complete like this until now

Asiatic Lion

2024-02-19T17:03:06.000Z

there's AI extensions for VSCode, but no idea if there's builtin AI feature...

Sun bearOP

2024-02-19T17:03:29.000Z

It's posible it's from Cody or something

Asiatic Lion

2024-02-19T17:03:43.000Z

anyway

redirectUrl: `/${lang}/login`

Sun bearOP

2024-02-19T17:04:41.000Z

It gives some errors

@Asiatic Lion anyway redirectUrl: `/${lang}/login`

Asiatic Lion

2024-02-19T17:05:06.000Z

edited.. you should end it with `

Sun bearOP

2024-02-19T17:05:47.000Z

Still gives some errors

Saved by autocomplete

Alright, so we have more errors after redirection

And it did not send any verification e-mail, just checked.

Also why is it using that star viper URL when I have my own domain

It should be jobsbringer.com/whatever stuff it needs to do

Asiatic Lion

2024-02-19T17:14:10.000Z

phew... sorry @Sun bear I need to be offline now.
Let's solve this after I'm back.
in the meantime, check this link.
https://github.com/clerk/clerk-react-examples/tree/main

@Asiatic Lion phew... sorry <@998405690718703696> I need to be offline now. Let's solve this after I'm back. in the meantime, check this link. https://github.com/clerk/clerk-react-examples/tree/main

Sun bearOP

2024-02-19T18:02:23.000Z

No worries Witty, I can wait. Just let me know when you have some time to help me. I will reply as soon as I'm online as well.

I prefer waiting to not mess things up since authentication is a crucial part of my platform and I want to get it right.

Also thank you for helping me so far ðŸ™ðŸ»

Sun bearOP

2024-02-20T18:02:48.000Z

https://tenor.com/view/jackie-redmond-jackie-redmond-jackie-waiting-waiting-gif-3542959330543958289

Sun bearOP

2024-02-20T18:22:33.000Z

I've been reading a bit into it and it looks like they do not recommend using the Email Link strategy because it doesn't do that well against spam accounts. Basically they recommend verifying the account during the sign-up process.

https://clerk.com/blog/how-we-roll-email-verification

Sun bearOP

2024-02-20T18:47:33.000Z

BINGO!
I think I managed to solve it!!!

https://tenor.com/view/yes-yes-yes-oh-yeah-you-yes-be-it-yea-yes-gif-24983796

Sun bearOP

2024-02-20T18:50:37.000Z

Answer

Asiatic Lion

2024-02-20T19:35:53.000Z

Wow,, glad to hear that.

sorry to not help you.

@Asiatic Lion sorry to not help you.

Sun bearOP

2024-02-20T19:40:49.000Z

You did help, and it was also thanks to you that I managed to solve the issue! I'm now working on updating the login page as well since the log-in doesn't work at the moment.

Have an awesome day Adam ðŸ˜

Asiatic Lion

2024-02-20T19:41:24.000Z

ðŸ˜† You too.