Solidity
使用前端 truffle petbox 吸引 dapp
App = { web3Provider: null, contracts: {}, account: '0x0', init: function() { // Load pets. return App.initWeb3(); }, initWeb3: function() { if (typeof web3 !== 'undefined') { // If a web3 instance is already provided by Meta Mask. App.web3Provider = web3.currentProvider; web3 = new Web3(web3.currentProvider); } else { // Specify default instance if no web3 instance provided App.web3Provider = new Web3.providers.HttpProvider('http://localhost:7545'); web3 = new Web3(App.web3Provider); } return App.initContract(); }, initContract: function() { $.getJSON("adding.json", function(addingdappfrontend) { App.contracts.Add = TruffleContract(addingdappfrontend); // we have to set provideer App.contracts.Add.setProvider(App.web3Provider); return App.render(); }); }, render : function(){ var addingInstance; // loading data web3.eth.getCoinbase(function(err, account) { if (err === null) { App.account = account; $("#accountAddress").html("Your Account: " + account); } }); // Load contract data $("#add").click(function(){ App.contracts.Add .deployed().then(function(i){ app = i return app.add($("#fvalue").val() , $("#svalue").val()); }).then(function(j){ $("#total").val(j.total()); }); }); } }; $(function() { $(window).load(function() { App.init(); }); });
以下程式碼是我的區塊鏈ui的app.js程式碼
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags --> <title>Adding and Subracting Twonumbers </title> <!-- Bootstrap --> <link href="css/bootstrap.min.css" rel="stylesheet"> </head> <body> <div class="container"> <div class="row"> <div class="col-xs-12 col-sm-8 col-sm-push-2"> <h1 class="text-center">adding Two Numbers</h1> <hr/> <br/> Firstvalue</br> <input type="number" name="fvalue" id = "fvalue" value=""></br> second Value</br> <input type = "number" name = "svalue" id = "svalue" value = ""></br> Total</br> <input type = "number" name= "total" id = "total" value = ""> </br> </br><button name="add" id="add">Add</button> </div> </div> <p id="accountAddress" class="text-center"></p> </div> <!-- jQuery (necessary for Bootstrap's JavaScript plugins) --> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <!-- Include all compiled plugins (below), or include individual files as needed --> <script src="js/bootstrap.min.js"></script> <script src="js/web3.min.js"></script> <script src="js/truffle-contract.js"></script> <script src="js/app.js"></script> </body> </html>
我已經編寫了我的 index.html 程式碼,我想連結到我的後端 Solidity 程式碼並呼叫我的 add 函式並部署我的 index.html 程式碼中提供的總計框
pragma solidity ^0.4.23; contract adding{ uint256 public total; function add(uint256 val1,uint256 val2) public returns(uint256){ total = val1+val2; return total; } }
上面的程式碼給了我以下錯誤載入資源失敗:
net::ERR_CONNECTION_REFUSED app.js:54 14 browser-sync-client.js?v=2.26.3:9 GET http://localhost:3000/browser-sync/socket.io/?EIO=3&transport=polling&t=MPxk1Re net::ERR_CONNECTION_REFUSED i.create @ browser-sync-client.js?v=2.26.3:9 i @ browser-sync-client.js?v=2.26.3:9 o.request @ browser-sync-client.js?v=2.26.3:9 o.doPoll @ browser-sync-client.js?v=2.26.3:9 n.poll @ browser-sync-client.js?v=2.26.3:9 n.doOpen @ browser-sync-client.js?v=2.26.3:9 n.open @ browser-sync-client.js?v=2.26.3:9 n.open @ browser-sync-client.js?v=2.26.3:9 n @ browser-sync-client.js?v=2.26.3:9 n @ browser-sync-client.js?v=2.26.3:9 n.open.n.connect @ browser-sync-client.js?v=2.26.3:9 (anonymous) @ browser-sync-client.js?v=2.26.3:9 browser-sync-client.js?v=2.26.3:9 GET http://localhost:3000/browser-sync/socket.io/?EIO=3&transport=polling&t=MPxk2fv net::ERR_CONNECTION_REFUSE
上面有很多程式碼,但沒有足夠的資訊來幫助你
第一個建議,確保
adding.json
可以訪問解決目前問題後,您可能會面臨:
$("#add").click(function() { App.contracts.Add.deployed().then(function(i) { return i.add($("#fvalue").val(), $("#svalue").val()); }).then(function(j) { $("#total").val(j); }); });
我已將函式更改為純函式,它執行良好
pragma solidity ^0.4.23; contract adding{ function add(uint256 val1,uint256 val2) public pure returns(uint256){ //uint256 public total; uint256 total = val1+val2; return total; } }
請參閱以下連結進行說明