URLエンコード・クエリ分解

URLエンコード（encodeURIComponent / encodeURI）・デコードと、URLのクエリパラメータ（?key=value）を表形式で抽出・編集・再生成できるツールです。すべての処理はブラウザ内で完結します。

encodeURIComponentはクエリパラメータの値など単一の文字列全体を、encodeURIはURL全体（:/?#などの予約文字は保持）をエンコードする際に適しています。

入力テキスト

結果

使い方

「エンコード/デコード」タブでは、テキストを入力し、encodeURIComponent（値のエンコードに最適）またはencodeURI（URL全体のエンコードに最適）を選んで変換します。
「クエリパラメータ分解」タブでは、URLを入力して「分解する」を押すと、ベースURLとクエリパラメータが自動で抽出されます。
抽出されたパラメータはキー・値を直接編集したり、「パラメータを追加」で新規追加、×ボタンで削除したりできます。
編集内容は「再生成されたURL」欄にリアルタイムで反映されるので、「クリップボードへコピー」でそのまま利用できます。

このツールについて

URLエンコード・クエリパラメータ分解ツールは、URLに含まれる日本語や記号のエンコード・デコードと、クエリパラメータの内容確認・編集をブラウザ内で行えるツールです。APIのリクエストURLを組み立てる際や、長いURLに含まれるパラメータの意味を調べたいときに役立ちます。

encodeURIComponentとencodeURIは、エンコード対象とする文字の範囲が異なります。encodeURIComponentはクエリパラメータの値など文字列全体を丸ごとエンコードしたい場合に、encodeURIは「:」「/」「?」「#」などURLの構造を表す記号を保持したままURL全体をエンコードしたい場合に使用します。

クエリパラメータ分解機能では、URLSearchParamsを利用して「?key1=value1&key2=value2」の形式を表形式に変換し、キーや値の追加・編集・削除を行った結果を即座に新しいURLとして再生成します。

「a b+c」をencodeURIComponentでエンコードすると「a%20b%2Bc」になります。一方、クエリ分解に「https://example.com/?q=a+b」を入れると、qの値は「a b」です。生のプラス記号と空白の扱いを比較できます。

クエリの再生成はURLSearchParamsを使うため、値の空白は「+」、本来のプラス記号は「%2B」として出力されます。パラメータ値が同じでも元のURLと文字表現が変わる場合があるので、URL文字列そのものを照合する用途では確認してください。

よくある質問

encodeURIComponentとencodeURIはどちらを使えばいいですか？

クエリパラメータの値など、URLの一部として埋め込む単一の文字列をエンコードする場合はencodeURIComponentを使用してください。すでに完成しているURL全体をエンコードしたい場合はencodeURIを使うと、URLの構造を表す記号（:/?#など）がエンコードされずに保持されます。

同じキーが複数あるクエリパラメータは扱えますか？

扱えます。例えば「tag=a&tag=b」のように同じキーが複数存在する場合も、それぞれ別の行として表示・編集できます。

ハッシュ（#以降のフラグメント）はどうなりますか？

ハッシュ部分はクエリパラメータとは区別して保持され、URLを再生成する際に末尾にそのまま付加されます。

入力したURLはサーバーに送信されますか？

送信されません。URLの分解・編集・再生成、エンコード・デコードのすべての処理はブラウザ内のJavaScriptで完結します。