URLエンコーディングとパーセントエスケープシーケンス
RFC 3986で定義されているURLエンコーディング（パーセントエンコーディング）を理解しましょう。エスケープが必要な文字、encodeURIとencodeURIComponentの違い、URLでのUTF-8の扱いを解説します。
Web & HTML
詳細な説明
URLエンコーディング（パーセントエンコーディング）
URLエンコーディングは、安全でない文字や予約文字をパーセント記号の後に2桁の16進数を付けたバイト値で置き換えます。RFC 3986で定義されたこのメカニズムにより、URLがすべてのシステムで有効に保たれます。
エンコードが必要な文字
URLには限られたASCII文字セットのみ含めることができます。それ以外はすべてパーセントエンコードが必要です：
- 非予約文字（エンコード不要）：
A-Z、a-z、0-9、-、_、.、~ - 予約文字（デリミタとして使用されない場合にエンコード）：
:、/、?、#、[、]、@など - その他すべての文字：スペース、非ASCII、制御文字
エンコーディングの仕組み
UTF-8表現の各バイトが %HH としてエンコードされます。
encodeURI vs encodeURIComponent
JavaScriptはこの2つの関数を提供しており、重要な違いがあります：
encodeURI()— 完全なURIをエンコードし、:、/、?、#、&、=などのデリミタを保持。encodeURIComponent()— 単一のURIコンポーネント（クエリパラメータ値）をエンコードし、すべての予約文字をエンコード。
クエリ値に encodeURI を使用するのはよくあるバグです — & や = などの予約文字がエスケープされずに通過し、クエリ文字列構造が壊れます。
フォームエンコーディング
HTMLフォームはスペースを %20 ではなく + としてエンコードします。これはRFC 3986ではなくHTML仕様で定義された別のエンコーディングです。
二重エンコーディング
頻繁に起きるミスは、既にエンコードされたURLを再エンコードすることで、%20 が %2520 に変わります。入力が既にエンコードされているかどうか不明な場合は、まずデコードしてください。
ユースケース
URLエンコーディングは、クエリパラメータ付きAPIリクエストの構築、リダイレクトURLの構成、特殊文字を含む共有リンクの生成、国際化ドメイン名の処理、Webhookペイロードの処理、OAuth認証URLの構築、URLを構成または解析するあらゆるサーバーサイドまたはクライアントサイドコードに不可欠です。