URL のエンコード・デコード・解析
URL 用にテキストをパーセントエンコード／デコードしたり、URL をスキーム・ホスト・パス・クエリに分解してクエリを表として編集したりできます。
コード例
自分のプロジェクトにコピーして使えます。どの例も言語の標準ライブラリだけを使うので、インストールするものはありません。
const text = 'name=Zoë & co'
console.log(encodeURIComponent(text))できること
URL で使うテキストをパーセントエンコード／デコードし、URL をスキーム・ホスト・ポート・パス・クエリ・フラグメントに分解します。クエリは名前と値の表として編集でき、変更に合わせて URL が組み立て直されます。
使い方
- 1行に1項目でテキストまたは URL を入力または貼り付けるか、テキストファイルをドロップします。
- モードを選びます。エンコードは単一の値で安全でないものをすべてエスケープし、URL をエンコードは URL の構造を保って含められないものだけをエスケープし、デコードはパーセントエンコードを読み、解析は URL を各部分に分けます。
- 解析モードでは、クエリの表でパラメータを変更・追加・削除し、組み立て直された URL を入力欄からコピーします。
例
値のエンコード：
name=Zoë & co は name%3DZo%C3%AB%20%26%20co になります。URL https://example.com/zoek?q=kaas en brood は URL をエンコードで https://example.com/zoek?q=kaas%20en%20brood になります。
知っておくと便利なこと
- スペースは
%20と書きます。URL のクエリでは+もスペースを意味し、クエリの表はそう読みます。 - ASCII 以外の文字は UTF-8 バイトとしてエンコードされます。
éは%C3%A9になります。 - 解析は失敗しません。
/a/b?x=1のような相対参照はスキームやホストがないだけです。 - 16進数2桁が続かない
%や、有効な UTF-8 でないエスケープではデコードに失敗し、その行はスキップされます。
パーセントエンコードとは？
URL に含められるのは限られた安全な文字だけです。値の中のスペース、アクセント、アンパサンドなどそれ以外は、% と各バイトの16進数2桁で書きます。スペースは %20、é は %C3%A9 になります。デコードはその逆です。
よくある質問
「エンコード」と「URL をエンコード」の違いは？
「エンコード」は文字・数字・- . _ ~ 以外をすべてエスケープするので、クエリパラメータのような単一の値に向いています。「URL をエンコード」は : / ? # & = など URL の構造を成す文字を残し、スペースやアクセントなど含められない文字だけをエスケープします。
クエリの表でプラス記号がスペースになるのはなぜですか？
URL のクエリ部分では + はスペースを表します。HTML フォームからの慣習です。表はそのように読み、スペースはどのパーサーでも受け付けられる %20 として書き戻します。
このツールは URL をどこかに送信しますか？
いいえ。すべてブラウザ内で行われます。入力した内容が当社のサーバーに送信されることはありません。