Vercelリダイレクト/リライトのセキュリティ強化：初心者向け完全ガイド
投稿日：
更新日：
- 301 Moved Permanently（恒久的な移動）: URLが完全に変更されたことを示します。検索エンジンは新しいURLをインデックスし、SEO評価も引き継がれます。
- 302 Found（一時的な移動）: URLが一時的に変更されたことを示します。メンテナンスやA/Bテストなどに利用されます。
- 307 Temporary Redirect（一時的なリダイレクト）: 302と同様に一時的なリダイレクトですが、HTTPメソッド（GET, POSTなど）を保持します。
- 308 Permanent Redirect（恒久的なリダイレクト）: 301と同様に恒久的なリダイレクトですが、HTTPメソッドを保持します。
| 項目 | リダイレクト | リライト |
|---|---|---|
| 処理場所 | クライアント（Webブラウザ） | サーバー |
| URLの変更 | 変更される | 変更されない |
| 目的 | URLの変更、SEO対策 | URLの簡略化、内部構造の隠蔽 |
vercel.jsonファイルまたはVercel UIを使ってリダイレクト/リライトを設定できます。
vercel.jsonでの設定例:
{
"redirects": [
{
"source": "/old-page", // アクセス元のURL
"destination": "/new-page", // リダイレクト先のURL
"permanent": true // 301リダイレクト（省略時は307）
}
],
"rewrites": [
{
"source": "/api/:path*", // アクセス元のURL（:path*はワイルドカード）
"destination": "/_vercel/functions/api/:path*" // リライト先のURL
}
]
}
Vercelのダッシュボードから、プロジェクトを選択し、「Redirects」または「Rewrites」タブで設定を追加できます。 ### セキュリティリスクとその対策 リダイレクトとリライトは便利な機能ですが、設定を誤るとセキュリティリスクに繋がる可能性があります。特に注意すべきは、オープンリダイレクト脆弱性、リダイレクトチェーンによるパフォーマンス低下、正規表現の誤用です。 #### オープンリダイレクト脆弱性とは？ オープンリダイレクト脆弱性（Open Redirect Vulnerability）とは、リダイレクト先を外部から指定できる場合に発生するセキュリティ上の欠陥です。攻撃者は悪意のあるURLをリダイレクト先に指定し、ユーザーをフィッシングサイトやマルウェア配布サイトに誘導する可能性があります。 #### リダイレクトチェーンによるパフォーマンス低下 リダイレクトチェーン（Redirect Chain）とは、複数のリダイレクトが連鎖的に発生する状態のことです。リダイレクトチェーンが長くなると、Webページの読み込み時間が長くなり、ユーザーエクスペリエンスが低下します。 #### 正規表現の誤用による意図しないリダイレクト 正規表現（Regular Expression）は、文字列のパターンを表現するための記法です。リダイレクト/リライトの設定で正規表現を使用する場合、誤ったパターンを指定すると、意図しないURLがリダイレクト/リライトされてしまう可能性があります。 #### 対策：リダイレクト先の検証、正規表現のテスト、リダイレクトチェーンの削減 これらのセキュリティリスクを回避するために、以下の対策を講じましょう。
- リダイレクト先の検証: リダイレクト先を信頼できるURLに限定し、外部からの入力をそのままリダイレクト先に使用しないようにしましょう。
- 正規表現のテスト: 正規表現を使用する場合は、必ずテストを行い、意図した通りに動作するか確認しましょう。
- リダイレクトチェーンの削減: リダイレクトチェーンが発生しないように、できるだけ直接的なリダイレクトを設定しましょう。
allowed-destinations、case-sensitive、locale、hasオプションを適切に活用することで、より安全なWebサイトを構築できます。
#### allowed-destinationsによるリダイレクト先の制限
allowed-destinationsオプションを使用すると、リダイレクト先として許可するドメインを制限できます。これにより、オープンリダイレクト脆弱性のリスクを軽減できます。
{
"redirects": [
{
"source": "/redirect-me",
"destination": "https://example.com",
"allowed-destinations": ["example.com"] // example.comのみ許可
}
]
}
case-sensitiveオプションによる大文字小文字の区別
case-sensitiveオプションを使用すると、URLの大文字小文字を区別できます。これにより、意図しないリダイレクトを防ぐことができます。
{
"redirects": [
{
"source": "/My-Page",
"destination": "/my-page",
"case-sensitive": true // 大文字小文字を区別
}
]
}
localeオプションによる言語/地域設定
localeオプションを使用すると、ユーザーの言語/地域設定に基づいてリダイレクトできます。これにより、多言語対応のWebサイトで適切なコンテンツを表示できます。
{
"redirects": [
{
"source": "/",
"destination": "/en",
"locale": "en" // 英語の場合
},
{
"source": "/",
"destination": "/ja",
"locale": "ja" // 日本語の場合
}
]
}
hasオプションによる条件付きリダイレクト
hasオプションを使用すると、Cookie、ヘッダー、クエリパラメータなどの条件に基づいてリダイレクトできます。これにより、より柔軟なリダイレクト設定が可能になります。
{
"redirects": [
{
"source": "/",
"destination": "/premium",
"has": [
{
"type": "cookie",
"key": "isPremium",
"value": "true" // Cookie isPremiumがtrueの場合
}
]
}
]
}
- HTTPからHTTPSへのリダイレクト:
{
"redirects": [
{
"source": "/(.*)",
"destination": "https://your-domain.com/$1",
"permanent": true,
"has": [
{
"type": "header",
"key": "x-forwarded-proto",
"value": "http"
}
]
}
]
}
- wwwあり/なしの統一:
{
"redirects": [
{
"source": "/(.*)",
"destination": "https://your-domain.com/$1",
"permanent": true,
"has": [
{
"type": "host",
"value": "www.your-domain.com"
}
]
}
]
}
- 古いURLから新しいURLへのリダイレクト:
{
"redirects": [
{
"source": "/old-page",
"destination": "/new-page",
"permanent": true
}
]
}
- A/Bテストのためのリダイレクト:
{
"redirects": [
{
"source": "/",
"destination": "/variant-a",
"has": [
{
"type": "cookie",
"key": "ab-test",
"value": "a"
}
]
},
{
"source": "/",
"destination": "/variant-b"
}
]
}
vercel.jsonファイルの構文が正しいか- リダイレクト/リライトのルールが競合していないか
- 正規表現が正しく記述されているか
- Vercelのログにエラーが表示されていないか
- リダイレクトとリライトの違いを理解する
- オープンリダイレクト脆弱性などのセキュリティリスクを認識する
allowed-destinationsなどのVercelのセキュリティオプションを活用する- 設定例を参考に、実践的なリダイレクト/リライトを設定する
- トラブルシューティングのチェックリストを確認する