- URLパラメータの入力検証は「外部から渡される値に“権限”を渡しすぎないための基本設計」です
- URLパラメータが危険になりうる具体例をイメージする
- ステップ1：URLパラメータの「型」と「許可値」を明確にする
- ステップ2：URLパラメータを安全に取得する基本ユーティリティ
- ステップ3：整数パラメータの検証（ページ番号など）
- ステップ4：列挙値パラメータの検証（タブ名など）
- ステップ5：パス系パラメータの検証（リダイレクト先など）
- ステップ6：真偽値パラメータの検証（フラグなど）
- ステップ7：業務で使える「URLパラメータ入力検証ユーティリティ」まとめ版
- ステップ8：絶対に避けるべき危険なパターンを明確にしておく
- ステップ9：チームで共有するための「URLパラメータ設計ルール」をコードとドキュメントに刻む
- まとめ：URLパラメータの入力検証は「外部から渡される値に権限を渡しすぎないための、実務的で欠かせない技術」です
URLパラメータの入力検証は「外部から渡される値に“権限”を渡しすぎないための基本設計」です
業務システムでは、URLパラメータを使う場面がとても多いです。
?page=2のようなページ番号?id=123のようなリソースID?redirect=/dashboardのようなリダイレクト先?tab=settingsのような表示タブ指定
URLパラメータは便利ですが、外部から自由に書き換えられる入力でもあります。 攻撃者は、ブラウザのアドレスバーやリンクを通じて、好きな値を渡すことができます。
そのため、URLパラメータをそのまま信じて使うと、
- 想定外の画面遷移
- DOM Injection / XSS
- Open Redirect
- 不正なIDアクセス（認可漏れ）
など、さまざまな問題の入り口になります。
ここでは、初心者向けに、
- なぜURLパラメータの入力検証が必要なのか
- どのようにJavaScriptで検証するか
- 実務で使えるユーティリティと設計
をステップバイステップで解説していきます。
URLパラメータが危険になりうる具体例をイメージする
例1：タブ切り替えにURLパラメータを使う
const params = new URLSearchParams(location.search);
const tab = params.get("tab"); // "home" や "settings" を想定
showTab(tab); // 検証なしで使用
攻撃者は次のようなURLを作れます。
https://example.com/app?tab=<script>alert('XSS')</script>
showTab の中で innerHTML などを使っていた場合、 この tab 値がそのままDOMに注入されてしまい、XSSが成立する可能性があります。
例2：リダイレクト先をURLパラメータで指定する
const params = new URLSearchParams(location.search);
const redirect = params.get("redirect");
if (redirect) {
location.href = redirect; // 検証なしでリダイレクト
}
攻撃者は次のようなURLを作れます。
https://example.com/login?redirect=https://evil.com/phishing
ユーザーは正規サイトにアクセスしたつもりでも、 ログイン後に攻撃サイトへ飛ばされてしまいます（Open Redirect）。
ポイント：URLパラメータは「外部から自由に書き換えられる入力」であり、 検証なしで使うと、攻撃者にシステムの挙動を操作されてしまう可能性がある、ということです。