URLエンコード・デコード
文字列をURL用にパーセントエンコード、または%20だらけのリンクを読める文字に。
このURLエンコード・デコードツールは、入力に合わせてテキストをパーセントエンコードと相互変換します。クエリ文字列に入れる前に値をエンコードしたり、%20・%3A・%2Fだらけのリンクを貼って中身を確認したりできます。どちらの方向もリアルタイムに更新されます。
処理はすべてブラウザ内でローカルに行われるため、セッションID・署名付きパラメータ・トラッキングトークンを含むURLを貼っても安全です。何もどこにも送信されません。リダイレクトの連鎖、OAuthのコールバック、Webhook URLのデバッグ用のメモ帳として実用的です。
パーセントエンコードが存在するのは、URLで使える文字が限られているからです。スペース・アンパサンド・疑問符・非ASCII文字は、%の後に16進数を続けてエスケープする必要があり、そうしないとURLの意味が変わってしまいます。値をエンコードすればそのまま保たれます。エンコードし忘れることが、クエリ文字列が壊れる原因です。
URLエンコード・デコードの手順
- テキストやURLを入力欄に貼り付けます。
- 特殊文字をエスケープするならエンコード、%XXの並びを戻すならデコードを選びます。
- 出力欄でリアルタイムの結果を確認します。
- クエリ文字列の値は、URL全体ではなく値だけをエンコードします。そうすれば&や=の区切りが保たれます。
- ワンクリックで出力をコピーします。
URL全体ではなく値をエンコードする
最もよくある間違いは、完全なURLをエンコーダーに通してしまうことです。それだと://やすべての&区切りまでエスケープされ、もう動かないリンクになります。エンコードするのはデータを担う部分、たとえば個々のクエリパラメータの値やパスの一部分だけにして、その周りにURLを組み立ててください。
もう一つ知っておくと便利なこと。スペースは%20、または古いクエリ文字列では+として現れます。デコードした文字列でスペースのはずの場所に+があれば、それは不具合ではなく従来のフォームエンコードです。
パーセントエンコードは何のためにあるか
URLに使える文字は、英字・数字・少数の記号という限られた集合だけです。それ以外のすべて、スペースやほとんどの記号、あらゆる非ASCII文字は、間接的に表現しなければなりません。パーセントエンコードがその仕組みです。許可されていない各バイトは、%記号の後に2桁の16進数を続けて書かれ、スペースは%20に、コロンは%3Aになります。
これが重要なのは、いくつかの文字が構造上の意味を持つからです。?はクエリ文字列の開始、&はパラメータの区切り、=はキーと値の結び付け、/はパスの境界を表します。もしデータの一部にこれらの文字が含まれていれば、エンコードしなければなりません。そうしないとブラウザやサーバーがそれを構造として読み、意図とは違う意味のURLになってしまいます。
エンコードとデコードがブラウザ内で動く仕組み
このツールは、入力した瞬間に双方向で変換します。使うのはブラウザ自身のエンコード処理で、あなたの端末上でJavaScriptとして動きます。エンコードはテキストをたどり、安全な文字はそのままにして、それ以外のすべてのバイトを%XX形式に書き換えます。デコードは%の並びを探し、それぞれを元の文字に戻します。
これらはすべてローカルで行われるため、サーバーへの往復も待ち時間もありません。つまり一度読み込めばオフラインでも動き続け、そして重要なことに、貼り付けたものは端末内にとどまります。これこそ、リンクを受け取るWebサービスを介するのではなく、クライアント側で処理する理由そのものです。
トークンを含むリンクのプライバシー
実際のURLには、機密性の高いものが詰まっていることがよくあります。セッションID、署名付きクエリパラメータ、OAuthの認可コード、パスワードリセット用トークン、トラッキング識別子、そして非公開ファイルへの一時的なアクセスを許す署名付きストレージリンクなどです。これらをデータを送信するツールに貼り付けることは、実質的に有効な資格情報をそのサービスの運営者に漏らすことになります。
ここでは何もアップロード・保存・記録されません。エンコードとデコードはブラウザ内だけで行われるので、デバッグ中の署名付きコールバックURLやマジックリンクが端末を離れることはなく、タブを閉じれば消えます。だからこのツールは、責任を持ってどこにも送れないようなリダイレクトの連鎖や認証フローを調べるための、安全なメモ帳になります。
よくあるデバッグ作業
デコードは、信頼する前に怪しげなリンクを読み解く手早い方法です。%2F・%3A・%3FだらけのURLを貼れば、読める形になって、それが実際にどこを指しどんなパラメータを運んでいるかが見えてきます。マーケティングリンクの監査、リダイレクト先の確認、OAuthプロバイダーがコールバックに実際に返しているものの確認などに便利です。
エンコードは逆の問題を解決します。テスト用リクエスト、ディープリンク、ドキュメントの例などでURLを手で組み立てるとき、値にスペース・アンパサンド・非英語のテキストが含まれていれば、その値を先にエンコードしておくことでそのまま保たれ、クエリ文字列が正しくパースされます。これを正しく行えるかどうかが、どこでも動くリンクと、誰かが共有した途端に壊れるリンクとの分かれ目です。
予約文字と、%20対プラス記号のクセ
どの文字が予約されていて、なぜそうなのかを知っておくと役立ちます。/ ? # [ ] @ ! $ & ' ( ) * + , ; = のような区切り文字はURL内で意味を持つので、これらをエンコードすると、構造として働くかデータとして働くかが変わります。値がこれらの文字を文字どおり含む必要があるときはエンコードし、構造としての役割を果たさせたいときはそのままにします。これが「URL全体ではなく値をエンコードする」ことの核心です。
もう一つの定番の落とし穴はスペースです。現代のパーセントエンコードは、URL内のどこでもスペースを%20と書きますが、多くのクエリ文字列やHTMLフォーム送信で今も使われる古いapplication/x-www-form-urlencodedの慣習では、+と書きます。どちらもスペースにデコードされます。予期しない+が見えたら、それはほぼ間違いなく壊れたリンクではなく従来のフォームエンコードを見ているのです。
次に使いたくなる関連ツール
デコードしたURLには、内側に入れ子になった別のエンコードが現れることがよくあります。クエリパラメータがBase64のかたまりを運んでいれば、Base64デコーダーで開けますし、JSON文字列であれば、JSON整形ツールがきれいに展開してくれます。こうした層を1つずつツールで解いていくのが、トラッキングや認証リンクが実際に何をしているのかを解きほぐす、よくあるやり方です。
より低レベルの好奇心には、バイナリ変換ツールがURL内の文字がどうバイトに対応するかを見せてくれますし、ハッシュ生成ツールは2つのリンクをフィンガープリント化して同一かどうかを確認できます。このURLエンコード・デコードと同じく、これらはすべてブラウザ内だけで動くので、機密性の高い文字列を、何もアップロードすることなくツール間で受け渡せます。
よくある質問
このURLエンコードツールは無料ですか？
はい、完全に無料です。アカウント・上限・透かしは一切ありません。好きなだけ使えます。
非公開ですか？URLにトークンが含まれます。
はい。エンコードもデコードもブラウザ内だけで動きます。貼ったURLは送信も保存もされないので、署名付きリンクやセッショントークンも端末内にとどまります。
スペースの%20と+の違いは何ですか？
%20はURLのどこでも使える標準的なスペースのパーセントエンコードです。+はクエリ文字列に特有の古い慣習（application/x-www-form-urlencoded）です。どちらもスペースを意味しますが、今は%20の方が安全です。
エンコードでURLが壊れたのはなぜ？
おそらくURL全体をエンコードしてしまい、構造を与える区切り（/・?・&・=）までエスケープされたためです。個々のパラメータの値だけをエンコードし、その断片から完全なURLを組み立ててください。
日本語などの非英語文字も扱えますか？
はい。ASCII外の文字はUTF-8のパーセント列としてエンコードされます。たとえば「café」はcaf%C3%A9になり、正しくデコードされます。アラビア語・中国語・絵文字も同様です。
スマホでも使えますか？
はい。iPhoneでもAndroidでも、どのモバイルブラウザでも動きます。怪しいエンコード済みリンクをタップする前に中身を確認するのに便利です。