Nos anterior desplegado una red de contratos de prueba Ropsten
Hacemos este contrato sólo se puede acceder por la remezcla
Entonces, ¿cómo crear una página web para interactuar con este contrato que Eth
Tenemos que utilizar WEB3
nodo de un paquete es web3
Así que tenemos que utilizar nodo, instalarlo usted mismo
Vamos a escribir un pequeño proyecto de prueba
Cualquier usuario puede consultar el equilibrio Ropsten
Crear una carpeta
init NPM
La inicialización se ha completado,
package.json archivo generado
Entonces instalamos web3
NPM instalar web3 --save
instalado
Entonces tenemos que escribir una simple página html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Hello World</title>
<script src="node_modules/web3/dist/web3.min.js"></script>
</head>
<body>
<div>欢迎来到Ropsten余额查询系统</div>
<input type="text" id="user_address" placeholder="请输入用户地址">
<input type="button" onclick="checkBalance()" value="查询">
<div>
<span>余额: </span>
<span id="text_balance"></span>
</div>
</body>
</html>
Acabamos de instalar un web3,
Ahora la introducción de lo web3
<script src="node_modules/web3/dist/web3.min.js"></script>
Entonces tenemos que escribir js, operación html
if (typeof web3 !== 'undefined') {
web3 = new Web3(web3.currentProvider);
} else {
web3 = new Web3(new Web3.providers.HttpProvider("https://ropsten.infura.io/v3/a1538f216f9f4f1480f97d160d9ecf67"));
}
function checkBalance() {
let inputUserAddress = document.getElementById("user_address");
let userAddress = inputUserAddress.value;
web3.eth.getBalance(userAddress).then(function (balance) {
console.log('balance:', balance)
let text_balance = document.getElementById("text_balance");
text_balance.textContent = balance;
})
}
Tales consultas de saldo cosas nuestra red Ropsten fue escrito
muy sencillo
Ahora a prueba
A continuación, sólo encontrar la dirección de un usuario
tal como
0xaFad1D75b685C14d8B48006286E5da00234F96F8
A continuación, comprobar lo
éxito