はじめに
JavaScriptでハッシュ関数を使いたくて、いろいろな記事を見ていたのですが、node.jsでインポートして使うのが多かった印象でした。
しっかりとは私も理解していないのですが、JaveScriptでハッシュ関数(sha256)を使うことができたので、それを記事にしました。
ハッシュ値をWebページに出力まで
まずこのページへ飛んで、ダウンロードしてください。→jsSHA
そしてダウンロードしてきたフォルダを解凍するとjsSHA-masterというフォルダが手に入ると思います。
そのフォルダ内にあるsrcフォルダに入ると、「sha256.js」というファイルがあるので、それをこれから作る、「index.html」「main.js」ファイルと同じフォルダに置いてください。
あとは以下のようにコードを書けばハッシュ化できるはずです。
index.html
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>SHA256</title>
</head>
<body>
<div id="test"></div>
<script type="text/javascript" src="sha256.js"></script>
<script type="text/javascript" src="main.js"></script>
</body>
</html>
main.js
"use strict";
{
const SHA_OBJ = new jsSHA("SHA-256","TEXT");
const TEST = document.getElementById("test");
window.onload = () => {
let _text = "ハッシュ関数";
SHA_OBJ.update(_text);
TEST.textContent = SHA_OBJ.getHash("HEX");
}
}
index.htmlをブラウザで起動すると、上図のように表示されるはずです。
ここではハッシュ関数という文字列をハッシュ化しています。