120 lines
5.0 KiB
HTML
120 lines
5.0 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
|
|
<head>
|
|
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
|
|
<link href="/jscss/style.css" rel="stylesheet" type="text/css" />
|
|
<script type="text/javascript" charset="utf-8" src="/jscss/theme.js"></script>
|
|
<style>
|
|
.container>div {
|
|
padding: 1em;
|
|
background: var(--bg1);
|
|
margin-bottom: 1em;
|
|
border: 1px solid var(--bg5);
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<body>
|
|
<div class="container">
|
|
|
|
<blockquote>钱包登录</blockquote>
|
|
<div>
|
|
<br /><button class='btn' onclick="connect()">连接钱包</button>
|
|
<div id="id_connect"></div>
|
|
</div>
|
|
|
|
<blockquote>钱包签名</blockquote>
|
|
<div>
|
|
<textarea id="mdata" style="width: 100%; height: 5em;">待签名数据</textarea>
|
|
<br /><button class='btn' onclick="hashData()">数据hash</button>
|
|
<br />hash:<input id="mhash" type="text" style="width: 100%;" />
|
|
<br /><button class='btn' onclick="web3sign()">签名</button>
|
|
<br />签名:
|
|
<br /><textarea id="msignature" style="width: 100%; height: 5em;"></textarea>
|
|
</div>
|
|
|
|
<blockquote>钱包验签</blockquote>
|
|
<div>
|
|
<br /><button class='btn' onclick="web3verifyjs()">前端验签</button>
|
|
<br /><button class='btn' onclick="web3verifyback()">后端验签</button>
|
|
<div id="check_result"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<script type="text/javascript" src="/jscss/ciy.js"></script>
|
|
<script type="text/javascript" src="/jscss/web3.min.js"></script>
|
|
<script type="text/javascript" src="../common.js"></script>
|
|
<script type="text/javascript">
|
|
'use strict';
|
|
var account = null;
|
|
async function connect() {
|
|
if (!window.ethereum) {
|
|
document.getElementById('id_connect').innerText = 'MetaMask 没有安装';
|
|
return;
|
|
}
|
|
try {
|
|
await window.ethereum.request({ method: 'eth_requestAccounts' });
|
|
const web3 = new Web3(window.ethereum);
|
|
const accounts = await web3.eth.getAccounts();
|
|
if (accounts.length > 0) {
|
|
account = accounts[0];
|
|
document.getElementById('id_connect').innerText = `Connected to address: ${account}`;
|
|
} else {
|
|
document.getElementById('id_connect').innerText = 'No accounts found';
|
|
}
|
|
} catch (error) {
|
|
console.error('User denied account access', error);
|
|
document.getElementById('id_connect').innerText = 'User denied account access:' + error;
|
|
}
|
|
}
|
|
function hashData() {
|
|
const data = document.getElementById("mdata").value;
|
|
ciyfn.sha256(data).then(hash => document.getElementById("mhash").value = hash);
|
|
}
|
|
async function web3sign() {
|
|
if (!account)
|
|
return;
|
|
const message = document.getElementById("mhash").value;
|
|
try {
|
|
const web3 = new Web3(window.ethereum);
|
|
const signature = await window.ethereum.request({
|
|
method: 'personal_sign',
|
|
params: ['CIY' + message, account],
|
|
});
|
|
document.getElementById('msignature').value = signature;
|
|
} catch (error) {
|
|
console.error("签名失败:", error);
|
|
}
|
|
}
|
|
async function web3verifyjs() {
|
|
if (!account)
|
|
return;
|
|
const message = document.getElementById("mhash").value;
|
|
const signature = document.getElementById("msignature").value;
|
|
try {
|
|
const web3 = new Web3(window.ethereum);
|
|
const recoveredAddress = await web3.eth.personal.ecRecover('CIY' + message, signature);
|
|
if (account.toLowerCase() === recoveredAddress.toLowerCase())
|
|
document.getElementById("check_result").innerHTML = `js验签结果: 验签成功`;
|
|
else
|
|
document.getElementById("check_result").innerHTML = `js验签结果: 验签失败`;
|
|
} catch (error) {
|
|
document.getElementById("check_result").innerHTML = `js验签结果: 验签失败 ` + error;
|
|
}
|
|
}
|
|
function web3verifyback() {
|
|
var postparam = {};
|
|
postparam.sign = document.getElementById("msignature").value;
|
|
postparam.addr = account;
|
|
postparam.hash = 'CIY' + document.getElementById("mhash").value;
|
|
ciyfn.callfunc("checkweb3", postparam, function (json) {
|
|
document.getElementById("check_result").innerHTML = `php验签结果: ${json.msg}`;
|
|
});
|
|
}
|
|
</script>
|
|
</body>
|
|
|
|
</html> |