Can't Authenticate with React moralis

Moralis General
#1

Hello Everyone,

Just Started learning about Moralis, i just wanted to try doing a doing a conditions if isAuthenticated show the text but it doesn’t, i had take the moralis docs example to start but didn’t work anyway :

import React, { useEffect } from "react";
import { useMoralis } from "react-moralis";
// import Navigations from "./routing/Navigations";
import "./styles/styles.scss";

const App = () => {
  const { authenticate, isAuthenticated, user, Moralis } = useMoralis();

  if (!isAuthenticated) {
    return (
      <div>
        <button onClick={() => authenticate()}>Authenticate</button>
      </div>
    );
  }

  return (
    <div>
      <h1>Welcome {user.get("username")}</h1>
    </div>
  );
  // return <Navigations />;
};

export default App;


import React from "react";
import ReactDOM from "react-dom";
import App from "./App";
import { MoralisProvider } from "react-moralis";

ReactDOM.render(
  <React.StrictMode>
    <MoralisProvider
      appId="xxxxx"
      serverUrl="xxxx"
    >
      <App />
    </MoralisProvider>
  </React.StrictMode>,
  document.getElementById("root")
);

of course i put the key and the serverUrl in my app

when i click on authenticate it goes to the metamask window, ask me to sign when i sign the window go back to my component but doesn’t display text as if i was authenticate

no error message and if i console log isAuthenticated after is the value is False.

Thanks for your future help !

1 Like
#2

Hey @JonnyDev

I’ve tried your code and it works fine

Try to add logout button and repeat athenticating:

return (
    <div>
      <h1>Welcome {user.get("username")}</h1>
      <button onClick={() => logout()} disabled={isAuthenticating}>
        logout
      </button>
    </div>
  );
2 Likes
#3

Thanks for your help, but my problem was that i was on localhost (-_-) lol… sorry

#4

Hey @JonnyDev

It’s okay.
Happy BUIDLing :man_mechanic:

#5

Thanks your very much !