Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

deploy contract with quarkchain-web3.js in browser without metamask #10

Closed
jishankai opened this issue Nov 9, 2018 · 3 comments
Closed

Comments

@jishankai
Copy link
Contributor

jishankai commented Nov 9, 2018

I forked qcgg/quarkchain-web3-contract-example.js and used it in browser. With MetaMask it woked fine. However, for supporting more browsers and more friendly to noob, I need use it without MetaMask. If I don't have a server, what should I do?

Here is my code.

<html>
<head> 
<script src="https://cdn.jsdelivr.net/gh/ethereum/web3.js/dist/web3.min.js"></script>
<script src="/javascripts/quarkchain-web3.js"></script> 
<-- quarkchain-web3@0.2.2-->
</head>
<body>
<script>
  //var Web3 = require('web3');
  web3 = new Web3();
  //web3.setProvider(new web3.providers.HttpProvider());
  web3.setProvider(new web3.providers.HttpProvider("http://jrpc.testnet.quarkchain.io:38391"));
  QuarkChain.injectWeb3(web3, "http://jrpc.testnet.quarkchain.io:38391");
  web3.qkc.setPrivateKey('0x27245C2FFBF81193F1C68FDD2FD87C962724488DC40510BBB526FF24401D5825');

  var abi = [{"constant":true,"inputs":[],"name":"name","outputs":[{"name":"","type":"string"}],"payable":false,"stateMutability":"view","type":"function"},{"constant":false,"inputs":[{"name":"_spender","type":"address"},{"name":"_value","type":"uint256"}],"name":"approve","outputs":[{"name":"success","type":"bool"}],"payable":false,"stateMutability":"nonpayable","type":"function"},{"constant":true,"inputs":[],"name":"totalSupply","outputs":[{"name":"","type":"uint256"}],"payable":false,"stateMutability":"view","type":"function"},{"constant":false,"inputs":[{"name":"_from","type":"address"},{"name":"_to","type":"address"},{"name":"_value","type":"uint256"}],"name":"transferFrom","outputs":[{"name":"success","type":"bool"}],"payable":false,"stateMutability":"nonpayable","type":"function"},{"constant":true,"inputs":[],"name":"decimals","outputs":[{"name":"","type":"uint8"}],"payable":false,"stateMutability":"view","type":"function"},{"constant":false,"inputs":[{"name":"_value","type":"uint256"}],"name":"burn","outputs":[{"name":"success","type":"bool"}],"payable":false,"stateMutability":"nonpayable","type":"function"},{"constant":true,"inputs":[{"name":"","type":"address"}],"name":"balanceOf","outputs":[{"name":"","type":"uint256"}],"payable":false,"stateMutability":"view","type":"function"},{"constant":false,"inputs":[{"name":"_from","type":"address"},{"name":"_value","type":"uint256"}],"name":"burnFrom","outputs":[{"name":"success","type":"bool"}],"payable":false,"stateMutability":"nonpayable","type":"function"},{"constant":true,"inputs":[],"name":"ownerAddress","outputs":[{"name":"","type":"address"}],"payable":false,"stateMutability":"view","type":"function"},{"constant":true,"inputs":[],"name":"symbol","outputs":[{"name":"","type":"string"}],"payable":false,"stateMutability":"view","type":"function"},{"constant":false,"inputs":[{"name":"_to","type":"address"},{"name":"_value","type":"uint256"}],"name":"transfer","outputs":[{"name":"success","type":"bool"}],"payable":false,"stateMutability":"nonpayable","type":"function"},{"constant":true,"inputs":[],"name":"endDate","outputs":[{"name":"","type":"uint256"}],"payable":false,"stateMutability":"view","type":"function"},{"constant":false,"inputs":[{"name":"_spender","type":"address"},{"name":"_value","type":"uint256"},{"name":"_extraData","type":"bytes"}],"name":"approveAndCall","outputs":[{"name":"success","type":"bool"}],"payable":false,"stateMutability":"nonpayable","type":"function"},{"constant":true,"inputs":[{"name":"","type":"address"},{"name":"","type":"address"}],"name":"allowance","outputs":[{"name":"","type":"uint256"}],"payable":false,"stateMutability":"view","type":"function"},{"constant":true,"inputs":[],"name":"buyRate","outputs":[{"name":"","type":"uint256"}],"payable":false,"stateMutability":"view","type":"function"},{"inputs":[{"name":"initialSupply","type":"uint256"},{"name":"tokenName","type":"string"},{"name":"tokenSymbol","type":"string"},{"name":"tokenDecimals","type":"uint8"},{"name":"tokenOwnerAddress","type":"address"},{"name":"tokenBuyRate","type":"uint256"},{"name":"tokenEndDate","type":"uint256"}],"payable":false,"stateMutability":"nonpayable","type":"constructor"},{"anonymous":false,"inputs":[{"indexed":true,"name":"from","type":"address"},{"indexed":true,"name":"to","type":"address"},{"indexed":false,"name":"value","type":"uint256"}],"name":"Transfer","type":"event"},{"anonymous":false,"inputs":[{"indexed":true,"name":"_owner","type":"address"},{"indexed":true,"name":"_spender","type":"address"},{"indexed":false,"name":"_value","type":"uint256"}],"name":"Approval","type":"event"},{"anonymous":false,"inputs":[{"indexed":true,"name":"from","type":"address"},{"indexed":false,"name":"value","type":"uint256"}],"name":"Burn","type":"event"}];
  var bytecode = "0x60806040526002805460ff1916601217905534801561001d57600080fd5b50604051610af5380380610af58339810160409081528151602080840151838501516060860151608087015160a088015160c089015160025460ff16600a0a8802600381905533600090815260078952998a20559489018051979990989401969295919490939092610091928901906100eb565b5084516100a59060019060208801906100eb565b506002805460ff191660ff959095169490941790935560048054600160a060020a031916600160a060020a03939093169290921790915560055560065550610186915050565b828054600181600116156101000203166002900490600052602060002090601f016020900481019282601f1061012c57805160ff1916838001178555610159565b82800160010185558215610159579182015b8281111561015957825182559160200191906001019061013e565b50610165929150610169565b5090565b61018391905b80821115610165576000815560010161016f565b90565b610960806101956000396000f3006080604052600436106100da5763ffffffff7c010000000000000000000000000000000000000000000000000000000060003504166306fdde0381146100df578063095ea7b31461016957806318160ddd146101a157806323b872dd146101c8578063313ce567146101f257806342966c681461021d57806370a082311461023557806379cc6790146102565780638f84aa091461027a57806395d89b41146102ab578063a9059cbb146102c0578063c24a0f8b146102e4578063cae9ca51146102f9578063dd62ed3e14610362578063fc37987b14610389575b600080fd5b3480156100eb57600080fd5b506100f461039e565b6040805160208082528351818301528351919283929083019185019080838360005b8381101561012e578181015183820152602001610116565b50505050905090810190601f16801561015b5780820380516001836020036101000a031916815260200191505b509250505060405180910390f35b34801561017557600080fd5b5061018d600160a060020a036004351660243561042c565b604080519115158252519081900360200190f35b3480156101ad57600080fd5b506101b6610492565b60408051918252519081900360200190f35b3480156101d457600080fd5b5061018d600160a060020a0360043581169060243516604435610498565b3480156101fe57600080fd5b50610207610507565b6040805160ff9092168252519081900360200190f35b34801561022957600080fd5b5061018d600435610510565b34801561024157600080fd5b506101b6600160a060020a0360043516610588565b34801561026257600080fd5b5061018d600160a060020a036004351660243561059a565b34801561028657600080fd5b5061028f61066b565b60408051600160a060020a039092168252519081900360200190f35b3480156102b757600080fd5b506100f461067a565b3480156102cc57600080fd5b5061018d600160a060020a03600435166024356106d4565b3480156102f057600080fd5b506101b66106ea565b34801561030557600080fd5b50604080516020600460443581810135601f810184900484028501840190955284845261018d948235600160a060020a03169460248035953695946064949201919081908401838280828437509497506106f09650505050505050565b34801561036e57600080fd5b506101b6600160a060020a0360043581169060243516610809565b34801561039557600080fd5b506101b6610826565b6000805460408051602060026001851615610100026000190190941693909304601f810184900484028201840190925281815292918301828280156104245780601f106103f957610100808354040283529160200191610424565b820191906000526020600020905b81548152906001019060200180831161040757829003601f168201915b505050505081565b336000818152600860209081526040808320600160a060020a038716808552908352818420869055815186815291519394909390927f8c5be1e5ebec7d5bd14f71427d1e84f3dd0314c0f7b2291e5b200ac8c7c3b925928290030190a350600192915050565b60035481565b600160a060020a03831660009081526008602090815260408083203384529091528120548211156104c857600080fd5b600160a060020a03841660009081526008602090815260408083203384529091529020805483900390556104fd84848461082c565b5060019392505050565b60025460ff1681565b3360009081526007602052604081205482111561052c57600080fd5b3360008181526007602090815260409182902080548690039055600380548690039055815185815291517fcc16f5dbb4873280815c1ee09dbd06736cffcc184412cf7a71a0fdb75d397ca59281900390910190a2506001919050565b60076020526000908152604090205481565b600160a060020a0382166000908152600760205260408120548211156105bf57600080fd5b600160a060020a03831660009081526008602090815260408083203384529091529020548211156105ef57600080fd5b600160a060020a0383166000818152600760209081526040808320805487900390556008825280832033845282529182902080548690039055600380548690039055815185815291517fcc16f5dbb4873280815c1ee09dbd06736cffcc184412cf7a71a0fdb75d397ca59281900390910190a250600192915050565b600454600160a060020a031681565b60018054604080516020600284861615610100026000190190941693909304601f810184900484028201840190925281815292918301828280156104245780601f106103f957610100808354040283529160200191610424565b60006106e133848461082c565b50600192915050565b60065481565b6000836106fd818561042c565b15610801576040517f8f4ffcb10000000000000000000000000000000000000000000000000000000081523360048201818152602483018790523060448401819052608060648501908152875160848601528751600160a060020a03871695638f4ffcb195948b94938b939192909160a490910190602085019080838360005b8381101561079557818101518382015260200161077d565b50505050905090810190601f1680156107c25780820380516001836020036101000a031916815260200191505b5095505050505050600060405180830381600087803b1580156107e457600080fd5b505af11580156107f8573d6000803e3d6000fd5b50505050600191505b509392505050565b600860209081526000928352604080842090915290825290205481565b60055481565b6000600160a060020a038316151561084357600080fd5b600160a060020a03841660009081526007602052604090205482111561086857600080fd5b600160a060020a038316600090815260076020526040902054828101101561088f57600080fd5b50600160a060020a038083166000818152600760209081526040808320805495891680855282852080548981039091559486905281548801909155815187815291519390950194927fddf252ad1be2c89b69c2b068fc378daa952ba7f163c4a11628f55a4df523b3ef929181900390910190a3600160a060020a0380841660009081526007602052604080822054928716825290205401811461092e57fe5b505050505600a165627a7a723058202827fd9fcfaab34240c1a77ec0715a7c72dcf4a852b4a7f0f8ab1d91e2f46f000029";

  var contractClass = web3.qkc.contract(abi);
  var contractInstance = contractClass.new({data: bytecode, gasPrice: 1000000000, gas: 1000000}, function(err, contract) {
    if(!err) {
      // NOTE: The callback will fire twice!
      // Once the contract has the transactionId property set and once its deployed on an address.

      // e.g. check tx hash on the first call (transaction send)
      if(!contract.address) {
        console.log(contract.transactionId); // The id of the transaction, which deploys the contract
        // check address on the second call (contract deployed)
      } else {
        console.log(contract.address); // the contract address
        // Note that the returned "contractInstance" === "contract",
        // so the returned "contractInstance" object will also get the address set.       
      }
    } 
  });
</script>
</body>
</html>

I run the code in Safari and Chrome. All had the error as follows:
image
image

I would appreciate any suggestion!

Above all, when I used the sample code in server, I can only get the transactionId and no second callback for address but I can see the success of the deploy in testnet explorer, I need the contract address when I deploy it and tell the customers.
image
You can see I only get the txid back and then timeout. It's exactly same code besides I used require instead of import.

@qcdll
Copy link
Contributor

qcdll commented Nov 9, 2018

I tried out the code (there is a typo which I fixed) in my browser and it seems to work fine:
no need to set up server or html, just go to http://testnet.quarkchain.io/ (NOTE https won't work) and paste the js code, all works fine and the contract was created successfully http://testnet.quarkchain.io/tx/0xeb7c3f469a424a9e003466f8ba212314b8fdaa5fd2eda362fc39902f85e2203b00872619

I can see the POST http://jrpc.testnet.quarkchain.io:38391/ 404 (Not Found) error as well, but if you go to network tab and see what it is about, the method is eth_newBlockFilter, I don't think it really matters, we can just kill it later

@jishankai
Copy link
Contributor Author

Thanks so much for your reply.

I'm sorry for the typo made when I write the issue...However, I can deploy the contract but I still can't get the contract address for the second callback never happened.

I change the workflow. Use the func getTransactionRceipt with setInterval to get the contractAddress in first callback func. It can work now.

code as follows:

  var tokenContractReturned = TokenContract.new(parseInt(req.body.totalSupply), req.body.tokenName, req.body.symbol, parseInt(req.body.decimals), req.body.ownerAddress, parseInt(req.body.buyRate), Date.parse(req.body.endDate),
  {
    data: bytecode,
    gasPrice: 1000000000,
    gas: 1000000,
    fromFullShardId: finalFullShardId,
  },function(err, tokenContract){
      if(!err) {
    //fromFullShardId: getTargetFullShardId(req.app.get('shard'))},
        // NOTE: The callback will fire twice!
        // Once the contract has the transactionId property set and once its deployed on an address.

        // e.g. check tx hash on the first call (transaction send)
        if(!tokenContract.address) {
          console.log("/////////////////////txid////////////////////");
          console.log(tokenContract.transactionId); // The id of the transaction, which deploys the contract

          var transactionId = tokenContract.transactionId;
          var transactionReceipt;
          var intervId = setInterval(function(){
            transactionReceipt = web3.qkc.getTransactionReceipt(transactionId);
            if(!transactionReceipt) {
              console.log(Date.now());
            }
            else {
              clearInterval(intervId);
              console.log(transactionReceipt);

              req.app.set('shard', (req.app.get('shard')+1)%32);
              res.json({address: `${transactionReceipt.contractAddress}${finalFullShardId.slice(2)}`});
            }
          }, 2000);
          // check address on the second call (contract deployed)
        } else {
          console.log("/////////////////////address/////////////////");
          console.log(tokenContract.address); // the contract address
        }

        // Note that the returned "myContractReturned" === "myContract",
        // so the returned "myContractReturned" object will also get the address set.
      }
  });

@qcdll
Copy link
Contributor

qcdll commented Nov 11, 2018

oh, the fact that using a interval works probably means the server won't have the contract address ready until some time has passed :-)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants