Need help with Current user and logout button

Moralis General
#1

Hello everybody,
Please i need help in this code, even if i signed to metamask using button ( Sign with Metamask ) and i refresh the page it always still connected and i should click on logout button
what i want to do
1 - when you refresh the page it logout automatically.
2 - display logout button only if it is signed in
and thank you in advance!

<!DOCTYPE html>
<html lang="en">
<head>
    <script src="https://cdn.jsdelivr.net/npm/web3@latest/dist/web3.min.js"></script>
    <script src="https://unpkg.com/moralis/dist/moralis.js"></script>
    <title>Metamask Login</title>
</head>
<body>
    <h1>Login with metamask :</h1>
    <button id="login">Login with Metamask</button>
    <button id="logout">Logout</button>

<script>
    //Connect SDK MORALIS
const serverUrl = "https://jt9kvea7eitk.usemoralis.com:2053/server";
const appId = "2FE0jmEybp6PgKfbetNpzq8BoTNF8f4uQgDd2xY5";
Moralis.start({ serverUrl, appId });

    //Login function
async function login() {
  let user = Moralis.User.current();
  if (!user) {
   try {
      user = await Moralis.authenticate({ signingMessage: "Hello World!" })
      document.getElementById('login').innerHTML = user.get('ethAddress')
      document.getElementById('logout').style.display = "block"
   } catch(error) {
     console.log(error)
   }
  }
}

    //Logout function
async function logOut() {
  await Moralis.User.logOut();
  document.getElementById('logout').style.display = "none"
  document.getElementById('login').innerHTML = "Login with Metamask"
}


document.getElementById("login").onclick = login;
document.getElementById("logout").onclick = logOut;
</script>
</body>
</html>
#2

what is the expected behaviour, the user will be logged in until the logout is used, so that he doesn’t have to login on every page refresh

#3

The expected behaviour from the logged users is to display the contract address instead on the login button every time they come back to the website + loggout button i need help for this please and thank you bro

#4

Capture.PNG
Capture.PNG419×616 71.9 KB

like this

#5

I don’t understand what is the problem

#6

when you refresh the page i want to display the contract address in the login button if you already loggin in

  • display logout button only for logged users
#7

ok, what doesn’t work, you get any error in your browser console?

#8

i solved the problem of displaying the contract for logged users
now i need just to display the logout button only for the logged user, here is the code if any help

<!DOCTYPE html>
<html lang="en">
<head>
    <script src="https://cdn.jsdelivr.net/npm/web3@latest/dist/web3.min.js"></script>
    <script src="https://unpkg.com/moralis/dist/moralis.js"></script>
    <title>Metamask Login</title>
</head>
<body>
    <h1>Login with metamask :</h1>
    <button id="login">Login with Metamask</button>
    <button id="logout">Logout</button>

<script>
    //Connect SDK MORALIS
const serverUrl = "https://jt9kvea7eitk.usemoralis.com:2053/server";
const appId = "2FE0jmEybp6PgKfbetNpzq8BoTNF8f4uQgDd2xY5";
Moralis.start({ serverUrl, appId });
checkuser()

    //Login function
async function login() {
  let user = Moralis.User.current();
  if (!user) {
   try {
      user = await Moralis.authenticate({ signingMessage: "Hello World!" })
      document.getElementById('login').innerHTML = user.get('ethAddress')
      document.getElementById('logout').style.display = "block"
   } catch(error) {
     console.log(error)
   }
  }
}

    //Logout function
async function logOut() {
  await Moralis.User.logOut();
  document.getElementById('logout').style.display = "none"
  document.getElementById('login').innerHTML = "Login with Metamask"
}

  // checkuser function
function checkuser(){
  Moralis.User.currentAsync().then(function(user) {
  document.getElementById('login').innerHTML = user.get('ethAddress')
});
}

document.getElementById("login").onclick = login;
document.getElementById("logout").onclick = logOut;
</script>
</body>
</html>
#9

Now I think that I understand what you wanted to say, I usually have something like this:

    user = await Moralis.User.current();
    if (!user) {
        document.getElementById("login_button").style.display = "block";
        document.getElementById("logout_button").style.display = "none";

    } else {
        document.getElementById("login_button").style.display = "none";
        document.getElementById("logout_button").style.display = "block";
    }
#10

i tried but it doesn’t work, can you please check

<script>
    //Connect SDK MORALIS
const serverUrl = "https://jt9kvea7eitk.usemoralis.com:2053/server";
const appId = "2FE0jmEybp6PgKfbetNpzq8BoTNF8f4uQgDd2xY5";
Moralis.start({ serverUrl, appId });
checkuser()

  //Condition Logout button
user = await Moralis.User.current();
    if (!user) {
        document.getElementById("login_button").style.display = "block";
        document.getElementById("logout_button").style.display = "none";

    } else {
        document.getElementById("login_button").style.display = "none";
        document.getElementById("logout_button").style.display = "block";
    }

    //Login function
async function login() {
  let user = Moralis.User.current();
  if (!user) {
   try {
      user = await Moralis.authenticate({ signingMessage: "Hello World!" })
      document.getElementById('login').innerHTML = user.get('ethAddress')
   } catch(error) {
     console.log(error)
   }
  }
}

    //Logout function
async function logOut() {
  await Moralis.User.logOut();
  document.getElementById('login').innerHTML = "Login with Metamask"
}

  // checkuser function
function checkuser(){
  Moralis.User.currentAsync().then(function(user) {
  document.getElementById('login').innerHTML = user.get('ethAddress')
});
}

document.getElementById("login").onclick = login;
document.getElementById("logout").onclick = logOut;
</script>
#11

you don’t have to copy the code that I pasted, you have to understand it and modify it to work in your case