首页写一段DAPP前端代码

写一段DAPP前端代码

时间: 2023-08-25 14:06:18 浏览: 162

下面是一个简单的DAPP前端代码示例，用于显示以太坊钱包地址和余额： ``` <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>My DAPP</title> </head> <body> <h1>My DAPP</h1> <p>钱包地址: <span id="walletAddress"></span></p> <p>余额: <span id="balance"></span> ETH</p> <script src="https://cdn.jsdelivr.net/gh/ethereum/web3.js/dist/web3.min.js"></script> <script> // 连接以太坊节点 var web3 = new Web3(Web3.givenProvider || "http://localhost:8545"); // 获取钱包地址和余额 web3.eth.getAccounts().then(function(accounts) { var address = accounts[0]; document.getElementById("walletAddress").innerText = address; web3.eth.getBalance(address).then(function(balance) { var ethBalance = web3.utils.fromWei(balance, 'ether'); document.getElementById("balance").innerText = ethBalance; }); }); </script> </body> </html> ``` 在这个代码示例中，我们使用了Web3.js库来与以太坊节点进行交互。首先，我们创建了一个Web3对象，用于连接以太坊节点。然后，使用web3.eth.getAccounts()方法获取钱包地址。接着，使用web3.eth.getBalance()方法获取钱包余额，并使用web3.utils.fromWei()方法将余额从Wei转换为ETH。最后，将钱包地址和余额显示在页面上。需要注意的是，这个代码示例仅仅是一个简单的示例，实际开发中需要根据具体业务需求进行扩展和优化。同时，还需要注意安全问题，例如如何保护私钥等方面。

阅读全文