Должен ли я использовать encodeURI или encodeURIComponent для кодирования URL?

Question

Какой из этих двух методов следует использовать для кодирования URL?

Answer 1

Это зависит от того, что вы действительно хотите сделать.

encodeURI предполагает, что ввод представляет собой полный URI, в котором могут быть символы, требующие кодирования.

encodeURIComponent будет кодировать все со специальным значением, поэтому вы используете его для компонентов URI, таких как

var world = "A string with symbols & characters that have special meaning?";
var uri = 'http://example.com/foo?hello=' + encodeURIComponent(world);

Answer 2

Если вы кодируете строку для вставки в компонент URL (параметр строки запроса), вам следует вызвать encodeURIComponent.

Если вы кодируете существующий URL, позвоните encodeURI.

Answer 3

xkr.us - отличная дискуссия с примерами. Процитируем их резюме:

Метод escape () не кодирует символ +, который интерпретируется как пространство на стороне сервера, а также генерируется формы с пробелами в своих полях. Из-за этого недостатка и тот факт, что эта функция не может обрабатывать символы не ASCII правильно, вы должны по возможности избегать использования escape (). Лучшей альтернативой обычно является encodeURIComponent ().

escape () не будет кодировать: @ * / +

Использование метода encodeURI () немного более специализировано, чем escape () в том, что он кодирует для URI, в отличие от строки запроса, которая часть URL. Используйте этот метод, когда вам нужно закодировать строку используется для любого ресурса, который использует URI и нуждается в определенных символах для остаются незашифрованными Обратите внимание, что этот метод не кодирует символ, так как это допустимый символ в URI.

encodeURI () не будет кодировать: ~! @ # $ & * () =: /,;? + '

Наконец, метод encodeURIComponent () должен использоваться в большинстве случаев при кодировании одного компонента URI. Этот метод будет кодировать определенные символы, которые обычно распознаются как специальные символы для URI, так что многие компоненты могут быть включены. Обратите внимание, что этот метод не кодирует символ ', поскольку это допустимый символ в URIs.

encodeURIComponent () не будет кодировать: ~! * () '

Answer 4

Вот сводка.

1. escape () не будет кодировать @ * _ + -./

   Не используйте его.

2. encodeURI () не будет кодировать AZ az 0-9;/?: @ & = + $ - _.!~ * '() #

   Используйте его, когда вы вводите полный URL-адрес, например' https://searchexample.com/search?q=wiki'

3. encodeURIComponent () не будет кодировать AZ az 0-9 - _.!~ * '() Используйте его, когда ваш ввод является частью полного URL, например const queryStr = encodeURIComponent(someString)

Answer 5

encodeURIComponent (): предполагается, что его аргумент является частью (такой как протокол, имя хоста, путь или строка запроса) URI. Поэтому он избегает знаков препинания, которые используются для разделения частей URI.

encodeURI (): используется для кодирования существующего URL

Answer 6

Разница между encodeURI и encodeURIComponent:

encodeURIComponent(value) в основном используется для кодирования значений параметров queryString и кодирует каждый применимый символ в value. encodeURI игнорирует префикс протокола (http://) и имя домена.

---

В очень, очень редких случаях, когда вы хотите реализовать ручное кодирование для кодирования дополнительных символов (хотя их не требуется кодировать в типичных случаях), например: ! *, затем Вы можете использовать:

function fixedEncodeURIComponent(str) {
  return encodeURIComponent(str).replace(/[!*]/g, function(c) {
    return '%' + c.charCodeAt(0).toString(16);
  });
}

( источник )

Answer 7

Другие ответы описывают цели. Вот символы, которые каждая функция будет преобразовывать :

control = '\x00\x01\x02\x03\x04\x05\x06\x07\x08\x09\x0A\x0B\x0C\x0D\x0E\x0F'
        + '\x10\x11\x12\x13\x14\X15\x16\x17\x18\x19\x1A\x1B\x1C\x1D\x1E\x1F'
                                                                    + '\x7F'
encodeURI         (control + ' "%<>[\\]^`{|}'                             )
encodeURIComponent(control + ' "%<>[\\]^`{|}' + '#$&,:;=?' + '+/@'        )
escape            (control + ' "%<>[\\]^`{|}' + '#$&,:;=?' +       "!'()~")

Все вышеперечисленные символы преобразуются в шестнадцатеричные коды процента. Пробел до %20, проценты до %25 и т. Д. Символы ниже проходят без изменений.

Вот символы, которые функции НЕ преобразуют :

pass_thru = '*-._0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz'

encodeURI         (pass_thru + '#$&,:;=?' + '+/@' + "!'()~")
encodeURIComponent(pass_thru +                      "!'()~")
escape            (pass_thru +              '+/@'          )

Answer 8

Как правило, используйте encodeURIComponent. Не бойтесь длинного имени, думая, что оно более конкретно в его использовании, для меня это наиболее часто используемый метод. Также не стоит впадать в использование encodeURI, потому что вы проверили его, и он, кажется, правильно кодирует, вероятно, это не то, что вы хотели использовать, и хотя ваш простой тест с использованием «Fred» в поле первого имени сработал, вы найдете позже, когда вы будете использовать более сложный текст, такой как добавление амперсанда или хэштега, произойдет сбой. Вы можете посмотреть на другие ответы по причинам, почему это так.