如何将 MetaMask 与 Web3.js 版本 1.2.6 连接?

Posted

技术标签:

【中文标题】如何将 MetaMask 与 Web3.js 版本 1.2.6 连接?【英文标题】:How to connect MetaMask with Web3.js version 1.2.6? 【发布时间】:2020-05-29 06:23:34 【问题描述】:

我已经编写了一个智能合约(部署在 Ropsten 上)和一个网站(node.js、express.js 和 ejs)

我可以使用 Infura API 从合同中读取数据并成功显示在网页上。但是,我想通过 Metamask 在合约上写入数据。 现在。我无法将 MetaMask 与 web3.js 1.2.6 连接。我也检查了 Web3.givenProvider return null。

(我可以通过 MyEtherWallet + Meta Mask 与我的智能合约进行交互)

详细信息:

开发环境:node.js express.js ejs web3.js(1.2.6)

浏览器:chrome + MetaMask:localhost:3000 / 127.0.0.1:3000

const express = require('express');
const router = express.Router();

const Web3 = require('web3');
//const web3 = new Web3(new Web3.providers.HttpProvider("https://ropsten.infura.io/v3/xxxxxxxx"));
const web3 = new Web3(Web3.givenProvider);

const Tx = require('ethereumjs-tx');

let myAddress = '0x3E0980E7cea6804B01BEA49cb70F9B7Cxxxxxxxx';
const abi = [***VERY LONG ABI***];
const address = "0x07cf2ecef130495ea18a25e4f1dfbfc4xxxxxxxx";
const MyContract = new web3.eth.Contract(abi, address);

// define the home page route
router.get('/', (req, res, next) => 
    const resultHome = [];

    MyContract.methods.name().call().then((name) => 
        resultHome.push(name);
        symbol();
    )
    const symbol = () => 
        MyContract.methods.symbol().call().then((symbol) => 
            resultHome.push(symbol);
            totalSupply();
        )
    
    const totalSupply = () => 
        MyContract.methods.totalSupply().call().then((totalSupply) => 
            resultHome.push(totalSupply);
            home();
        )
    

    const home = () => 
        res.render('erc20/index', 
            pageTitle: 'ERC-20E Token Standard Enhanced - Info',
            path: 'erc20',
            subPath: 'erc20Info',
            name: resultHome[0],
            symbol: resultHome[1],
            address: address,
            totalSupply: resultHome[2] / 100
        )
    
)

router.get('/source', (req, res, next) => 
    res.sendFile(__dirname + '/erc20Source.txt');
)

// define the controller route
router.get('/controller', (req, res, next) => 
    let resultController = [];

    MyContract.methods.showRun().call().then((showRun) => 
        resultController.push(showRun);
        controller();
    )

    const controller = () => 
        res.render('erc20/controller', 
            pageTitle: 'ERC-20E Token Standard Enhanced - Controller',
            path: 'erc20',
            subPath: 'erc20Controller',
            showRun: resultController[0]
        )
    
)

module.exports = router;

【问题讨论】:

【参考方案1】:

问题已经解决了,因为我把web3放在前端而不是后端。

【讨论】:

以上是关于如何将 MetaMask 与 Web3.js 版本 1.2.6 连接?的主要内容,如果未能解决你的问题,请参考以下文章

如何使用 web3.js 注销 MetaMask 帐户

Metamask 停止注入 web3.js

在 React 中使用 Web3 和 Metamask

Web3 JS 库(& Metamask),获取代币余额

Metamask BSC bep20 令牌的 web3 JS 支付按钮

前端Vue项目调用页面web3.js:连接metaMask钱包,(查询钱包ETH余额,查询代币余额,ETH转账,代币转账,代币授权,查询授权数量,计算价格)等功能