初学者に分かりやすく[ログイン機能の開発においてハッシュ化についてまとめてみた]

はじめに

ログイン機能を作るときに「セキュリティ面心配だな」と思いますよね。。 調べてみると「ハッシュ化」しようと書いてるけど、どういうことなんだろう？
「ごちゃごちゃした文字列に変えるやつ？」とは？
どうやって使うのか、なぜ必要なのか、わかりづらいですよね。
本記事はハッシュ化について図や実際のコードで初心者にも分かりやすく記事を書いていきます。

体験談

私の体験談なのですが、webアプリの開発でログイン機能を追加しよう！とした時に最初はメールとパスワードで認証する場合、双方が一致していれば通すという構成をイメージしていました。
ですが、セキュリティ面が不安になり色々と調べてみたところ「ハッシュ化」「暗号化」というワードが出てきました。
ん？なんだっけそれ。と名前は聞いたことかるけど詳しくわからないな。 となってしまいました。

そこで、ここではログイン機能に特に欠かせないハッシュについて解説していきます！

~ そもそもハッシュ化ってなに？~~

ハッシュ化とは、「文字列を、元に戻せない“ごちゃごちゃの文字列”に変えること」です。

たとえば👇

"password123" → "ef92b778bafe771e89245b89ecbc..."

この「ef92...」のような文字列をハッシュ値といいます。

ハッシュ値は数学的なルールで作られますが、逆に戻すことはできません。
つまり、「一度ハッシュ化したら、元のパスワードは永久にわからない」
というのがポイントです。

🔒 なぜハッシュ化するの？

理由はとてもシンプルです。
もしあなたのWebサービスのデータベースが流出したら、
ユーザー全員のパスワードが丸見えになってしまいますよね。
でも、ハッシュ化して保存しておけば

password123 → $2b$10$0uWeM9R...

攻撃者が見ても「元の文字列」が分かりません。
つまり、ユーザーのパスワードを守るための最重要ステップなんです。

ハッシュ化を使ったログインの仕組み

イメージを図で見てみましょう👇

[登録時]
ユーザーが入力: "password123"
→ ハッシュ化してDBに保存: "$2b$10$0uWeM9R..."

[ログイン時]
ユーザーが再入力: "password123"
→ 同じハッシュ化ルールで変換
→ DBのハッシュ値と一致すればログイン成功！

つまり、
「元に戻す」のではなく、
あくまで「もう一度同じルールで変換して比べる」だけ！

これがハッシュ化の考え方です。

ソルト（salt）ってなに？

「同じパスワードを使ってる人同士、ハッシュ値が同じだと危ない」
そんなときに使うのが ソルト（塩） です。
ソルトとは、「パスワードにちょっとした味付け（ランダム文字列）」をすること。

例：　password = "password123"
　　　salt = "x7G9!"
　　　→ "password123x7G9!"
　　　→ ハッシュ化

こうすることで、同じパスワードでも違うハッシュ値になります。

ここで疑問が生まれませんか?

「同じパスワードでもソルトで違うなら、ログインの時どうやって判断するの？」

ここでログインの処理の順番を見てみます。

１メールアドレス（やユーザー名）でユーザーを特定
２そのユーザーのソルトを取り出す
３入力したパスワードにそのソルトを混ぜてハッシュ化
４データベースのハッシュと一致すればOK

つまり「ソルトを使って区別」しているわけではなく、
「ソルトを使って攻撃を防ぎつつ、同じハッシュを再現して認証している」んです。

ここが難しいポイントかなと思います。。。

⚙️ 実際のコード例（Node.js / bcrypt）

Node.jsでよく使われるライブラリは bcrypt です。

1️⃣ bcryptのインストール
npm install bcrypt

2️⃣ 登録時（ハッシュ化して保存）

import bcrypt from "bcrypt";

const password = "password123";
const saltRounds = 10;

// パスワードをハッシュ化
const hashedPassword = await bcrypt.hash(password, saltRounds);

console.log("ハッシュ化されたパスワード:", hashedPassword);
// → $2b$10$3B4A...

この hashedPassword をデータベースに保存します。
元の文字列は保存しません。

3️⃣ ログイン時（照合）

const inputPassword = "password123";
const isMatch = await bcrypt.compare(inputPassword, hashedPassword);

if (isMatch) {
  console.log("ログイン成功！");
} else {
  console.log("パスワードが違います。");
}

compare() 関数が自動で「同じルールでハッシュ化 → 一致確認」してくれます。

まとめ

ハッシュ化
一方向の変換。元に戻せない

ソルト
ランダムな値を混ぜて安全性を上げる

保存するもの
パスワードのハッシュ値のみ

認証の仕組み
入力 → ハッシュ化 → 一致すればログイン成功

✨ さいごに

ハッシュ化は、セキュリティの中でもとても大切な仕組みだということが分かりました。
仕組みを理解しておくだけで、開発するときにプロダクトのセキュリティで安心できますね。

一緒に学習頑張りましょう！！

💬 もし役に立ったら…
いいね・ストックしてもらえると、今後の学習記事のモチベになります🔥