URLエンコーダー / デコーダー
URLを即座にエンコード・デコードします。encodeURIComponentと完全URIエンコードをサポート。100%クライアント処理。
すべての処理はブラウザ内でのみ行われます。データはサーバーに送信されません。
URLエンコード(パーセントエンコード)とは?
URLエンコードはパーセントエンコードとも呼ばれ、URLで使用できない文字を%記号と2桁の16進数に変換する方式です。RFC 3986で定義されており、スペース・特殊文字・日本語などの非ASCII文字をURLに安全に含めることができます。例)スペース → %20、「あ」 → %E3%81%82。
どのモードを使うべきですか?
URLエンコードには2つのモードがあります。Full URIモード(encodeURI)はURL全体をエンコードしながら、://や?、&などのURL構造文字を保持します。完全なURLを安全に渡したいときに適しています。Componentモード(encodeURIComponent)は?q=検索語のようにパラメータの値1つをエンコードする用途で、構造文字も含めすべてエンコードするため、URL全体に使用するとブラウザがアドレスとして認識できなくなります。
encodeURIComponent と encodeURI の違い
| 項目 | Component | Full URI |
|---|---|---|
| 保持される文字 | A–Z a–z 0–9 - _ . ! ~ * ' ( ) | 上記 + URL構造文字 (: / ? # [ ] @ ! $ & ' ( ) * + , ; =) |
| 主な用途 | クエリパラメータ値、フォームデータ | URL全体を構造を保ちながら安全にエンコード |
よくエンコードされる文字
| 文字 | エンコード | 説明 |
|---|---|---|
space | %20 | フォームエンコードでは + と表記されることもある |
& | %26 | クエリパラメータ区切り文字 |
= | %3D | キー=値の区切り文字 |
# | %23 | フラグメント識別子 |
+ | %2B | プラス記号(スペースではない) |
/ | %2F | パス区切り文字 |
? | %3F | クエリ開始文字 |
@ | %40 | メールアドレス、認証情報 |
よくある質問
URLエンコードとパーセントエンコードは同じですか?
はい、同じです。パーセントエンコードはRFC 3986で定義された公式名称です。使用できない文字を%に続くUTF-8バイト値の16進数で表現します。
日本語をエンコードするとなぜ長くなるのですか?
日本語はUTF-8で3バイト必要です。各バイトが%XX形式に変換されるため、1文字が%XX%XX%XXの9文字になります。例)「あ」→ %E3%81%82。
スペースが%20と+の両方で表現されるのはなぜですか?
%20がRFC 3986標準のエンコードです。+はHTMLフォームエンコード形式(application/x-www-form-urlencoded)でのスペース表現です。URLでは%20がより安全です。
ComponentモードとFull URIモードはどう使い分けますか?
クエリパラメータの値をエンコードする場合はComponent(encodeURIComponent)を、URL全体を構造(://、?、&など)を保ちながらエンコードする場合はFull URI(encodeURI)を使用します。
二重エンコードとは何ですか?
すでにエンコードされた文字列をさらにエンコードすることです。例)%20 → %2520。URLが正常に動作しなくなるため、入力がすでにエンコードされていないか確認してください。
ブラウザで日本語URLを直接入力できますが?
ブラウザが自動的にパーセントエンコードして人が読みやすい形式で表示しています。実際に送信されるURLはパーセントエンコードされた形式です。
入力したデータはサーバーに送信されますか?
いいえ。すべてのエンコード・デコードはブラウザ内のJavaScriptで処理されます。データはサーバーに送信されません。