URL エンコード

関連おすすめ

ユースケース

• APIパラメータデバッグ：encodeURIComponent と encodeURI の出力差を比較し、インターフェースの署名不一致の問題をトラブルシューティング
• ログデコード：ログ内のURLエンコードされた内容を一括デコードし、可読テキストに復元
• URL構築：Query Only モードでキー名を保持したまま値のみをエンコード、手動連結によるフォーマットエラーを回避
• フロントエンド開発：エンコードハイライトでどの文字がエスケープされるかを理解しやすく、ページ遷移やリダイレクトのデバッグに役立つ
• データ移行：旧システムからエクスポートされたURLエンコードデータを一括処理し、新しいフォーマットに変換

特徴

• 4つのエンコードモード：encodeURIComponent / encodeURI / full / RFC 3986 をワンクリックで切り替え、各ルールの出力差をリアルタイムで比較
• エンコードハイライト：エスケープされた %XX 文字をリアルタイムでハイライト表示、琥珀色でマークしてエンコード結果を一目で確認
• バッチモード：複数行の一括エンコード・デコードに対応、各行を独立して処理。ログや一括データの処理に最適
• Query Only モード：URLパラメータの値部分（等号の後）のみをエンコードし、キー名や記号、パス構造はそのまま保持
• リアルタイムデバウンス：300msで自動エンコード・デコード、ボタンをクリックする必要なく、入力するだけで結果が表示
• 文字数カウント：入力文字数をリアルタイムで表示、APIパラメータの長さ制限の確認に便利

使い方

1. エンコード・デコードしたいURLまたはテキストを入力または貼り付け
2. エンコード方向（エンコード/デコード）とエンコードモード（Component / URI / full / RFC 3986）を選択
3. 複数行データを処理する場合はバッチモードを有効に、パラメータ値のみをエンコードする場合は Query Only を有効に
4. ハイライトされた結果を確認し、エンコード後の文字列をコピーしてAPIリクエストやURL構築に使用

よくある質問

URL エンコードとは何ですか？

术语表

パーセントエンコーディング（Percent-encoding）

URL エンコードの正式名称。% に続く2桁の16進数で文字を表現するエンコード方式。例えばスペースは %20、中国語の「中」は %E4%B8%AD にエンコードされます。Wikipedia - パーセントエンコーディング

encodeURIComponent

JavaScript 組み込み関数。A-Z a-z 0-9 - _ . ! ~ * ' ( ) 以外のすべての文字をエンコードします。URL クエリパラメータの個々の値をエンコードする際に最もよく使用されます。

encodeURI

JavaScript 組み込み関数。URL の構造文字（: / ? # [ ] @ ! $ & ' ( ) * + , ; =）を保持し、本当にエンコードが必要な文字のみをエンコードします。URL 全体をエンコードする際に使用します。

RFC 3986

URI 汎用構文に関する最新の IETF 標準（2005年）。URL エンコードのルールを定義しており、チルダ ~ を非予約文字（エンコード不要）として分類しています。古い RFC 2396 および RFC 1738 に代わるものです。RFC 3986

予約文字（Reserved Characters）

URL 内で特殊な意味を持つ文字（: / ? # [ ] @ ! $ & ' ( ) * + , ; = など）。これらの文字はデータとして使用する場合はエンコードする必要がありますが、構造的な位置ではエンコードすべきではありません。

非予約文字（Unreserved Characters）

URL 内のどの位置でもエンコードせずに使用できる安全な文字。A-Z、a-z、0-9、-、_、.、~（RFC 3986による）が含まれます。

クエリ文字列（Query String）

URL の ? 以降の部分。key=value のペアで構成され、& で区切られます。例えば ?name=張三&age=20 では、name=張三 と age=20 が2つのパラメータです。

URLSearchParams

モダンブラウザが提供する API。URL クエリ文字列を簡単に構築・解析でき、エンコードとデコードを自動的に処理します。文字列を手動で連結するよりも安全で信頼性があります。

application/x-www-form-urlencoded

HTML フォームのデフォルトの送信形式。スペースが %20 ではなく + にエンコードされる点が encodeURIComponent と異なります。サーバーサイドのフレームワークは通常どちらの形式も自動的に処理します。

UTF-8 エンコード

Web 標準の文字エンコーディング。URL エンコードでは、非 ASCII 文字（中国語、絵文字など）をまず UTF-8 のバイトシーケンスに変換し、各バイトを %XX 形式にエンコードします。

4つのエンコードモードによる文字エスケープ比較

よく使われるURL予約文字クイックリファレンス

Code Examples

// encodeURIComponent：個々のパラメータ値をエンコード（最も一般的）
const param = encodeURIComponent('張三&李四');
console.log(param); // %E5%BC%A0%E4%B8%89%26%E6%9D%8E%E5%9B%9B

// encodeURI：URL全体をエンコード（:/?#&= などの構造文字を保持）
const url = encodeURI('https://example.com/search?q=こんにちは 世界');
console.log(url);

// デコード
const decoded = decodeURIComponent(param);
console.log(decoded); // 張三&李四

// RFC 3986 互換（~ はエンコードしない）
function rfc3986Encode(str) {
  return encodeURIComponent(str).replace(/[!'()*]/g, c => '%' + c.charCodeAt(0).toString(16).toUpperCase());
}

// URLSearchParams API（モダンな方法、自動でエンコード処理）
const params = new URLSearchParams({ name: '張三', city: '北京' });
console.log(params.toString());
// name=%E5%BC%A0%E4%B8%89&city=%E5%8C%97%E4%BA%AC

from urllib.parse import quote, unquote, urlencode, quote_plus

# quote: encodeURIComponent に類似
encoded = quote('張三&李四')
print(encoded)  # %E5%BC%A0%E4%B8%89%26%E6%9D%8E%E5%9B%9B

# RFC 3986 モード（~ はエンコードしない、デフォルト）
print(quote('hello~world'))  # hello~world

# quote_plus: 空白を + としてエンコード（フォーム形式）
print(quote_plus('hello world'))  # hello+world

# デコード
print(unquote(encoded))  # 張三&李四

# urlencode: クエリ文字列を構築
params = urlencode({'name': '張三', 'city': '北京'})
print(params)
# name=%E5%BC%A0%E4%B8%89&city=%E5%8C%97%E4%BA%AC

import java.net.URLEncoder;
import java.net.URLDecoder;
import java.net.URI;
import java.nio.charset.StandardCharsets;

public class URLEncodeExample {
    public static void main(String[] args) throws Exception {
        // URLエンコード（URLEncoder はフォーム形式、空白は+になる）
        String encoded = URLEncoder.encode("張三&李四", "UTF-8");
        System.out.println(encoded);
        // %E5%BC%A0%E4%B8%89%26%E6%9D%8E%E5%9B%9B

        // デコード
        String decoded = URLDecoder.decode(encoded, "UTF-8");
        System.out.println(decoded); // 張三&李四

        // URL全体を構築（URIクラスが自動でエンコード処理）
        URI uri = new URI("https", "example.com", "/search", "q=こんにちは世界", null);
        System.out.println(uri.toASCIIString());
    }
}

Authoritative References

• ReferenceRFC 3986 - Uniform Resource Identifier (URI): Generic Syntax
• ReferenceRFC 1738 - Uniform Resource Locators (URL)
• ReferenceMDN Web Docs - encodeURIComponent()
• ReferenceMDN Web Docs - encodeURI()
• ReferenceWikipedia - パーセントエンコーディング