日本語を使ったURLが、日本語が表示されずに%をふくむ文字化けのような記号列として表示されるのをよく見かけますよね。
これは、決してブラウザやアプリの不具合ではなく、URLエンコードというコード変換を施した結果を表示しているからなのです。
今回はこのURLのエンコード・デコードについて、その概要や留意事項をわかりやすく説明します。
ホームページの作成・管理やシステム開発の参考にぜひ読んでみてください。
目次
URLとは？
WebやSNSで当たり前のように利用しているURLですが、URLとはどのようなものかを、以下で整理しておきます。
URLの定義
インターネット上の情報を、スマホやタブレット、パソコンなどいろんな機器で手軽に検索して内容を閲覧することができます。
これは手元の機器（WEBクライアント）からインターネット上のWEBサーバにリクエストを出し、WEBサーバに格納されてる情報（WEBコンテンツ）を送信してもらうからです。
では、WEBコンテンツを指定するにはどうすればよいのでしょう？
その仕掛けとして、URL、URN、URIというものが規定されています。
URLは「Uniform Resource Locator」の略称で、インターネット上に存在する文書や画像などのWEBコンテンツのありかを示す技術方式。いわば、WEBコンテンツの住所（アドレス）のようなものですね。
URNは「Uniform Resource Name」の略称です。Nameは名前という意味ですが、URNはどちらかというと固有の識別番号のイメージ。利用者が意識することはほとんどなく、WEBシステムが利用するための番号です。
URIは、「Uniform Resource Identifier」の略称で、URIとURNを総称するもの。
いろいろありますが、WEBのユーザーはURLを使ってWEBコンテンツにアクセスしていると考えてよいでしょう。
URLを記述するための構文
URL（URI）の構文は以下のとおりです。
<プロトコル>://<ドメイン>：<ポート番号>/<パス>?＜パラメータ＞#＜アンカー＞
具体的な例を以下に示します。
|
1 |
foo://example.com:8042/over/there?name=ferret#nose |
構成要素の説明を以下に示します。
| 構成要素 | 説明 |
| プロトコル | インターネットでデータのやり取りや転送を行なうための設定方法を示す。 「http」が一般的であり、「https」は通信のセキュリティ確保のため暗号化した通信を行なうもの。 |
| ドメイン名 | IPアドレスを分かりやすくするために設定する文字列 |
| ポート | WEBサーバ上のリソースにアクセスするための「ゲート」を表す番号 標準（HTTPは80、HTTPSは443）なら省略可能 |
| パス | WEBサーバ上でのリソースのパス |
| パラメータ | 追加の引数で、以下の形式で指定する。（省略可能） ？<キー1>=<値1>&<キー2>=<値2>… |
| アンカー | リソース内のいわばブックマーク（省略可能） ＃で始まる文字列でフラグメント識別子とも呼ばれる。 |
なぜURLエンコード・デコードは必要？
ユーザーが記述したURLがWEBクライアントからWEBサーバに送られるときはURLエンコードという変換操作が行なわれます。以下ではURLエンコード・デコードが必要な理由を説明します。
URL（URI）には特別な役割を持つ制御文字が決められている。
URLの構文においては、特別な役割を持つ文字（予約文字）があり、この文字を予約文字以外の用途で使いたいときは「%」の後に2桁の16進数で表わします。例えば、「/」は、UTF-8を使用していれば「%2F」と表します。
このため、URLエンコーディングは、パーセントエンコーディング（ percent encoding）と呼ばれることもあります。
予約文字の例
| 予約文字 | ! | # | $ | & | ‘ | ( | ) | * | + | , |
| unicode | 0021 | 0023 | 0024 | 0026 | 0027 | 0028 | 0029 | 002A | 002B | 002C |
| 予約文字 | / | : | ; | = | ? | @ | [ | ] |
| unicode | 002F | 003A | 003B | 003D | 003F | 0040 | 005B | 005D |
なお、「~」や「.」は予約文字になっていませんが、予約文字に準じる扱いとした方が無難です。
URLをいろんな言語で使えるようにする
インターネットは世界中の人が利用しているため、いろんな言語で利用できるように、コンピュータで扱う文字コードもいろんな種類が規定されています。
代表的な文字コードには以下のものがあります。
| 文字コード | 説明 |
| ASCIIコード | アメリカ規格協会（ANSI）が制定した文字コード アルファベット、数字、記号、空白、制御文字など128文字を規定 |
| JISコード | 平仮名、片仮名、漢字などの日本語を定義 |
| Shift-JISコード | Microsoft社により定められたコードでWindowsで使用 全ての文字を２バイトで扱い、表示文字数とバイト数が一致する |
| EUC | UNIX上で漢字、中国語、韓国語などを扱うことができる |
| unicode | アルファベット、漢字、カナ、アラビア文字など世界中の文字を表現 JavaやXMLが基本コードとして採用、符号化方式はUTF-8が多い |
URLは元々英語での利用を想定されているためASCIIコードをベースとしており、漢字などは使用することができないのです。
このため、ASCIIコード表で定義されていない文字はパーセントエンコーディングすることとされています。
WEBやプログラムでURLエンコード・デコードする際の注意点
HTTPでの処理
WEBクライアントからWEBサーバにHTTPでHTMLファイルなどを送ってもらうよう要求する場合には、GETメソッドやPOSTメソッドを使います。
POSTメソッドでは「application/x-www-form-URLencoded」によりURLをエンコードします。
この場合は、以下の点に留意が必要です。
- 半角スペースを「%20」ではなく「+」で表わす。
Javaでの処理
JavaでURLをエンコード・デコードする方法としては、
- java.net.URLEncoder / URLDecoder Java標準
- Apache Commons Codec の URLCodec クラス
があります。
これらのJava 言語でのURLエンコード処理では、以下の点に留意が必要です。
- 「*」「-」「_」の3つの記号が変換されません。
- 半角スペースは「%20」ではなく「+」に置き換わります。
JavaScriptでの処理
JavaScriptでは、エンコード・デコードに使える関数として以下のものがあります。
| encodeURI | 入力された文字列内の予約文字はエンコードしない |
| decodeURI | 入力された文字列内の予約文字はデコードしない |
| encodeURIComponent | 入力された文字列内の予約文字もエンコードする |
| decodeURIComponent | 入力された文字列内の予約文字もデコードする |
以下に使用例を示します。
<プログラム>
|
1 2 3 4 5 6 7 8 9 10 11 12 |
<html> <body> <script type="text/javascript"> var url = "httrps://example.com/例題 1.html"; var res1 = encodeURI(url); var res2 = encodeURIComponent(url); document.write("入力："+url+"<br>"); document.write("encodeURIの結果：<BR> "+res1+"<br>"); document.write("encodeURIComponentの結果：<BR> "+res2+"<br>"); </script> </body> </html> |
<実行結果>
|
1 2 3 4 5 |
入力：httrps://example.com/例題 1.html encodeURIの結果： httrps://example.com/%E4%BE%8B%E9%A1%8C%201.html encodeURIComponentの結果： httrps%3A%2F%2Fexample.com%2F%E4%BE%8B%E9%A1%8C%201.html |
encodeURIComponent関数では、「:」や「/」もエンコードしていることがわかりますね。
なお、上記の関数では、以下の点に留意が必要です。
- 半角スペースを「%20」と変換する。
まとめ
いかがでしたか？今回は、URLエンコード・デコードについて説明しました。
ユーザーとしてWebで検索したり、ファイル転送を行なったりしている場合はあまり気にしなかったことですが、Webサイトの管理を始めたり、WEBプログラミングを始めると問題になる場合があります。
この記事が、Webサイト管理やプログラミング言語の学習などのお役に立てば幸いです。
