encodeURIComponent

 

概要

特定の文字の実体を、UTF-8 文字エンコーディングで表された 1 つ、2 つ、あるいは、3 つのエスケープシーケンスに置き換えることで、統一資源識別子 (Uniform Resource Identifier (URI)) の要素をエンコードします。

コア・グローバル・メソッド
実装されたバージョン JavaScript ?
ECMAScript エディション ECMAScript ?

構文

var encoded = encodeURIComponent(str);

引数

str
URI の要素

説明

encodeURIComponent は、次を除く全ての文字をエスケープします。: アルファベット、数字、- _ . ! ~ * ' ( )

ユーザ入力パラメータを、URI の一部としてサーバに渡す場合には【訳注: GETメソッド】、サーバに想定外のリクエストが渡らないように、encodeURIComponent で処理する必要があります。例えば、ユーザーがパラメータ comment の値として "Thyme &time=again" を入力するかもしれません。 このパラメータ 【訳注: キーと値の組】encodeURIComponent で処理しておかないと、サーバには comment=Thyme%20&time=again という表現が渡ってしまいます。 ここで、アンパサンド '&' と 等号 '=' は、新しいパラメータのキーと値を表すことに注意してください。 つまり、1つのパラメータ(キー comment とその値 "Thyme &time=again") を送信したつもりが、 実際には 2つのパラメータ(キー comment とその値 "Thyme "と 、そして もう一つのキー time とその値 "again")が送信されてしまいます【訳注: キーや値の文字列中の'&'をエンコード処理しておかないと、サーバは'&'を新しいパラメータの開始記号と解釈してしまう】

application/x-www-form-urlencoded (POST)の場合、スペース記号は'+'に置き換える必要があります(詳細はhttp://www.w3.org/TR/html401/interac...m-content-typeを参照ください)。必要があれば、encodeURIComponentを呼び出した上で、更にスペースを"%20"を置き換えるようにしてください。

より厳格に RFC 3986に従う場合には、「!」・「'」・「(」・「)」・「*」の各文字が予約されていますので(ただし、この各文字については、公式にURIの区切り文字としての用途が具体的に規定されているわけではありません)、以下のコードを利用してください:

function fixedEncodeURIComponent (str) {
  return encodeURIComponent(str).replace(/[!'()]/g, escape).replace(/\*/g, "%2A");
}

以下のコードは、レスポンスヘッダ中の「Content-Disposition」及び「Link」パラメーターでUTF-8を用いる場合(例: UTF-8のファイル名)に必要となる特別なエンコーディング処理の実装例です。

var fileName = 'my file(2).txt';
var header = "Content-Disposition: attachment; filename*=UTF-8''" + encodeRFC5987ValueChars(fileName);
console.log(header); // Content-Disposition: attachment; filename*=UTF-8''my%20file%282%29.txt


function encodeRFC5987ValueChars (str) {
    return encodeURIComponent(str).
        // 注意: RFC5987は(RFC3986とは異なって)"!"を予約していないので、この文字をエスケープする必要はありません。
        replace(/['()]/g, escape). // i.e., %27 %28 %29
        replace(/\*/g, '%2A').
            // RFC5987では「|」・「`」・「^」のエスケープは要求されていないので、以下の処理を省くことで、多少コードを読みやすくすることもできます。
            replace(/%(?:7C|60|5E)/g, unescape);
}

関連情報

ドキュメントのタグと貢献者

 最終更新者: Potappo,