encodeURI()

encodeURI() 関数は、URI (Uniform Resource Identifier; 統一資源識別子) をエンコードし、各文字のインスタンスをそれぞれ UTF-8 符号の文字を表す 1 個から 4 個のエスケープシーケンスに置き換えます (サロゲート文字のペアのみ 4 個のエスケープシーケンスになります)。

構文

encodeURI(URI)

引数

URI
完全 URI です。

返値

URI (Uniform Resource Identifier) としてエンコードされた指定された文字列を表す新しい文字列です。

解説

URI において特別な意味を持つ文字 (予約文字) はエンコードされません。下記の例は URI "scheme" に含まれる可能性がある全ての箇所を示しています。特定の文字がどのように特殊な意味を表すために使われているかに注意してください。

http://username:password@www.example.com:80/path/to/file.php?foo=316&bar=this+has+spaces#anchor

したがって、 encodeURI は完全な URI を表すのに必要な文字はエンコードしません。また、 encodeURI は "unreserved marks" (予約されていないが "そのまま" URI に使用できる) 文字をエンコードしません。 (RFC2396 を確認してください。)

encodeURI は下記以外の全ての文字をエスケープします。

エスケープされないもの:

    A-Z a-z 0-9 ; , / ? : @ & = + $ - _ . ! ~ * ' ( ) #

encodeURI は以下のように encodeURIComponent とは異なります。

var set1 = ";,/?:@&=+$#"; // 予約文字
var set2 = "-_.!~*'()";   // 予約されていない記号
var set3 = "ABC abc 123"; // 英数字 + 空白

console.log(encodeURI(set1)); // ;,/?:@&=+$#
console.log(encodeURI(set2)); // -_.!~*'()
console.log(encodeURI(set3)); // ABC%20abc%20123 (空白は %20 にエンコードされる)

console.log(encodeURIComponent(set1)); // %3B%2C%2F%3F%3A%40%26%3D%2B%24%23
console.log(encodeURIComponent(set2)); // -_.!~*'()
console.log(encodeURIComponent(set3)); // ABC%20abc%20123 (空白は %20 にエンコードされる)

なお、encodeURI のみでは、 XMLHTTPRequests のような適切な HTTP の GET および POST リクエストを作成できません。なぜなら、 "&", "+", "=" は GET および POST リクエストにおいて特別な文字であり、それらがエンコードされないからです。 encodeURIComponent の場合、それらがエンコードされます。

サロゲートペアになっていない 1 個のサロゲート文字をエンコードしようとすると URIError が発生することに注意してください。例えば、

// サロゲートペアは OK
console.log(encodeURI('\uD800\uDFFF'));

// 上位サロゲートのみだと "URIError: malformed URI sequence" エラーが発生
console.log(encodeURI('\uD800'));

// 下位サロゲートのみだと "URIError: malformed URI sequence" エラーが発生
console.log(encodeURI('\uDFFF')); 

また、 URL 記述のために最近の RFC3986 仕様に従いたい場合、角括弧 [] は (IPv6 用の) 予約文字となっているため、角括弧が (ホスト名など) URL の一部を形成している場合はエンコードされていないほうがよいでしょう。そういう場合は以下のコードが役に立ちます。

function fixedEncodeURI(str) {
    return encodeURI(str).replace(/%5B/g, '[').replace(/%5D/g, ']');
}

仕様書

仕様書 状態 備考
ECMAScript Latest Draft (ECMA-262)
encodeURI の定義
ドラフト
ECMAScript 2015 (6th Edition, ECMA-262)
encodeURI の定義
標準
ECMAScript 5.1 (ECMA-262)
encodeURI の定義
標準
ECMAScript 3rd Edition (ECMA-262) 標準 初回定義

ブラウザーの互換性

Update compatibility data on GitHub
デスクトップモバイルサーバー
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewAndroid 版 ChromeAndroid 版 FirefoxAndroid 版 OperaiOSのSafariSamsung InternetNode.js
encodeURIChrome 完全対応 1Edge 完全対応 12Firefox 完全対応 1IE 完全対応 5.5Opera 完全対応 ありSafari 完全対応 ありWebView Android 完全対応 1Chrome Android 完全対応 18Firefox Android 完全対応 4Opera Android 完全対応 ありSafari iOS 完全対応 ありSamsung Internet Android 完全対応 1.0nodejs 完全対応 あり

凡例

完全対応  
完全対応

関連情報