title: Load a JPEG as binary in a variable in JavaScript
body: <p>my goal is to sign a JPEG-File with jsrasign: <a href="https://github.com/kjur/jsrsasign" rel="nofollow noreferrer">https://github.com/kjur/jsrsasign</a></p>
  
  <p>There is a demo to sign a normal String: <a href="https://kjur.github.io/jsrsasign/sample/sample-rsasign.html" rel="nofollow noreferrer">https://kjur.github.io/jsrsasign/sample/sample-rsasign.html</a></p>
  
  <p>How can I use this demo to adopt this for a JPEG files? I could not find a way to save the complete untouched binary of an JPEG file in a variable.</p>
  
  <p>But I need this since verification will fail if the binary of the image is changed or different.</p>
  
  <p>Here is the code:</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
  &lt;title&gt;Beispiel Applikation für Signaturen per JS&lt;/title&gt;
  &lt;script language="JavaScript" type="text/javascript" src="https://kjur.github.io/jsrsasign/jsrsasign-all-min.js"&gt;&lt;/script&gt;
  
  &lt;script language="JavaScript" type="text/javascript"&gt;
  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.";
    }
  }
  
  &lt;/script&gt;
  &lt;style type="text/css"&gt;
  TD  {vertical-align: top}
  &lt;/style&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;h1&gt;Beispiel Applikation für Signaturen per JS&lt;/h1&gt;
  
  &lt;form name="form1"&gt;
  &lt;table border="0"&gt;
  &lt;tr&gt;&lt;th&gt;Signieren&lt;/th&gt;&lt;th&gt;&lt;/th&gt;&lt;th&gt;Verifizieren&lt;/th&gt;&lt;/tr&gt;
  
  &lt;tr&gt;
  &lt;td&gt;
  PEM RSA Privater Schüssel&lt;br/&gt;
  &lt;!-- _test/z5.* for X.509v1 certificate and private key --&gt;
  &lt;textarea name="prvkey1" rows="10" cols="65"&gt;
  Hier deinen privaten Schlüssel einfügen.
  &lt;/textarea&gt;&lt;br/&gt;
  Welcher Text soll signiert werden?.&lt;br/&gt;
  &lt;input type="text" name="msgsigned" value="Dein Text"/&gt;&lt;br/&gt;
  Bitte Passwort eingeben:&lt;br/&gt;
  &lt;input type="text" name="pwsig" size="20"/&gt;&lt;br/&gt;
  &lt;/td&gt;
  &lt;td&gt;&lt;/td&gt;
  &lt;td&gt;
  Ergebnisse der Verifikation
  &lt;div id="verifyresult" style="background: yellow"&gt;Bitte Felder ausfüllen und auf Jetzt signieren klicken&lt;/div&gt;
  &lt;/td&gt;
  &lt;/tr&gt;
  
  &lt;tr&gt;
  &lt;td&gt;
  &lt;select name="hashalg"&gt;
  &lt;option value="sha1" selected&gt;SHA1
  &lt;option value="sha256"&gt;SHA256
  &lt;option value="sha512"&gt;SHA512
  &lt;option value="md5"&gt;MD5
  &lt;option value="ripemd160"&gt;RIPEMD-160
  &lt;/select&gt;
  &lt;input type="button" value="Jetzt signieren" onClick="doSign();"/&gt;&lt;br/&gt;
  &lt;/td&gt;
  &lt;td&gt;
  &lt;input type="button" value="Kopieren" onClick="copyMsgAndSig();"/&gt;&lt;br/&gt;
  &lt;/td&gt;
  &lt;td&gt;
  &lt;input type="button" value="Signatur verifizieren" onClick="doVerify();"/&gt;&lt;br/&gt;
  &lt;/td&gt;
  &lt;/tr&gt;
  
  &lt;tr&gt;
  &lt;td&gt;
  Generierte Signatur&lt;br/&gt;
  &lt;textarea name="siggenerated" rows="4" cols="65"&gt;&lt;/textarea&gt;
  &lt;/td&gt;
  &lt;td&gt;
  &lt;/td&gt;
  &lt;td&gt;
  Signatur verifizieren&lt;br/&gt;
  &lt;textarea name="sigverified" rows="4" cols="65"&gt;
  Hier steht bald deine Signatur
  &lt;/textarea&gt;&lt;br/&gt;
  Welcher Text soll verifiziert werden?&lt;br/&gt;
  &lt;input type="text" name="msgverified" value="Dein Text"/&gt;&lt;br/&gt;
  Öffentlicher Schlüssel des Urhebers.&lt;br/&gt;
  &lt;textarea name="cert" rows="10" cols="65"&gt;
  Hier deinen öffentlichen Schlüssel einfügen.
  &lt;/textarea&gt;&lt;br/&gt;
  &lt;/td&gt;
  &lt;/tr&gt;
  
  &lt;/table&gt;
  &lt;/form&gt;
  
  
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Instead of getting the value of input text</p>
  
  <pre><code>document.form1.msgsigned.value 
  </code></pre>
  
  <p>I would like to inject a JPEG in variable here</p>
  
  <pre><code>var hSig = rsa.sign(variableWithJPEGinIt, hashAlg);
  </code></pre>
  
  <p>The picture will be taken by a user on his smartphone. If this will not work with JS only I can also use Cordova or other options, but would be great to do this in   normal JS.</p>