URLエンコード・デコードツール

① このツールの使い方

• •1. 変換方向を選ぶ：「エンコード」（テキスト→%記号の形式）か「デコード」（%記号の形式→テキスト）かを切り替えます。
• •2. テキストを入力する：入力するとリアルタイムで下の結果欄に変換結果が表示されます。
• •3. コピーする：結果欄のコピーボタンでそのままクリップボードにコピーできます。

たとえば「東京 天気」というキーワードをエンコードすると、%E6%9D%B1%E4%BA%AC%20%E5%A4%A9%E6%B0%97という文字列になります。この形式であれば、日本語や空白を含んでいてもURLの一部として安全に送れます。

② URLエンコードとは何か

URL（Webアドレス）は、本来半角英数字と一部の記号だけで構成することを前提にした仕組みです。日本語や「&」「=」「?」のようにURLの構造そのものに使われている記号を、そのままURLに含めることはできません。URLエンコード（パーセントエンコーディング）は、これらの文字を「%」＋16進数2桁という安全な形式に変換する方式です。

日本語のようなマルチバイト文字は、まずUTF-8のバイト列に変換されたうえで、各バイトが「%XX」という形式で表現されます。「あ」という1文字は3バイトのデータになるため、エンコード後は%E3%81%82という3組の「%XX」に変換されます。

③ どんな場面で使われるか

④ スペースの扱いに注意

このツールではencodeURIComponentという関数を使っており、半角スペースは%20に変換されます。一方で、HTMLフォームを送信するときの標準的な形式（application/x-www-form-urlencoded）では、スペースが「+」に変換されるという別のルールが使われることがあります。どちらの形式で送られてきたデータかによって、スペースの表現が変わりうる点は覚えておくと混乱しにくくなります。

⑤ デコードでエラーが出るとき

「デコードに失敗しました」と表示される場合は、「%」の後ろに正しい16進数2桁が続いていない、あるいはエンコードされた文字列が途中で切れていないかを確認してください。URLをコピーする際に一部が欠けてしまっていることがよくある原因です。

⑥ encodeURIとencodeURIComponentの違い

JavaScriptには似た名前の関数が2つあり、混同されがちです。encodeURIComponentは、クエリパラメータの値（キーワードなど）をエンコードするための関数で、「&」「=」「?」「/」「:」といったURLの構造そのものに使われる記号もすべて変換します。一方encodeURIは、URL全体をエンコードするための関数で、こうした構造上の記号は「壊してはいけないもの」としてそのまま残します。このツールはencodeURIComponentと同じ挙動のため、クエリパラメータの値だけをエンコードしたい場合に向いています。URL全体をコピーしてそのままエンコードすると、「https://」の「//」まで変換されてリンクとして機能しなくなってしまうので注意してください。

HTMLのタグそのものを安全に表示したい場合はHTMLエスケープツールをお使いください。URLエンコードとは変換対象・目的が異なる、似て非なる処理です。

⑦ クエリパラメータを組み立てるときの注意点

複数のパラメータを含むURLを自分で組み立てる場合、キーと値のペアごとにエンコードしてから「&」でつなぐのが基本の手順です。たとえば検索キーワード「東京 天気」とページ番号「1」を渡したい場合、まず「東京 天気」だけをエンコードして%E6%9D%B1%E4%BA%AC%20%E5%A4%A9%E6%B0%97にし、それを?q=…&page=1という構造に組み込みます。「&」や「=」といった構造上の記号までエンコードしてしまうと、パラメータの区切りが認識されなくなり正しく動作しません。このツールはあくまで1つの値を変換する用途なので、複数パラメータを組み立てる際は、値ごとに変換した結果を手動で「&」「=」を使ってつなぎ合わせる必要があります。

⑧ 二重エンコードに注意

すでにエンコードされた文字列を、気づかずもう一度エンコードしてしまう「二重エンコード」もよくあるトラブルです。たとえば「%20」（スペース）をさらにエンコードすると「%2520」という形になり、正しくデコードできなくなります。他のツールやプログラムからコピーしてきたURLを扱うときは、それがすでにエンコード済みかどうかをまず確認し、済んでいるものにはこのツールでの再エンコードをかけないよう注意してください。逆に「デコードしてもエラーにならないが、意味の通らない文字列になる」場合は、二重エンコードが疑わしいサインです。このツールでデコードを2回試してみて、1回目で正しい文字列に戻れば単純なエンコード済みデータ、2回デコードしないと元に戻らない場合は二重エンコードが起きていたと判断できます。原因となっている箇所（プログラムの二重処理か、コピー元がすでにエンコード済みだったか）を特定すれば、再発防止にもつながります。慣れないうちは、変換結果を都度目視で確認する習慣をつけておくと安心です。