[Ethereum] MetaMask injected Web3 not working in HTML file

dapp-developmentmetamaskweb3js

I am using chrome with the MetaMask plugin installed. When I launch the below HTML file and look at the JS console, MetaMask doesn't inject web3 ("MetaMask – injected web3") like it does on every other webpage. What am I missing here / how much configuration does it take to get MetaMask to inject web3.js? 

<!DOCTYPE html>


<script>
window.addEventListener('load', function() {

// Checking if Web3 has been injected by the browser (Mist/MetaMask)
if (typeof web3 !== 'undefined') {
// Use Mist/MetaMask's provider
window.web3 = 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)
window.web3 = new Web3(new 
Web3.providers.HttpProvider("http://localhost:8545"));
  }

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

})


</script>

Best Answer

MetaMask is injected into every loaded page by default. How did you serve your dApp ? Quote from https://github.com/MetaMask/faq/blob/master/DEVELOPERS.md :

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

Quick solution for developing on Linux :Install Apache/php, then in your directory, open a terminal and do php -S 0.0.0.0:8008 , open your browser and load your site through http://localhost:8008

On Windows, get Xampp.

Have fun!

Related Topic