ブラウザJavaScriptで文字列からハッシュ値を計算する方法

Node.jsの方法はメジャーですがブラウザ対応の方法がまとまってるのあまり見かけないのでメモです。

お急ぎの人用

async function digestMessage(message) {
  const msgUint8 = new TextEncoder().encode(message);
  const hashBuffer = await crypto.subtle.digest('SHA-256', msgUint8);
  const hashArray = Array.from(new Uint8Array(hashBuffer));
  return hashArray.map(b => b.toString(16).padStart(2, '0')).join('');
}

await digestMessage('hoge'); // ecb666d778725ec97307044d642bf4d160aabb76f56c0069c71ea25b1e926825

注意 ブラウザの場合はSecure contextであることが必須

変換で使う crypto.subtleSecure context でないと undefined になります。
HTTPSやホストが localhost127.0.0.1 だと動きますがHTTPだと動かないので注意が必要です。

補足 Node.jsでも実行可能

Node.js 19以降でWeb Crypto APIが安定版として利用可能なため最近のNode.jsであれば実行可能です。

詳細

ハッシュ値を計算するのに ArrayBuffer か TypedArray である必要があるので文字列を Uint8Array に変換します。

const msgUint8 = new TextEncoder().encode(message);

ハッシュ値を計算します。 ArrayBuffer が Promise で返ってくるので注意。
第一引数はアルゴリズムでSHA-1SHA-256SHA-384SHA-512が対応しています。

const hashBuffer = await crypto.subtle.digest('SHA-256', msgUint8);

参考リンク