URLエンコーディングガイド：URLをエンコードする理由と方法

URLのスペースが %20 に、アンパサンドが %26 になるのはなぜでしょうか？URLエンコーディング（パーセントエンコーディングとも呼ばれる）は、URLとして安全でない文字をWebサーバーが理解できる形式に変換します。

URLエンコーディングが重要な理由

URLには限られたASCII文字のセットのみを含めることができます。特殊文字、スペース、非ASCII文字は安全に送信するためにエンコードが必要です。エンコードなしでは、URLは予測不能な形で壊れます — スペースがURLを途中で切断したり、アンパサンドがパラメータの区切り文字と間違われたりする可能性があります。

当サイトのURLエンコーダー/デコーダーで、任意のテキストがURLエンコードされたときにどう変換されるか確認できます。

どの文字にエンコードが必要か？

安全な文字（エンコード不要）

英字 (A-Z, a-z)、数字 (0-9)、およびこれらの記号：-、_、.、~

予約文字（データとして使用する場合はエンコード）

文字	エンコード後	URLでの用途
`:`	`%3A`	スキーム区切り
`/`	`%2F`	パス区切り
`?`	`%3F`	クエリ文字列の開始
`#`	`%23`	フラグメント識別子
`&`	`%26`	パラメータ区切り
`=`	`%3D`	キーと値の区切り
`+`	`%2B`	スペースを表すことが多い
`@`	`%40`	ユーザー情報の区切り
`%`	`%25`	エンコーディング表示子

常にエンコードが必要

スペース（%20）、非ASCII文字（UTF-8バイトをエンコード）、および安全なセット以外のすべての文字。

URLエンコーディングの実践

クエリパラメータ

最も一般的なユースケースです。検索URLやAPIリクエストを構築する場合：

https://api.example.com/search?q=hello%20world&lang=en

フォームデータ

method="GET" のHTMLフォームはフィールド値を自動的にURLエンコードします。フォームエンコーディングでは、スペースは + になります（パーセントエンコーディングとは若干異なります）。

パスセグメント

URLパス内のファイル名やリソース識別子もエンコードが必要です。my report.pdf というファイル名はURLでは my%20report.pdf になります。

各言語でのエンコーディング

JavaScript:

encodeURIComponent('hello world & more')
// "hello%20world%20%26%20more"

decodeURIComponent('hello%20world')
// "hello world"

Python:

from urllib.parse import quote, unquote
quote('hello world & more')
# 'hello%20world%20%26%20more'

よくある間違い

二重エンコード — すでにエンコード済みのURLをエンコードすると、%20 が %2520 になります
encodeURIComponent の代わりに encodeURI を使用 — encodeURI はクエリ値で重要な予約文字をスキップします
+ 記号のエンコード漏れ — URLでは + はスペースを意味することがあります。リテラルのプラス記号は %2B としてエンコードしましょう
非ASCIIの考慮漏れ — Unicode文字はまずUTF-8エンコードが必要で、その後パーセントエンコーディングを行います

よくある質問

encodeURIとencodeURIComponentの違いは何ですか？

encodeURI は完全なURLをエンコードし、:、/、?、# などの文字をスキップします。encodeURIComponent は非予約文字以外のすべてをエンコードします — 個々のクエリパラメータの値にはこちらを使用してください。

スペースが + になる場合と %20 になる場合があるのはなぜですか？

フォームエンコーディング（application/x-www-form-urlencoded）はスペースに + を使用します。標準のパーセントエンコーディングは %20 を使用します。どちらも異なるコンテキストで有効です。