[SOLVED] Signup with Web3Auth fails

[rio]

I get an error that tells me I need to install @web3auth.

I have watched the instruction video, but cannot tell what I’m doing wrong with my code.

<script src="https://cdn.jsdelivr.net/npm/web3@latest/dist/web3.min.js"></script>
<script src="https://unpkg.com/[email protected]/dist/moralis.js">
<script src="https://unpkg.com/@web3auth/web3auth@latest/dist/web3auth.umd.min.js"></script>

<button id="btn-signin">Signin</button>

<script>
/* Moralis init code */
const serverUrl = "MY-SERVER-URL";
const appId = "MY-APP-ID";
Moralis.start({ serverUrl, appId });

async function SignIn() {
const user = await Moralis.authenticate({
            provider: "web3Auth",
            clientId: "MY-CLIENT-ID",
            loginMethodsOrder: [
            "line", "google", "facebook", "twitter", "reddit", "discord", "twitch", "apple", "github", "kakao", "linkedin", "weibo", "wechat", "email_passwordless"
            ],
            theme: "light",
})
}  
   
document.getElementById("btn-signin").onclick = SignIn;
</script>

I could have successfully logged-in/logged-out.
Now, I want my users signup via Web3Auth.
Thanks in advance.

[cryptokid]

what do you mean with sign up?

you could try with some specific versions of web3auth to see if it works

[rio]

@cryptokid

what do you mean with sign up?

For the first time user, I want to retrieve user’s credential(email) to save it on my end.
Then, I can log the user in to both Moralis and My app, right?

@cryptokid

you could try with some specific versions of web3auth to see if it works

How? Sorry for not having some basic understanding how it works.

[cryptokid]

What is the code that use use for sign up? it looks like the code that you posted is for sign in. Is that code for sign in working?

you can specify a specific version instead of using latest here

@rio

web3auth@latest

similar to how it is specified a specific version for Moralis SDK here

@rio

[email protected]

[alex]

If that’s your exact code, you are missing a closing script tag for moralis-v1. It should be:

<script src="https://unpkg.com/[email protected]/dist/moralis.js"></script>

[rio]

@alex

you are missing a closing script tag

Yes, my bad.
Now, I get the following error when I click Signin

This is the exact code I have now.

I want to create the first time users’ account and save their email on my db. Is is possible? How would you handle the users need to Sign-up for the first time with web3auth?

[alex]

That broadcast-server error seems to be normal, I get it as well.

After logging in the Web3Auth modal, then you are likely authenticated - the user object will be created in your Moralis server database.

You can check by using console.log(Moralis.User.current()) after awaiting your authenticate and check out the attributes (wallet address, etc.). Also check your server dashboard in your _User class/table.

If you want to save the email used for Web3Auth, you will have to do this manually. You can easily get it from the localStorage item called openlogin_store that is saved after logging in, and then you can save this manually to the current user object.

[rio]

Thanks for the detail. I am getting the idea of how I can save the email.
But, I’m still not at the starting line. With the code below, I still cannot have the web3auth signup modal popup.

async function SignIn() {

const user = await Moralis.authenticate({
	provider: "web3Auth",
	clientId: "BAqDLxMeQJ3ziOeqnulGc90Z4NBLmiIerNFqfC9JFaBxn0xTCYqVeKrge53Ubwk_HdpGFcZdnSw7aFS1veBwWQo",
})
}  

This is what I get on console.

What am doing wrong here?

[cryptokid]

you could add some lines with console.log, to be sure that SignIn function gets called

[rio]

Yes, SignIn function is called for sure, because I do get the following in return.

It says 404 and Session likely expired.

Could you please point me in the right direction?

[cryptokid]

I don’t know why it returns that error

[rio]

…, got to be something basic I’m mission here tho.

[alex]

Has the modal ever popped up?

Try clearing your app’s localStorage items (developer tools > Application tab). Based on those console.logs (especially the browser object), it looks like it has just automatically signed you in because you have done it previously where your session is still cached.

Otherwise try this demo.

[rio]

Finally I got it why modal is not showing.
Somehow, it was hidden behind another element.
Thank you so much for your thoughtful and devoted feedback. It really helped me a lot. I am lucky to have you in here, just impressive.