URLエンコード
テキストをパーセントエンコードして、URLの中で安全に使えるようにします。すべてブラウザ内で動作します。
すべてブラウザ内で動作します。アップロード、記録、保存は一切行いません。
URLには文法があり、その一部である文字（"?"、"&"、"/"、"#"、スペース）は、構造ではなく値の一部として使うときにエスケープする必要があります。このエスケープがパーセントエンコードです。
仕組み
RFC 3986の非予約文字（英字、数字、"-"、"."、"_"、"~"）以外の文字はすべて、UTF-8の各バイトを%記号と16進値に置き換えます。スペースは%20になり、アクセント付きの文字はUTF-8で2バイトなので2つのエスケープに、ひらがなや漢字は3バイトなので3つのエスケープになります。
フォームデータ方式があるのは、HTMLフォームの送信がこの規則より古いためです。そこではスペースは"+"になり、"~"もエスケープされます。application/x-www-form-urlencodedの本文を組み立てるときはこちらを、それ以外はすべてコンポーネント方式を選んでください。
例
| ケース | 入力 | 結果 |
|---|---|---|
| クエリ文字列に入れる検索フレーズ | coffee & cake | coffee%20%26%20cake |
| 同じフレーズをフォームデータとして | coffee & cake | coffee+%26+cake |
よくある質問
URL全体をこれでエンコードすべきですか？
いいえ。URL全体をエンコードすると"://"や区切り文字までエスケープされ、どのクライアントもたどれない文字列になります。値を個別にエンコードしてから、それらでURLを組み立ててください。
ここでは"!"がエンコードされるのに、ブラウザのコンソールではそのままなのはなぜですか？
JavaScriptのencodeURIComponentは、RFC 3986で予約されているにもかかわらず、"!"、"'"、"("、")"、"*"を意図的にエンコードしません。これらをエンコードしても常に受け入れられ、より厳格なパーサーで思わぬ問題が起きるのを防げるので、このツールはエンコードします。
フラグメントの"#"はどうなりますか？
値の中の"#"そのものは%23としてエンコードする必要があります。そうしないと、それ以降がすべてフラグメントとして読まれ、サーバーには届きません。
知っておきたいこと
- すべてブラウザ内で処理されます。貼り付けた内容はアップロードも記録も保存もされません。