最近太忙了。。。压根没时间写，就单纯贴个代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>百度翻译</title>
<link rel="stylesheet" type="text/css" href="main.css">
<!--分割线-->
</head>
<!--html-->
<body>
<div class="container">
<h1>Info Contract</h1>
<h2 id="info"></h2>
<label for="name" class="col-lg-2 control-label">Name</label>
<input id="name" type="text">
<label for="name" class="col-lg-2 control-label">Age</label>
<input id="age" type="text">
<button id="button">Update Info</button>
</div>
<!--这里是展示智能合约2传来的数据-->
<div class="container2">
<h1>百度翻译</h1>
<hr>
<p id="result"></p>
<h3 id="translate"></h2>
<label for="sentence"" class="col-lg-2 control-label">请输入你要翻译的词：</label>
<input id="sentence" type="text">
<button id="button2">输入你要翻译的句子：</button>
<hr>
<p id="result"></p>
</div>
<!--js代码-->
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script src="http://apps.bdimg.com/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="./md5.js"></script>
<script type="text/javascript">
</script>
<script>
// Our future code here..
//验证引入web3成功-
console.log("打印出web3则引入成功"+web3);
if (window.ethereum) {
// 请求用户授权
window.ethereum.enable(function(){
web3.eth.getAccounts((error, accounts) => {
web3.eth.defaultAccount = accounts[0];
console.log(accounts)
})
})
} else if (typeof web3 !== 'undefined') {
web3 = new Web3(web3.currentProvider);
web3.eth.defaultAccount = web3.eth.accounts[0];
console.log(web3.eth.defaultAccount);
} else {
// set the provider you want from Web3.providers
web3 = new Web3(new Web3.providers.HttpProvider("HTTP://127.0.0.1:7545"));
}
//此处中括号[]中的内容直接从remix中compile后的ABI处复制.web3.eth.contract接口可以让web3和合约交互
var infoContract = web3.eth.contract([
{
"constant": false,
"inputs": [
{
"name": "_Name",
"type": "string"
},
{
"name": "_age",
"type": "uint256"
}
],
"name": "setInfo",
"outputs": [],
"payable": false,
"stateMutability": "nonpayable",
"type": "function"
},
{
"anonymous": false,
"inputs": [
{
"indexed": false,
"name": "name",
"type": "string"
},
{
"indexed": false,
"name": "age",
"type": "uint256"
}
],
"name": "Instructor",
"type": "event"
},
{
"constant": true,
"inputs": [],
"name": "getInfo",
"outputs": [
{
"name": "",
"type": "string"
},
{
"name": "",
"type": "uint256"
}
],
"payable": false,
"stateMutability": "view",
"type": "function"
}
]);
console.log(infoContract)
//此处的address单引号''中内容是从remix中deploy后的地址复制而来
var info= infoContract.at('0x5ee4ac61e4c8b5a03ee9b8e87ad4c3624bc8a7b5');
//----分界线
//翻译合约的abi
var translateContract=web3.eth.contract(
[
{
"constant": true,
"inputs": [],
"name": "getresult",
"outputs": [
{
"name": "",
"type": "string"
}
],
"payable": false,
"stateMutability": "view",
"type": "function"
},
{
"constant": false,
"inputs": [
{
"name": "_sentence",
"type": "string"
}
],
"name": "translate",
"outputs": [],
"payable": false,
"stateMutability": "nonpayable",
"type": "function"
},
{
"anonymous": false,
"inputs": [
{
"indexed": false,
"name": "content",
"type": "string"
}
],
"name": "translateword",
"type": "event"
}
]
)
console.log("translate"+translateContract)
//此处的address单引号''中内容是从remix中deploy后的地址复制而来
var translate= translateContract.at('0x89c1feaaa4c40fb347ec2fc6ecb0c35960afdbe8');
//此处可以参考web3在github上的文档http://github.com/ethereum/web3.js
//也就是web3.js提供的对于智能合约方法的操作与交互
//getInfo方法是对上面的id="info"设置，result是从智能合约获得的结果
var test0;
var test1;
var testsentence;
//----分界线
//展示翻译结果：通过ajax异步请求，不断监听接收的信息，把接收的信息翻译展示给前端
translate.getresult(function(error,result){
var appid = '20201030000603388';
var key = 'ztWvcJpzwaXWO8ZIV_nn';
var salt = (new Date).getTime();
var from = 'auto';
var to = 'auto';
var _sentence = $("#sentence").val();
var str1 = appid + _sentence + salt +key;
var sign = MD5(str1);
console.log("输入的句子为："+result)
testsentence=result;
if(!error){
//调用百度翻译api接口
//获取我们输入的句子
$("#translate").html(result);
console.log("test="+result);
}
var query = testsentence;
var str1 = appid + query + salt +key;
var sign = MD5(str1);
$.ajax({
url: 'http://api.fanyi.baidu.com/api/trans/vip/translate',
type: 'get',
dataType: 'jsonp',
data: {
q: query,
appid: appid,
salt: salt,
from: from,
to: to,
sign: sign
},
success: function (data) {
var res=data.trans_result[0].dst;
$("#result")[0].innerHTML=res;
console.log("data.trans_result[0].dst"+data.trans_result[0].dst);
console.log(res);
}
});
});
//这里translate对应智能合约的输入需要翻译的文段方法，此处将html中的sentence设置到智能合约
$("#button2").click(function(){
var _sentence = $("#sentence").val();
translate.translate(_sentence,function(error,data){
if(!error){
console.log("ok");
}
});
});
//更新个人信息合约函数
info.getInfo(function(error,result){
if(!error){
$("#info").html(result[0]+'('+result[1]+')years old');
test0=result[0];
test1=result[1];
for (let key in result) {
console.log(key + ': ' + result[key])
}
}
});
//这里setInfo对应智能合约的set方法，此处将html中的name和age设置到智能合约
$("#button").click(function(){
var name = $("#name").val();
var age = $("#age").val();
info.setInfo(name,age,function(error,result){
if(!error){
console.log("ok");
}
});
});
})
</script>
</body>
</html>