[Ethereum] Unable to connect to metamask using web3

metamaskweb3js

I have tried everything but just can't get the web3.currentProvider to work. I have metamask installed and working and somehow want to connect the website on the test network. Has there been some recent update which is not reflected in the documentation?

Best Answer

The problem here is likely that you are trying to run your page locally, which is explicitly restricted in MetaMask:

🌐 Http(s) - Web Server Required

Due to browser security restrictions, we can't communicate with dapps running on file://. Please use a local server for development.

You will need to publish your code to a local server to test MetaMask functionality.

In the situation where you do not need the MetaMask user context, you can use the HttpProvider fallback using infura.io:

https://github.com/shawntabrizi/ETH-Balance/blob/master/index.html#L13

window.web3 = new Web3(new Web3.providers.HttpProvider("https://mainnet.infura.io/<APIKEY>"));

This should allow you to do basic read operations on the Ethereum blockchain without needing to deploy to a local test server.

Related Solutions

Metamask – Why is Metamask web3.eth.account[0] Undefined?

Metamask does not let you use synchronous functions. Use instead:

web3.eth.getAccounts(function(error, accounts) {
    ...
});

And remove your second log. You only want to do things after you have properly initialised.

Metamask Connection – How to Connect Web3.js 1.0.x to Metamask

Eureka!!! (without special Archimedes style!)

Finally I found.

window.addEventListener('load', async () => {
    // Modern dapp browsers...
    if (window.ethereum) {
        window.web3 = new Web3(ethereum);
        try {
            await ethereum.enable();
            var accounts= await web3.eth.getAccounts();
            var option={from: accounts[0] };
            var myContract = new web3.eth.Contract(abi,contractAddress);
            myContract.methods.RegisterInstructor('11','Ali')
            .send(option,function(error,result){
                if (! error)
                    console.log(result);
                else
                    console.log(error);
            });
        } catch (error) {
            // User denied account access...
        }
    }
    // Legacy dapp browsers...
    else if (window.web3) {
        window.web3 = new Web3(web3.currentProvider);
        // Acccounts always exposed
        web3.eth.sendTransaction({/* ... */});
    }
    // Non-dapp browsers...
    else {
        console.log('Non-Ethereum browser detected. You should consider trying MetaMask!');
    }
});

This connects to Metamask properly. Main problem was that our browsers are supermodern!!!

Thanks to @Ismael, because of his help for 70% of solution.

Best Answer

Related Solutions

Metamask – Why is Metamask web3.eth.account[0] Undefined?

Metamask Connection – How to Connect Web3.js 1.0.x to Metamask

Related Topic