Browse Source

Add blindsecp256k1-js client web example

master
arnaucube 3 years ago
parent
commit
0d245722b3
5 changed files with 34100 additions and 43 deletions
  1. +33961
    -0
      client/blindsecp256k1-browser.js
  2. +36
    -0
      client/index-wasm.html
  3. +68
    -0
      client/index-wasm.js
  4. +7
    -15
      client/index.html
  5. +28
    -28
      client/index.js

+ 33961
- 0
client/blindsecp256k1-browser.js
File diff suppressed because it is too large
View File


+ 36
- 0
client/index-wasm.html

@ -0,0 +1,36 @@
<html>
<head>
<meta charset="utf-8">
<title>blindsig-client-server-example</title>
</head>
<body>
<script src="wasm_exec.js"></script>
<script>
const go = new Go();
WebAssembly.instantiateStreaming(fetch('blindsecp256k1.wasm'), go.importObject).then(function(dat) {
go.run(dat.instance);
});
</script>
<h3>blindsig-client-server-example (client in WASM version)</h3>
<p>This is an example of usage of <a href="https://github.com/arnaucube/go-blindsecp256k1" target="_blank">https://github.com/arnaucube/go-blindsecp256k1</a></p>
<br>
Message (only numbers): <input id="msg" value="1234"></input>
<button onClick="newRequest();">newRequest()</button>
<p id="signerRx"></p>
<p id="signerRy"></p>
<p id="signerQx"></p>
<p id="signerQy"></p>
<button onClick="askBlindSign();">askBlindSign()</button>
<p id="sBlind"></p>
<p id="sigS"></p>
<p id="sigFx"></p>
<p id="sigFy"></p>
<button onClick="verify();">verify()</button>
<p id="verified"></p>
<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
<script src="index-wasm.js"></script>
</body>
</html>

+ 68
- 0
client/index-wasm.js

@ -0,0 +1,68 @@
// signer public parameters
let rx, ry, qx, qy;
// user parameters
let m, mBlinded, uA, uB, uFx, uFy, sigS, sigFx, sigFy;
function newRequest() {
m = document.getElementById("msg").value;
axios.get('/request')
.then(function (res) {
console.log("/request res:", res.data);
rx = res.data.signerR.x;
ry = res.data.signerR.y;
qx = res.data.signerQ.x;
qy = res.data.signerQ.y;
document.getElementById("signerRx").innerHTML = "signerR.x: " + rx;
document.getElementById("signerRy").innerHTML = "signerR.y: " + ry;
document.getElementById("signerQx").innerHTML = "signerQ.x: " + qx;
document.getElementById("signerQy").innerHTML = "signerQ.y: " + qy;
console.log("blind msg");
let blindRes = wasmBlind(m, rx, ry);
console.log("blindRes:", blindRes);
mBlinded = blindRes.mBlinded;
uA = blindRes.uA;
uB = blindRes.uB;
uFx = blindRes.uFx;
uFy = blindRes.uFy;
})
.catch(function (error) {
console.error(error);
alert(error);
});
}
function askBlindSign() {
console.log("askBlindSign");
let data = {
m: mBlinded,
r: {x:rx, y:ry}
};
axios.post('/blindsign', data)
.then(function (res) {
console.log("/blindSign res:", res.data);
document.getElementById("sBlind").innerHTML = "sBlind: " + res.data.sBlind;
let unblindRes = wasmUnblind(res.data.sBlind, m, uA, uB, uFx, uFy);
console.log("unblind", unblindRes);
sigS = unblindRes.s;
sigFx = unblindRes.fx;
sigFy = unblindRes.fy;
document.getElementById("sigS").innerHTML = "s: " + sigS;
document.getElementById("sigFx").innerHTML = "f.x: " + sigFx;
document.getElementById("sigFy").innerHTML = "f.y: " + sigFy;
})
.catch(function (error) {
console.error(error);
alert(error);
});
}
function verify() {
let verified = wasmVerify(m, sigS, sigFx, sigFy, qx, qy);
console.log("verify", verified);
document.getElementById("verified").innerHTML = "signature verification, verified: " + verified;
}

+ 7
- 15
client/index.html

@ -4,33 +4,25 @@
<title>blindsig-client-server-example</title> <title>blindsig-client-server-example</title>
</head> </head>
<body> <body>
<script src="wasm_exec.js"></script>
<script>
const go = new Go();
WebAssembly.instantiateStreaming(fetch('blindsecp256k1.wasm'), go.importObject).then(function(dat) {
go.run(dat.instance);
});
</script>
<h3>blindsig-client-server-example</h3>
<h3>blindsig-client-server-example (client in js version)</h3>
<p>This is an example of usage of <a href="https://github.com/arnaucube/go-blindsecp256k1" target="_blank">https://github.com/arnaucube/go-blindsecp256k1</a></p> <p>This is an example of usage of <a href="https://github.com/arnaucube/go-blindsecp256k1" target="_blank">https://github.com/arnaucube/go-blindsecp256k1</a></p>
<br> <br>
Message (only numbers): <input id="msg" value="1234"></input> Message (only numbers): <input id="msg" value="1234"></input>
<button onClick="newRequest();">newRequest()</button> <button onClick="newRequest();">newRequest()</button>
<p id="signerRx"></p>
<p id="signerRy"></p>
<p id="signerQx"></p>
<p id="signerQy"></p>
<p id="signerR"></p>
<p id="signerQ"></p>
<button onClick="askBlindSign();">askBlindSign()</button> <button onClick="askBlindSign();">askBlindSign()</button>
<p id="sBlind"></p> <p id="sBlind"></p>
<p id="sigS"></p>
<p id="sigFx"></p>
<p id="sigFy"></p>
<p id="sig"></p>
<button onClick="verify();">verify()</button> <button onClick="verify();">verify()</button>
<p id="verified"></p> <p id="verified"></p>
<a href="index-wasm.html">View the WASM version</a>
<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
<script src="blindsecp256k1-browser.js"></script>
<script src="index.js"></script> <script src="index.js"></script>
</body> </body>
</html> </html>

+ 28
- 28
client/index.js

@ -1,7 +1,11 @@
// This version uses https://github.com/arnaucube/blindsecp256k1-js
// signer public parameters // signer public parameters
let rx, ry, qx, qy;
let signerR, signerQ;
// user parameters // user parameters
let m, mBlinded, uA, uB, uFx, uFy, sigS, sigFx, sigFy;
let m, mBlinded, userSecretData, sig;
console.log("A", blindsecp256k1.messageToBigNumber("0x0a"))
function newRequest() { function newRequest() {
m = document.getElementById("msg").value; m = document.getElementById("msg").value;
@ -9,24 +13,21 @@ function newRequest() {
axios.get('/request') axios.get('/request')
.then(function (res) { .then(function (res) {
console.log("/request res:", res.data); console.log("/request res:", res.data);
rx = res.data.signerR.x;
ry = res.data.signerR.y;
qx = res.data.signerQ.x;
qy = res.data.signerQ.y;
document.getElementById("signerRx").innerHTML = "signerR.x: " + rx;
document.getElementById("signerRy").innerHTML = "signerR.y: " + ry;
signerR = blindsecp256k1.Point.fromAffine(blindsecp256k1.ecparams,
blindsecp256k1.newBigFromString(res.data.signerR.x),
blindsecp256k1.newBigFromString(res.data.signerR.y));
signerQ = blindsecp256k1.Point.fromAffine(blindsecp256k1.ecparams,
blindsecp256k1.newBigFromString(res.data.signerQ.x),
blindsecp256k1.newBigFromString(res.data.signerQ.y));
document.getElementById("signerR").innerHTML = "signerR: " + signerR;
document.getElementById("signerQx").innerHTML = "signerQ.x: " + qx;
document.getElementById("signerQy").innerHTML = "signerQ.y: " + qy;
document.getElementById("signerQ").innerHTML = "signerQ: " + signerQ;
console.log("blind msg"); console.log("blind msg");
let blindRes = wasmBlind(m, rx, ry);
console.log("blindRes:", blindRes);
let blindRes = blindsecp256k1.blind(m, signerR);
mBlinded = blindRes.mBlinded; mBlinded = blindRes.mBlinded;
uA = blindRes.uA;
uB = blindRes.uB;
uFx = blindRes.uFx;
uFy = blindRes.uFy;
userSecretData = blindRes.userSecretData;
console.log("blindRes:", mBlinded, userSecretData);
}) })
.catch(function (error) { .catch(function (error) {
console.error(error); console.error(error);
@ -37,22 +38,22 @@ function newRequest() {
function askBlindSign() { function askBlindSign() {
console.log("askBlindSign"); console.log("askBlindSign");
let data = { let data = {
m: mBlinded,
r: {x:rx, y:ry}
m: mBlinded.toString(),
r: {
x: signerR.affineX.toString(),
y: signerR.affineY.toString()
}
}; };
axios.post('/blindsign', data) axios.post('/blindsign', data)
.then(function (res) { .then(function (res) {
console.log("/blindSign res:", res.data); console.log("/blindSign res:", res.data);
document.getElementById("sBlind").innerHTML = "sBlind: " + res.data.sBlind; document.getElementById("sBlind").innerHTML = "sBlind: " + res.data.sBlind;
let unblindRes = wasmUnblind(res.data.sBlind, m, uA, uB, uFx, uFy);
console.log("unblind", unblindRes);
sigS = unblindRes.s;
sigFx = unblindRes.fx;
sigFy = unblindRes.fy;
document.getElementById("sigS").innerHTML = "s: " + sigS;
document.getElementById("sigFx").innerHTML = "f.x: " + sigFx;
document.getElementById("sigFy").innerHTML = "f.y: " + sigFy;
sig = blindsecp256k1.unblind(
blindsecp256k1.newBigFromString(res.data.sBlind),
userSecretData);
console.log("unblind", sig);
document.getElementById("sig").innerHTML = "sig.s: " + sig.s + ", sig.f: " + sig.f.affineX.toString() +", "+sig.f.affineY.toString();
}) })
.catch(function (error) { .catch(function (error) {
console.error(error); console.error(error);
@ -61,8 +62,7 @@ function askBlindSign() {
} }
function verify() { function verify() {
let verified = wasmVerify(m, sigS, sigFx, sigFy, qx, qy);
let verified = blindsecp256k1.verify(m, sig, signerQ);
console.log("verify", verified); console.log("verify", verified);
document.getElementById("verified").innerHTML = "signature verification, verified: " + verified; document.getElementById("verified").innerHTML = "signature verification, verified: " + verified;
} }

Loading…
Cancel
Save