将JPEG作为二进制文件加载到JavaScript中的变量中_Javascript_Rsa_Signing

将JPEG作为二进制文件加载到JavaScript中的变量中

javascript

将JPEG作为二进制文件加载到JavaScript中的变量中,javascript,rsa,signing,Javascript,Rsa,Signing,我的目标是使用jsrasign对JPEG文件进行签名：有一个为普通字符串签名的演示：如何使用此演示将其应用于JPEG文件？我找不到一种方法将JPEG文件中完整的未触及的二进制文件保存在变量中但我需要这样做，因为如果图像的二进制改变或不同，验证将失败代码如下： <html> <head> <title>Beispiel Applikation für Signaturen per JS</title> <script language=

我的目标是使用jsrasign对JPEG文件进行签名：

有一个为普通字符串签名的演示：

如何使用此演示将其应用于JPEG文件？我找不到一种方法将JPEG文件中完整的未触及的二进制文件保存在变量中

但我需要这样做，因为如果图像的二进制改变或不同，验证将失败

代码如下：

<html>
<head>
<title>Beispiel Applikation für Signaturen per JS</title>
<script language="JavaScript" type="text/javascript" src="https://kjur.github.io/jsrsasign/jsrsasign-all-min.js"></script>

<script language="JavaScript" type="text/javascript">
function doSign() {
  var sigpw = document.form1.pwsig.value;
  var rsa = new RSAKey();
  var decryptedKeyHex = KEYUTIL.getDecryptedKeyHex(document.form1.prvkey1.value, sigpw);
  rsa.readPKCS5PrvKeyHex(decryptedKeyHex);
  var hashAlg = document.form1.hashalg.value;
  var hSig = rsa.sign(document.form1.msgsigned.value, hashAlg);
  document.form1.siggenerated.value = linebrk(hSig, 64);
}

function doVerify() {
  var sMsg = document.form1.msgverified.value;
  var hSig = document.form1.sigverified.value;

  var pubKey = KEYUTIL.getKey(document.form1.cert.value);
  var isValid = pubKey.verify(sMsg, hSig);

  // display verification result
  if (isValid) {
    _displayStatus("valide");
  } else {
    _displayStatus("invalide");
  }
}

function copyMsgAndSig() {
  _displayStatus("reset");
  document.form1.msgverified.value = document.form1.msgsigned.value; 
  document.form1.sigverified.value = document.form1.siggenerated.value; 
}

function _displayStatus(sStatus) {
  var div1 = document.getElementById("verifyresult");
  if (sStatus == "valide") {
    div1.style.backgroundColor = "skyblue";
    div1.innerHTML = "Die Signatur ist *VALIDE*.";
  } else if (sStatus == "invalide") {
    div1.style.backgroundColor = "deeppink";
    div1.innerHTML = "Die Signatur ist *NICHT VALIDE*.";
  } else {
    div1.style.backgroundColor = "yellow";
    div1.innerHTML = "Bitte Felder ausfüllen und Jetzt signieren klicken.";
  }
}

</script>
<style type="text/css">
TD  {vertical-align: top}
</style>
</head>
<body>
<h1>Beispiel Applikation für Signaturen per JS</h1>

<form name="form1">
<table border="0">
<tr><th>Signieren</th><th></th><th>Verifizieren</th></tr>

<tr>
<td>
PEM RSA Privater Schüssel<br/>
<!-- _test/z5.* for X.509v1 certificate and private key -->
<textarea name="prvkey1" rows="10" cols="65">
Hier deinen privaten Schlüssel einfügen.
</textarea><br/>
Welcher Text soll signiert werden?.<br/>
<input type="text" name="msgsigned" value="Dein Text"/><br/>
Bitte Passwort eingeben:<br/>
<input type="text" name="pwsig" size="20"/><br/>
</td>
<td></td>
<td>
Ergebnisse der Verifikation
<div id="verifyresult" style="background: yellow">Bitte Felder ausfüllen und auf Jetzt signieren klicken</div>
</td>
</tr>

<tr>
<td>
<select name="hashalg">
<option value="sha1" selected>SHA1
<option value="sha256">SHA256
<option value="sha512">SHA512
<option value="md5">MD5
<option value="ripemd160">RIPEMD-160
</select>
<input type="button" value="Jetzt signieren" onClick="doSign();"/><br/>
</td>
<td>
<input type="button" value="Kopieren" onClick="copyMsgAndSig();"/><br/>
</td>
<td>
<input type="button" value="Signatur verifizieren" onClick="doVerify();"/><br/>
</td>
</tr>

<tr>
<td>
Generierte Signatur<br/>
<textarea name="siggenerated" rows="4" cols="65"></textarea>
</td>
<td>
</td>
<td>
Signatur verifizieren<br/>
<textarea name="sigverified" rows="4" cols="65">
Hier steht bald deine Signatur
</textarea><br/>
Welcher Text soll verifiziert werden?<br/>
<input type="text" name="msgverified" value="Dein Text"/><br/>
Öffentlicher Schlüssel des Urhebers.<br/>
<textarea name="cert" rows="10" cols="65">
Hier deinen öffentlichen Schlüssel einfügen.
</textarea><br/>
</td>
</tr>

</table>
</form>



</body>
</html>

我想在这里插入一个JPEG变量

var hSig = rsa.sign(variableWithJPEGinIt, hashAlg);

这张照片将由用户在智能手机上拍摄。如果这不适用于JS，我也可以使用Cordova或其他选项，但在普通JS中这样做会很好。

您需要输入类型为

file

和

accept=“image/*；capture=camera”

（后者是可选的，但会立即打开摄像头，而不是要求先选择一个文件）。侦听此输入上的

change

事件，然后使用以二进制或数据URI形式读取文件。

您尝试了什么？向我们展示您的代码。如果您使用的是node.js，那么您需要并可以将文件加载到中。上载代码，而不是使用node.js。什么图像文件？一个驻留在您的服务器上，您只需指定到某个地方的路径，一个用户从客户端上传的，一张用户在智能手机上本地拍摄的照片。如果有用的话，我可以用科尔多瓦。

var hSig = rsa.sign(variableWithJPEGinIt, hashAlg);