解説
「パーセントエンコーディング」は、URLやURIで使えない文字を、特殊な書き方で表現する変換規則です。パーセントエンコーディングは、「URLエンコーディング」と呼ばれることもあります。
URLの中では、「:」「/」「?」「&」「=」「#」などの文字は、「予約文字」と呼ばれています。これらの記号には、URLの構造を表す意味があり、それらを通常の文字列の場所で用いると、URLとして、正しい場所を指し示せなくなります。
また、URLの中で自由に使える文字は、非予約文字と呼ばれています。これらは、「A-Z a-z」の英字、「0-9」の数字、「-」ハイフン、「.」ドット、「_」アンダースコアといった文字です。日本語のような2バイト以上の文字は使えません。
そのため、使えない文字は、他の方法で表現しなければなりません。
「パーセントエンコーディング」では、こうした文字を、%記号を使った記法で回避して書きます。以下では、「情報?」という文字列を、日本語部分はUTF-8の文字コード、?の部分はASCIIコードの16進数で表してエンコード(符号化)しています。
| エンコード | 字 | 文字コード |
|---|---|---|
| %E6%83%85 | 情 | E68385 |
| %E5%A0%B1 | 報 | E5A0B1 |
| %3F | ? | 3F |
Webのクライアントやサーバーで使うプログラミング言語では、このようなパーセントエンコーディングを行うための、エンコード関数、デコード関数が用意されていることが多いです。
サンプル
JavaScriptでパーセントエンコーディングを行う(エンコード、デコードを行う)関数を使い、その処理をJavaScriptで簡単に書いてみます。
ファイルはUTF-8で保存して、実行はGoogle Chromeで行なっています。
<html>
<head>
<title>「パーセントエンコーディング」のサンプル</title>
<meta charset="utf-8">
</head>
<body>
<pre><script type="text/javascript">
// encodeURI / decodeURI
var srcTxt1 = 'URLは http://hoge.jp/?q=検索&lng=ja';
var encTxt1 = encodeURI(srcTxt1);
var decTxt1 = decodeURI(encTxt1);
document.writeln('■encodeURI / decodeURI');
document.writeln('; , / ? : @ & = + $ 英数字 - _ . ! ~ * \' ( ) #'
+ ' を除く文字を置き換える。');
document.writeln('srcTxt1 = ' + srcTxt1);
document.writeln('encTxt1 = ' + encTxt1);
document.writeln('decTxt1 = ' + decTxt1);
document.writeln('※ &や=が置き換えられないので検索クエリには使えない。');
document.writeln('');
// encodeURIComponent() / decodeURIComponent()
var srcTxt2 = 'URLは http://hoge.jp/?q=検索&lng=ja';
var encTxt2 = encodeURIComponent(srcTxt2);
var decTxt2 = decodeURIComponent(encTxt2);
document.writeln('■encodeURIComponent / decodeURIComponent');
document.writeln('英数字 - _ . ! ~ * \' ( )'
+ ' を除く文字を置き換える。');
document.writeln('srcTxt1 = ' + srcTxt2);
document.writeln('encTxt1 = ' + encTxt2);
document.writeln('decTxt1 = ' + decTxt2);
document.writeln('※ &や=が置き換えられないので検索クエリに使える。');
</script></pre>
</body>
</html>
■encodeURI / decodeURI ; , / ? : @ & = + $ 英数字 - _ . ! ~ * ' ( ) # を除く文字を置き換える。 srcTxt1 = URLは http://hoge.jp/?q=検索&lng=ja encTxt1 = URL%E3%81%AF%20http://hoge.jp/?q=%E6%A4%9C%E7%B4%A2&lng=ja decTxt1 = URLは http://hoge.jp/?q=検索&lng=ja ※ &や=が置き換えられないので検索クエリには使えない。 ■encodeURIComponent / decodeURIComponent 英数字 - _ . ! ~ * ' ( ) を除く文字を置き換える。 srcTxt1 = URLは http://hoge.jp/?q=検索&lng=ja encTxt1 = URL%E3%81%AF%20http%3A%2F%2Fhoge.jp%2F%3Fq%3D%E6%A4%9C%E7%B4%A2%26lng%3Dja decTxt1 = URLは http://hoge.jp/?q=検索&lng=ja ※ &や=が置き換えられないので検索クエリに使える。
