Javascriptでファイルのsha1ハッシュを計算する

CryptJSを使う方法もあるが、今回はブラウザの標準のAPIのみで行う方法を紹介。
同様の方法でSHA256,SHA384,SHA512のハッシュも計算できる。

ポイント

  • FileReaderはローカルファイルでも読みだし完了(onload)を待つ
  • ファイルがバイナリの場合も想定してreadAsBinaryString()で読み出しておくと無難
  • crypto.subtle.digest()は非同期で実行されるのでawaitなどで値を取得
  • ArrayBuffer型でハッシュ計算結果が返ってくるのでHex表記など好みの形に成型する必要がある
<html>
<body>
    <input id="inputfile" type=file />
    <script>
        async function digestMessage(algo, message) {
            const msgUint8 = (new TextEncoder()).encode(message);// encode as (utf-8) Uint8Array
            const hashBuffer = await crypto.subtle.digest(algo, msgUint8);// hash the message
            const hashArray = Array.from(new Uint8Array(hashBuffer));// convert buffer to byte array
            const hashHex = hashArray.map(b => b.toString(16).padStart(2, '0')).join('');// convert bytes to hex string
            return hashHex;
        }
        document.querySelector('#inputfile').addEventListener('change', async function(ev){
            if(!ev.target.files){
                return;
            }
            if(!ev.target.files[0]){
                return ;
            }
            const file = ev.target.files[0];
            var reader = new FileReader();
            reader.onload = async function(ev) {
                if (ev.target.readyState != FileReader.DONE) {
                    return;
                }
                const bytes = ev.target.result;
                const hashHex = await digestMessage('SHA-1', bytes);
                alert(hashHex);
            };
            reader.readAsBinaryString(file);
        });
    </script>
</body>
</html>

参考
https://developer.mozilla.org/ja/docs/Web/API/SubtleCrypto/digest
https://developer.mozilla.org/ja/docs/Web/API/FileReader

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です