url_encode、url_decode‥URLエンコード/デコードツール

エンコード、デコードしたい文字列を入れて実行してください。

エンコード/デコードしたい文字列
エンコード/デコードされた文字列
文字エンコーディング

URLエンコード、デコードについて

URLエンコード、とは、URLとして使用できない文字を扱う際に、利用可能な文字に変換(エンコード)する事を言います。パーセントエンコーディング、とも言います。

日本語を含むURLをコピーしてテキストエディターやなどに貼り付けた時に、日本語になっていない、という場合はよくあると思います。
例えば Wikipedia の記事ページURLなどがそうですね。これをURLエンコードされたもの、と呼びます。

そういったURLエンコードされた文字列をメールやSNS等で案内するときに、日本語で表現できないのは不便です。
そういう場合に、URLエンコードされた文字列をでコードすることで、日本語のままURLをコピーできるようになります。

例:
https://ja.wikipedia.org/wiki/Wikipedia:%E7%A7%80%E9%80%B8%E3%81%AA%E8%A8%98%E4%BA%8B
↓「デコードする」ボタンを押す
https://ja.wikipedia.org/wiki/Wikipedia:秀逸な記事

なぜURLをエンコード、デコードする必要があるのか?

URLで扱う事が出来る文字は限られます。それはURLというものが出来た時にそのように定められてしまったからです。
日本語文字などは対象外ですので、それらの文字をURL中に含める場合は、このようにURLをエンコードする必要があります。
エンコードされたURLを逆にデコードすると日本語になる、そのような変換が出来るツールです。

URLで使える文字は限られている

URLで利用可能な文字は、ASCIIコードで表現される文字のサブセットです。

さらに分けると、文字に意味がある「予約文字」(例:?はクエリーストリングを指します)、そして非予約文字と呼ばれる自由に使ってよい文字(アルファベットや数字、ハイフン、ピリオド、アンダーライン、チルド)、この2種類で構成されています。

漢字や予約文字を使いたい場合はどうする?

漢字や /:$#といった文字を自由にURLに書く事は出来ません。

そこで、URLをエンコードする、という事が必要なのです。

上のツールで、漢字や予約文字などを入れると全て「%2F」「%3A」のように、パーセント+16進数の数字、というものに変換されるのがわかると思います。

URLで表現できない文字を、%+文字コードで置き換えているのです。だからパーセントエンコーディング、とも呼ばれます。

このように文字の置き換え(エンコード)をして、URLとして扱うのです。

逆に、エンコードされたURLを本来の文字列に置き換えたい場合は、デコードという事をします。

これがよく行われている例は、GETメソッドでフォームで値を送信するときです。ブラウザー側で自動的にURLエンコードされ、サーバー側でURLデコードを行います。

漢字や予約文字はそもそも扱わない事をオススメします

漢字や記号が含まれたファイルにリンクしたい場合も、本来であれば、エンコードしたURLをHTML内に記載する必要があります。ブラウザー側でうまく処理して勝手にエンコードしてくれるので、あまり意識しない人も多いですが、何かしらの不具合を招く可能性も否定できません

具体的に起きうる問題は、文字コードが違う場合です。例えばこうです。

Windowsでファイル名をShiftJISコードで作りました。
日本語のファイル名のままウェブサーバー上にファイルを置きました。
(例)日本語.jpg→%93%FA%96%7B%8C%EA.jpg

HTML内に日本語ファイル名を記載しました。
HTMLの文字コードはUTF8です。
(例)日本語.jpg→%E6%97%A5%E6%9C%AC%E8%AA%9E.jpg

見た目は同じ日本語.jpgですが、文字コードが違いますからパーセントエンコードされた結果も違います。
結果、リンク先がない、という事になります。

なので、ファイル名を最初からアルファベットにしておく、ということをオススメします。

ファイル名が英数字で表現されていればURLエンコードそのものが不要で、全世界共通で利用できる文字ですから、誰も困りませんね。

ブラウザーが漢字が含まれるURLをどう扱うかの実験

ここまで書いて気になったので実験です。
サーバー上には、ShiftJISコードで作ったファイル「日本語.jpg」と、UTF8で作ったファイル「日本語.jpg」の2つを設置しています。
UTF8の日本語をURLエンコードした「日本語.jpg」
ShiftJISの日本語をURLエンコードした「日本語.jpg」

URLエンコードしない「日本語.jpg」(HTMLはUTF8)
予想通り、UTF8のファイルにリンクされました。

ShiftJISコードで書かれたHTMLでの挙動についても調べてみました。
以下のリンクをたどり、ShiftJISで書かれたページにアクセスして挙動を確認してください。
ShiftJISコードで書いたHTML内に、エンコードしない「日本語.jpg」リンクを書いたページ

予想に反しました。
リンクの文字コードがShiftJISでも、ブラウザー上ではUTF8として扱われるのですね。

関連リンク

技術情報/ツールのご紹介(サービス一覧)

株式会社エン・PCサービスで開発したツール類や技術情報のご紹介。ウェブ開発を行う中で頻繁に使うものをツール化し、情報整理したものをまとめました。開発事業者様の補助ツールとしてご利用下さい。

サブスク型IT相談役サービスのご紹介

ITについてなんでも相談に乗ってしまおう、というサービスを始めました。社内エンジニアの育成や情報システムの適切な管理の仕方、など。なんでもご相談ください。

Reverse-Proxy先をWordPressに‥

Reverse-ProxyとWordPressでオウンドンメディアだけ別サーバーで動かす、という話です。実際に構築してハマった事とその解決方法をご紹介しています。

開発プロセスとは何?開発にあたり知っておく事とは

スクラッチ開発で、発注者と業者、それぞれが気を付けなければいけない事をお伝えしていき、いかにして開発を成功させるかを開発プロセスという観点からご紹介しています。