[SOLVED] Upgrading wallet-login, one-click auth from v1 to v2 Moralis

Hello party people!

Sorry in advance if this is a dumb question.

I am using the Javascript MERN tech stack.

I have a simple question: Do I need to keep the Web API key secret?

Context:

I was working on building an app using v1 of Moralis and now I need to upgrade to v2 Moralis, except everything has changed, and I’m facing some ambiguity in the v2 docs. For various reasons it looks like v1 self-hosted Moralis isn’t going to work for my needs, so I’m going to have to upgrade to v2 to proceed with the project.

I’m trying to implement v2 wallet-based, one-click, user auth within my app as part of the upgrade to v2 Moralis. It appears that Moralis has switched to using an API based system and removed the vast majority of client side interaction.

From the documentation its looking like I need to set up an API in Express.js to feed-forward the stuff that is happening on the client side, like signing in and keeping track of user state changes.

I understand the process of signing in:

  1. Request a challenge message from the Moralis Web API, it returns a message that needs to be signed by the client.
  2. The client signs the challenge message with their wallet, which produces a verifiable signature.
  3. The ā€œsignatureā€ is then sent back to the Moralis Web API to verify, where the original-message-to-be-signed, plus the the signature, are passed to a cryptographic recovery function to produce the original wallet address that signed the message, thus proving ownership over that account without ever disclosing private keys.

What I’m confused about is the docs show a ā€œNode.jsā€ way of doing things (which I take to be server side), and a Javascript way of doing things (which confuses me a bit because it seems like client side code?). The Node.js way is easy for me to understand coming from a web2.0 background, but what kinda throws me off is that the Javascript method looks like its intended for use on the client side, but that would require putting my Moralis Web API key into client side code…

My best guess is that I’m supposed to keep the Web API key secret by hosting it on my web server and set up an API on my web server to act as a ā€œmiddlemanā€ that is interdicting these calls, but can someone confirm that this is the correct way of doing things?

For reference I’m looking at this page in the docs:

I’ve also looked at the specific method for using metamask, but the examples in the docs show a Next.js + React app that is making specific use of a next-auth library, which I am unfamiliar with (I’m not using Next.js):

This page of the docs that discusses web authentication (https://docs.moralis.io/docs/web3-authentication#how-it-works) describes the process and makes it seem like my server/API is supposed to act like a middleman:

1. Your client requests a sign-in challenge.
2. Your server requests a challenge from the Moralis Auth API and passes it to the client.
3. The client then signs the message and passes it to your server for verification.
4. Your server verifies the challenge with Moralis.

Thanks in advance for your help!

Yes you should use Moralis (with your API key) on the server side. Why you can do safely this in Next.js (a framework with server side features) is covered in the Your First Dapp tutorial which you should be following first.

If you’re using MERN, then you can integrate with Moralis in your Express.js server.

1 Like

@alex thanks for your fast reply, I know what to do now.