Home/ Questions/Q 3862
Next
In Process
monkey
  • 0
Enlightened
Asked: 2021-12-20T15:53:54+00:00 In:

Dự án NFT đơn giản với Metamask và Web3: Lấy thông tin tài khoản

  • 0

Dự án NFT đơn giản với Metamask và Web3: Lấy thông tin tài khoản

blockchainmetamask
Share

1 Answer

  1. Enlightened

    Để lấy được thông tin tài khoản chúng ta cần thực hiện các bước sau:

    1. Khởi tạo dự án
    2. Trong HomeController tạo 1 hàm thế này:

    @DoGet("/account")
public Redirect account() {
    return Redirect.to("/account.html");
}

    3. Tạo file account.html trong thư mục static:

    <!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>NFT Game</title>
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
  <link rel="stylesheet" href="/css/style.css">
</head>
<body>
<div class="container">
  <div class="row">
    <div class="col-md-12 text-center">
      <h3>Welcome to NFT Game</h3>
    </div>
  </div>
  <div class="row">
    <div class="col-md-12 text-center">
      <button id="enableEthereumButton" class="btn btn-primary">Enable Ethereum</button>
    </div>
    <div class="col-md-12 text-center mt-2">
      <h5>Account: <span id="showAccount" class="text-success"></span></h5>
    </div>
    <div class="col-md-12 text-center mt-2">
      <h5>Balance: <span id="showBalance" class="text-danger"></span></h5>
    </div>
  </div>
</div>
<script src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/web3/1.6.1/web3.min.js" integrity="sha512-5erpERW8MxcHDF7Xea9eBQPiRtxbse70pFcaHJuOhdEBQeAxGQjUwgJbuBDWve+xP/u5IoJbKjyJk50qCnMD7A==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="/js/main.js"></script>
<script>
const ethereumButton = $('#enableEthereumButton');
const showAccount = $('#showAccount');
const showBalance = $('#showBalance');

var account = '';

async function getAccount() {
  const accounts = await ethereum.request({ method: 'eth_requestAccounts' });
  account = accounts[0];
  showAccount.text(account);
  getBalance();
}

async function getBalance() {
  const balance = await ethereum.request({
    method: 'eth_getBalance',
    params: [
      account,
          "latest"
    ]
  });
  showBalance.text(parseInt(balance, 16));
}

(function() {
if (typeof window.ethereum === 'undefined') {
  return;
}
console.log('MetaMask is installed!');

ethereumButton.on('click', () => {
  getAccount();
});
})();
</script>
</body>
</html>

    4. Truy cập vào đường link: http://localhost:8080/account

    5. Xong

    • 0

You must login to add an answer.

Need An Account,