web3.js对接智能合约

web3.js, MetaMask, 智能合约

1、判断是否安装MetaMask

if (typeof window.ethereum !== 'undefined') {
  try {
    const provider = window.ethereum;
    // 请求用户账号授权
    // 如果未授权就会弹出下图授权界面, 如果已授权就跳过了
    await provider.enable();
    ......
  } catch (error) {
    console.log('User denied account access');
  }
} else {
  console.log('Please install MetaMask')
}

授权登录

2、实例化一个provider

const web3 = new Web3(provider);
const coinbase = await web3.eth.getCoinbase(); // 当前连接的账户

let balance;
if (coinbase) {
  balance = await web3.eth.getBalance(coinbase); // 账户余额
  balance = web3.utils.fromWei(balance, 'ether');
} else {
  console.log('No account connected');
  return;
}
const chainId = await web3.eth.getChainId();
const networkId = await web3.eth.net.getId();

3、连接合约

const contractAddress = '0x*******'; // 合约地址
const abi = [***]; // 合约abi，相当于合约提供的对接文档
const contract = new web3.eth.Contract(abi, contractAddress);

// 调用合约方法

// methods.myMethod.call 此种调用方式无法改变合约状态。
const decimals = await contract.methods.decimals().call(); 

// methods.myMethod.send 此种调用方式会改变合约状态。
contract.methods.myMethod().send({from: 'account'}, function(error, transactionHash){
    ...
});

4、provider events

provider.on("accountsChanged", (accounts) => {
  // 账号改变
});
provider.on("chainChanged", (chainId) => {
  // 链改变
  window.location.reload()
});
provider.on("disconnect", (code, reason) => {
  // 断开连接
});

参考文档
web3.js 中文文档