Dự án NFT đơn giản với Metamask và Web3: Lấy thông tin tài khoản
Dự án NFT đơn giản với Metamask và Web3: Lấy thông tin tài khoản
blockchain
metamask
Remain: 5
1 Answer
monkey
Enlightened
monkey
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:
- Khởi tạo dự án
- Trong HomeController tạo 1 hàm thế này:
@DoGet("/account") public Redirect account() { return Redirect.to("/account.html"); }
- Tạo file
account.html
trong thư mụcstatic
:
<span><!DOCTYPE html></span> <span><<span>html</span> <span>lang</span>=<span>"en"</span>></span> <span><<span>head</span>></span> <span><<span>meta</span> <span>charset</span>=<span>"UTF-8"</span>></span> <span><<span>title</span>></span>NFT Game<span></<span>title</span>></span> <span><<span>link</span> <span>rel</span>=<span>"stylesheet"</span> <span>href</span>=<span>"https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css"</span> <span>integrity</span>=<span>"sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm"</span> <span>crossorigin</span>=<span>"anonymous"</span>></span> <span><<span>link</span> <span>rel</span>=<span>"stylesheet"</span> <span>href</span>=<span>"/css/style.css"</span>></span> <span></<span>head</span>></span> <span><<span>body</span>></span> <span><<span>div</span> <span>class</span>=<span>"container"</span>></span> <span><<span>div</span> <span>class</span>=<span>"row"</span>></span> <span><<span>div</span> <span>class</span>=<span>"col-md-12 text-center"</span>></span> <span><<span>h3</span>></span>Welcome to NFT Game<span></<span>h3</span>></span> <span></<span>div</span>></span> <span></<span>div</span>></span> <span><<span>div</span> <span>class</span>=<span>"row"</span>></span> <span><<span>div</span> <span>class</span>=<span>"col-md-12 text-center"</span>></span> <span><<span>button</span> <span>id</span>=<span>"enableEthereumButton"</span> <span>class</span>=<span>"btn btn-primary"</span>></span>Enable Ethereum<span></<span>button</span>></span> <span></<span>div</span>></span> <span><<span>div</span> <span>class</span>=<span>"col-md-12 text-center mt-2"</span>></span> <span><<span>h5</span>></span>Account: <span><<span>span</span> <span>id</span>=<span>"showAccount"</span> <span>class</span>=<span>"text-success"</span>></span><span></<span>span</span>></span><span></<span>h5</span>></span> <span></<span>div</span>></span> <span><<span>div</span> <span>class</span>=<span>"col-md-12 text-center mt-2"</span>></span> <span><<span>h5</span>></span>Balance: <span><<span>span</span> <span>id</span>=<span>"showBalance"</span> <span>class</span>=<span>"text-danger"</span>></span><span></<span>span</span>></span><span></<span>h5</span>></span> <span></<span>div</span>></span> <span></<span>div</span>></span> <span></<span>div</span>></span> <span><<span>script</span> <span>src</span>=<span>"https://code.jquery.com/jquery-3.6.0.js"</span> <span>integrity</span>=<span>"sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk="</span> <span>crossorigin</span>=<span>"anonymous"</span>></span><span></span><span></<span>script</span>></span> <span><<span>script</span> <span>src</span>=<span>"https://cdnjs.cloudflare.com/ajax/libs/web3/1.6.1/web3.min.js"</span> <span>integrity</span>=<span>"sha512-5erpERW8MxcHDF7Xea9eBQPiRtxbse70pFcaHJuOhdEBQeAxGQjUwgJbuBDWve+xP/u5IoJbKjyJk50qCnMD7A=="</span> <span>crossorigin</span>=<span>"anonymous"</span> <span>referrerpolicy</span>=<span>"no-referrer"</span>></span><span></span><span></<span>script</span>></span> <span><<span>script</span> <span>src</span>=<span>"/js/main.js"</span>></span><span></span><span></<span>script</span>></span> <span><<span>script</span>></span><span> <span>const</span> ethereumButton = $(<span>'#enableEthereumButton'</span>); <span>const</span> showAccount = $(<span>'#showAccount'</span>); <span>const</span> showBalance = $(<span>'#showBalance'</span>); <span>var</span> account = <span>''</span>; <span>async</span> <span><span>function</span> <span>getAccount</span>(<span></span>) </span>{ <span>const</span> accounts = <span>await</span> ethereum.request({ <span>method</span>: <span>'eth_requestAccounts'</span> }); account = accounts[<span>0</span>]; showAccount.text(account); getBalance(); } <span>async</span> <span><span>function</span> <span>getBalance</span>(<span></span>) </span>{ <span>const</span> balance = <span>await</span> ethereum.request({ <span>method</span>: <span>'eth_getBalance'</span>, <span>params</span>: [ account, <span>"latest"</span> ] }); showBalance.text(<span>parseInt</span>(balance, <span>16</span>)); } (<span><span>function</span>(<span></span>) </span>{ <span>if</span> (<span>typeof</span> <span>window</span>.ethereum === <span>'undefined'</span>) { <span>return</span>; } <span>console</span>.log(<span>'MetaMask is installed!'</span>); ethereumButton.on(<span>'click'</span>, () => { getAccount(); }); })(); </span><span></<span>script</span>></span> <span></<span>body</span>></span> <span></<span>html</span>></span>
- Truy cập vào đường link: http://localhost:8080/account
- Xong
-
0