0

I am a new learner. I am confusing on how to get the web3.js work on a shared hosting. The user who uses the function must have Metamask installed.

As I am using shared hosting, I can't install the node or geth on the shared hosting.

I downloaded the web3.js from https://github.com/ethereum/web3.js/ and uploaded the files to the shared hosting then linked to the HTML file.

<script src="assert/dist/web3.js></script>

I follow the guide on this post Is it possible to use web3.js API methods to interact with a contract deployed on Rinkeby?

and add the code to the tag

I am using a domain with https://

I am using Google Chrome browser.

I installed Metamask and logged in, connected to the Rinkeby Test Network.

enter image description here

I upload the following HTML file to the shared hosting server and run it but got the error

Below is the full HTML code I used for testing.

<!doctype>
<html>
<head>
<meta charset="UTF-8">
<title>Hello Project</title>
<script src="assets/dist/web3.js"></script>
<script>
    var Web3 = require('web3');
    var web3 = window.web3;

    if(typeof web3 !== 'undefined') {
        console.log("Using web3 detected from external source like Metamask");
        web3 = new Web3(web3.currentProvider);
    } else {
        console.log("Using localhost");
        web3 = new Web3(new Web3.providers.HttpProvider("http://localhost:8545"));
    }

    var account = web3.eth.accounts[0];
    console.log(account);
</script>
</head>
<body><p>Hello Project</p></body>
</html>

enter image description here

The HTML web3.js cannot detect the Rinkeby Test Network as the provider.

What have I miss? Advises are much appreciated. Thanks

Improve this question

4 Answers 4

Reset to default
0

Main problem here is you specify as node localhost:8545 which should correspond to a local node on your machine.

If your user has metamask you don't need to instanciate a Web3 object yourself, Metamask already does it by injecting in your browser the web3 instance in window.web3. Metamask will then catch the transactions when using this instance to make calls and will rely the transaction - if accepted by user - to the currently connected network.

Improve this answer
1
  • ok. Thank you for the advice. After reading your comments. I now have the answer and it works. I will post the working code on the post.
    – David Evony
    Mar 23, 2018 at 16:36
1

I assume you have MetaMask installed and running in the browser you're using for testing.

If so, it's hard to say with certainty, but my guess would be that you're checking for window.web3 too early (before MetaMask has had a chance to inject it).

I would wait for the window load event before looking for window.web3.

Improve this answer
0

Thank you smarx and Asone for the advise. I now has it working using the following code:

  • Use Google Chrome
  • Installed Metamask
  • Use shared hosting server
  • No need install Geth or other client
  • Disadvantage - The User MUST have MetaMask installed or use MIST in order to interact with the network due to no local server or not running in own VPS node

.

<html>
   <head>
      <title>Hello Project</title>
      <script src="assets/dist/web3.js"></script>
   </head>
   <body>
      <p>Hello Project</p>
      <div id="err_msg_box"></div>

      <script>
          window.onload = function(){
              if (typeof web3 === 'undefined'} {
                 $('#err_msg_box').html('You need <a href="htps://metamask.io">MetaMask</a> browser plugin to run this example');
              } else {
                 // Here the code to execute the project
                 // No need to set Provider, use web3.eth directly
                 // web3.eth.getAccounts(function(err,res){ console.log(res);});
              }
         }
     </script>
     <script src="assets/js/jquery-1.10.2.min.js"></script>
   </body>
</html>
Improve this answer
1
  • Just a heads up, your answer corresponds more to what @smarx mentioned.
    – ReyHaynes
    Mar 23, 2018 at 18:08
0

in http provider you could use infura.io - they provide access to ethereum virtual machine, you just need to register there and get your url keys

Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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