🔗 URLエンコード・デコード
日本語や記号を含むURLを%XX形式に変換、またはその逆に戻します。入力すると同時に変換され、encodeURIComponent と encodeURI の結果を並べて比較できるので、「どちらを使えばいいか」で迷いません。長いURLのパラメータを表に分解する機能もあります。
結果 encodeURIComponent
参考 encodeURI
🔒 すべてブラウザ内処理。入力したURLはサーバーに送信されません。
⚖️ encodeURI と encodeURIComponent の使い分け
プログラミングで最も間違えやすいポイントです。結論から言うと——
- パラメータの「値」を変換するなら encodeURIComponent。これが9割の場面で正解です。
- URL全体をまとめて変換するなら encodeURI。
/?&=:といった構造を保つ必要があるためです。
なぜ間違えると危ないのか:たとえば検索語が「A&B」だった場合、encodeURIでは&が変換されないため、?q=A&B となり「qパラメータはA」「Bという別のパラメータがある」と誤解されます。encodeURIComponentなら%26に変換され、正しく「A&B」という1つの値として扱われます。
💡 上のツールは両方の結果を同時に表示します。値だけを変換したいのにスラッシュがそのまま残っているときは、encodeURI側を見ている可能性があります。
🔤 なぜ日本語は %E3%81%82 になるのか
URLで使える文字は、英数字と - . _ ~ などごく一部の記号に限られています(RFC 3986)。それ以外の文字は「パーセントエンコーディング」で表現します。
手順は2段階です。
- 文字をUTF-8のバイト列に変換。「あ」→
E3 81 82(3バイト) - 各バイトを %+16進数2桁に。→
%E3%81%82
そのため日本語1文字あたり%XXが3つ連なります。「日本語」の3文字なら9個で%E6%97%A5%E6%9C%AC%E8%AA%9Eとなり、元の文字数より大幅に長くなります。URLの長さ制限(おおむね2000文字程度が安全圏)に引っかかる場合は、日本語パラメータを短縮する設計を検討してください。
📋 記号の変換対応表
| 文字 | 変換後 | encodeURIで変換される? | 用途上の注意 |
|---|---|---|---|
| (スペース) | %20 | ✅ される | フォーム送信では「+」になる場合も |
| & | %26 | ❌ されない | 値に含むなら必ず変換。しないとパラメータ区切りと誤解される |
| = | %3D | ❌ されない | 同上。Base64の末尾などで要注意 |
| ? | %3F | ❌ されない | クエリの開始と誤解される |
| / | %2F | ❌ されない | パス区切りと誤解される |
| # | %23 | ❌ されない | 以降がフラグメント扱いになり消える |
| + | %2B | ❌ されない | スペースと誤解される可能性がある |
| % | %25 | ❌ されない | 変換漏れがデコードエラーの主因 |
※「encodeURIで変換されない」記号も、encodeURIComponentではすべて変換されます。
❓ よくある質問
- Q. デコードするとエラーになります
- 文字列に単独の
%が含まれていると発生します(例:「50%OFF」)。%の後ろは必ず16進数2桁である必要があります。文字として使いたい場合は%25にエンコードしてください。 - Q. スペースは「+」と「%20」のどちら?
- 本ツールは標準の
%20に変換します。「+」はHTMLフォーム送信での古い慣習です(デコード時は両方に対応しています)。 - Q. 日本語のURLはそのまま使えないの?
- 最近のブラウザはアドレスバーに日本語を表示しますが、実際の通信ではエンコードされた形が送られています。HTMLやプログラムに書く際はエンコード済みの形を使うのが確実です。
- Q. QRコードにする場合は?
- エンコード済みのURLを使うのが安全です。QRコード作成ツール(送信なし)でそのまま画像にできます。
- Q. 入力したURLは記録されますか?
- されません。すべてブラウザ内で処理され、サーバーには送信されません。