encodeURIComponent(): кодирование отдельной части URL
EncodeURIComponent кодирует строку для использования как отдельное значение в URL. Он не предназначен для кодирования готового адреса целиком с сохранением его структуры.
Назначение
EncodeURIComponent кодирует строку для использования как отдельное значение в URL. Он не предназначен для кодирования готового адреса целиком с сохранением его структуры.
Как это работает
Зарезервированные разделители вроде амперсанда и слеша преобразуются в процентную запись. Пробел кодируется как %20. При построении строки запроса часто удобнее URLSearchParams, который сам управляет представлением параметров.
Пример
const value = "HTML & CSS";
const encoded = encodeURIComponent(value);
console.assert(encoded === "HTML%20%26%20CSS");
console.assert(decodeURIComponent(encoded) === value);
console.assert(encodeURIComponent("a/b") === "a%2Fb");
console.assert(encodeURIComponent("+") === "%2B");
console.log(encoded);Что должно получиться
Кодированное значение не содержит необработанного амперсанда-разделителя. Обратное декодирование возвращает исходную строку. Пример не отправляет данные и не создаёт HTML.
Граница применения и частая ошибка
Процентное кодирование не защищает от HTML-инъекций и не является шифрованием. Не применяйте функцию повторно к уже кодированной строке без выбранного протокола. Некоторые некорректные UTF-16 последовательности вызывают URIError.
Самостоятельная проверка
Закодируйте одно значение с вопросительным знаком, слешем и символом процента. Затем сравните с кодированием целого адреса: объясните, какие разделители вы потеряли. Для формы выберите один способ сериализации, а не несколько подряд.
Пример JavaScript проверяйте в собственном учебном файле или консоли своего проекта. Встроенная песочница справочника JavaScript не выполняет. Успешное выполнение в одной среде не гарантирует поддержку метода во всех браузерах.