URL エンコード・デコード
値を URL に埋め込める形にエスケープしたり、`%E6%97%A5` を読める文字に戻したりできます。URL 全体を貼り付ければ、ホスト・パス・復号済みのクエリパラメータに分解して表示します。
3 つのモードを使い分ける
component は予約文字をすべてエスケープする方式で、クエリの値 1 つを埋め込むときに使います。URI 全体は `:/?#[]@` を残すため、アドレス全体をそのまま使えます。フォーム形式は `application/x-www-form-urlencoded` に合わせ、スペースを `%20` ではなく `+` にします。HTML フォームの POST と同じ形です。
非 ASCII は UTF-8 としてエンコード
日本語・アクセント付きラテン文字・絵文字は UTF-8 のバイト列に変換してからパーセントエスケープします。現代のサーバーが期待する形式です。日本語 1 文字がおおむね 3 つの `%XX` になるのはこのためです。
エスケープだけでなく URL の中身も確認
アドレス全体を貼り付けると、プロトコル・ホスト・ポート・パス・フラグメントと、復号済みのクエリパラメータを一覧表示します。長いトラッキング URL や OAuth のリダイレクト先で、実際に何が渡されているかを確認する最短の方法です。
よくある質問
貼り付けた URL は送信されますか?
いいえ。貼り付けた内容がブラウザの外に出ることはありません。ページは小さな JavaScript を読み込むだけで、計算はすべて手元の端末で行われます。送信先のサーバーそのものが存在しません。 リダイレクト URL やコールバックのリンクにはトークンが含まれることが多いため、送信は行いません。
スペースは `+` と `%20` のどちらですか?
HTML フォームが送信するクエリ文字列では `+` が正しく、フォーム形式モードがこれを出力します。それ以外(パスの一部・ヘッダ・JSON の値)では `%20` が正しい形です。迷ったときは、クエリ文字列でも `%20` は受け付けられます。
「不正なエスケープ」でデコードに失敗します
`%` の後ろに 16 進数 2 桁が続いていない場合は不正です。二重エンコードされたものを途中までデコードした、あるいはパーセント記号そのものを `%25` にエスケープしていない、というのがよくある原因です。値を一度きちんとエンコードし直せば解決します。
二重エンコードとは何ですか?
すでにエンコードされた値をもう一度エンコードすることで、`%20` が `%2520` になります。2 か所のコードが同じ文字列をエスケープすると起こります。2 回デコードすれば確認できますが、対症療法ではなくエンコード処理のどちらかを取り除いてください。