無料オンラインURLエンコード・デコードツール
テキストをパーセントエンコードされたURLに変換したり、%20、%26など任意の%XXシーケンスをデコードできます。すべてブラウザ内で瞬時に処理されます。
エンコード例一覧
| 入力 | encodeURIComponent | encodeURI |
|---|---|---|
| hello world | hello%20world | hello%20world |
| name=John&age=30 | name%3DJohn%26age%3D30 | name=John&age=30 |
| https://example.com/path?q=hi | https%3A%2F%2Fexample.com%2Fpath%3Fq%3Dhi | https://example.com/path?q=hi |
| café résumé | caf%C3%A9%20r%C3%A9sum%C3%A9 | caf%C3%A9%20r%C3%A9sum%C3%A9 |
| price: $9.99 (sale!) | price%3A%20%249.99%20(sale!) | price%3A%20%249.99%20(sale!) |
URLエンコードとは？
URLエンコード（パーセントエンコーディングとも呼ばれます）は、URLで安全に使用できない文字を「%」記号と2桁の16進数に変換する仕組みです。例えば、スペースは%20、アンパサンドは%26、等号は%3Dになります。
URLは限られたASCII文字しか扱えないため、ブラウザやサーバーはこのエンコードを必要とします。スペース、アクセント付き文字、中国語の文字、特殊記号など、この安全な範囲外の文字はURLに含める前にすべてエンコードする必要があります。
encodeURIComponent と encodeURI の違い
JavaScriptにはURLエンコード用のネイティブ関数が2つ用意されています。どちらを使うかはエンコード対象によって異なります。
encodeURIComponent()
クエリ文字列の個々の値に使用します。文字・数字と - _ . ! ~ * ' ( ) 以外のすべてをエンコードします。/ : ? # & = @ もエンコードされます。
encodeURI()
完全なURL文字列に使用します。/ : ? # & = @ のような構造上の文字を保持するため、URLとして有効な状態を保てます。
URLエンコードのよくある利用シーン
パーセントエンコーディングは、現代のWeb開発やAPIのあらゆる場面で登場します。
検索・クエリパラメータ
GETリクエストに追加する前に、ユーザーが入力した検索語をエンコードし、特殊文字がクエリ文字列を壊さないようにします。
動的な値を使うAPI呼び出し
RESTやGraphQLのAPIでは、パスセグメントやパラメータの値を曖昧さ回避のためパーセントエンコードする必要がある場合が多くあります。
OAuth・リダイレクトURL
OAuth 2.0のredirect_uriパラメータは、認可サーバーがコールバックアドレスを正しく解析できるよう完全にエンコードする必要があります。
非ASCIIのスラッグ
アラビア語、中国語、日本語、またはアクセント付きラテン文字のページURLは、ブラウザやクローラーとの最大限の互換性を保つためパーセントエンコードする必要があります。
HTMLフォームのGET送信
ブラウザはフォームの値をアクションURLに追加する前にエンコードします。この仕組みを理解すると、想定外の%2Bや%20が現れた際のデバッグに役立ちます。
よくある質問
プライバシー
エンコード・デコードはすべて、ネイティブのJavaScript関数を使ってブラウザ内で処理されます。テキストがサーバーに送信されたり、保存・記録されたりすることは一切ありません。タブを閉じれば、入力内容の痕跡は完全に消えます。