encodeURIComponent()
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
encodeURIComponent()
- метод, кодирующий компонент универсального идентификатора ресурса (URI) заменой каждой определённой последовательности символов одной, двумя, тремя или четырьмя последовательностями символов, представленных в кодировке UTF-8 (будет только 4 управляющих последовательности для символов, состоящих из 2 "суррогатных" символов).
Синтаксис
encodeURIComponent(str);
Параметры
str
-
Строка. Компонент URI.
Описание
encodeURIComponent
изменяет все символы, за исключением следующих: латинские буквы, десятичные цифры, - _ . ! ~ * ' ( )
Замечание: URIError
будет брошена, если попытаться закодировать суррогат, который не является частью высоко-низкой пары, например:
// низко-высокая пара - нормально
console.log(encodeURIComponent("\uD800\uDFFF"));
// один высокий суррогат бросит "URIError: malformed URI sequence"
console.log(encodeURIComponent("\uD800"));
// один низкий суррогат бросит "URIError: malformed URI sequence"
console.log(encodeURIComponent("\uDFFF"));
Чтоб избежать неожиданных запросов к серверу, вам следует вызывать encodeURIComponent
для любых вводимых пользователем параметров, используемых как часть URI. Например, он мог написать "Thyme &time=again
" для переменной comment
. Неиспользование encodeURIComponent
для неё даст comment=Thyme%20&time=again
. Заметьте, что амперсанд и знак равно выделяют новую пару ключ-значение. Так что вместо комментария "Thyme &time=again
", вы получите два POST параметра, один - "Thyme
", а другой (time
) равный "again"
.
Для application/x-www-form-urlencoded
пробелы должны быть заменены на "+", поэтому вам может понадобиться encodeURIComponent
с дополнительной заменой "%20" на "+".
Чтобы строго соблюдать RFC 3986 (который резервирует !, ', (, ), и *), даже не смотря на то, что символы не используют сформированных URI разделителей, можно безопасно использовать следующие:
function fixedEncodeURIComponent(str) {
return encodeURIComponent(str).replace(/[!'()*]/g, function (c) {
return "%" + c.charCodeAt(0).toString(16);
});
}
Примеры
Пример представляет специальное кодирование, требуемое для заголовков сервера в UTF-8: Content-Disposition
и Link
(к примеру, имена файлов в 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)
// Замечание: хотя RFC3986 резервирует "!", RFC5987 это не делает, так что нам не нужно избегать этого
.replace(/['()]/g, escape) // i.e., %27 %28 %29
.replace(/\*/g, "%2A")
// Следующее не требуется для кодирования процентов для RFC5987, так что мы можем разрешить немного больше читаемости через провод: |`^
.replace(/%(?:7C|60|5E)/g, unescape)
);
}
Спецификации
Specification |
---|
ECMAScript Language Specification # sec-encodeuricomponent-uricomponent |
Совместимость с браузерами
BCD tables only load in the browser