0

I'm quite new to etherium development, so most probably I'm doing smth wrong. I have a ganache running locally, a contract deployed there and I want to build a small app to get familiar with the process. I've chosen Vue for the app development and currently I ran into a problem with web3 connection to the ganache.

In my root component I create an instance of Web3:

const etherUri = 'http://127.0.0.1:7545'

let web3 = new Web3(Web3.currentProvider)

if (!web3.isConnected) {
    return 'Unable to connect to ethereum node at ' + etherUri
} else {
    let accounts = web3.eth.accounts
    return accounts
}

Ganache is up and running, Metamask connects to it without any problems. However, trying to connect from my app I always get isConnected = false.

The app runs as a npm run dev server. No errors in console.

I don't use js that much, so probably there are some mistakes in my setup. Any clues would be highly appreciated. Thanks in advance!

1

Try it

window.addEventListener('load', function() {

    // Checking if Web3 has been injected by the browser (Mist/MetaMask)
    if (typeof web3 !== 'undefined') {
        // Use Mist/MetaMask's provider
        web3js = new Web3(web3.currentProvider);
    } else {
        console.log('No web3? You should consider trying MetaMask!')
        // fallback - use your fallback strategy (local node / hosted node +     in-dapp id mgmt / fail)
        web3js = new Web3(new Web3.providers.HttpProvider("http://    localhost:8545"));
    }

    // Now you can start your app & access web3 freely:
    startApp()

})

Web3 - Ethereum Browser Environment Check

  • Thanks a lot, I've came to this eventually. In fact, my code works as well, despite isConnected is false I can fetch accounts and work with contracts. – Nbooo Feb 18 '18 at 19:20
1

If you are using vue then try this (similar to answer by shawn):

const Web3 = require('web3');
let web3js;

export default {
created() {
  if (typeof web3 !== 'undefined') {
    web3js = new Web3(web3.currentProvider);
    // then call functions to determine account and balance
  } else {
    web3js = new Web3(new Web3.providers.HttpProvider(provider));
    // replace provider with URL of your choice
  }
},
...
};

Web3/Vue implementation on Github

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.