Кодирование URL-адресов — важнейший аспект веб-разработки, когда речь идет об обработке специальных символов, пробелов и символов, отличных от ASCII, в URL-адресах. В JavaScript существует несколько методов эффективного кодирования URL-адресов. В этой статье мы рассмотрим различные подходы к кодированию URL-адресов в JavaScript, приведя примеры кода для каждого метода.

Метод 1: encodeURIComponent()
Функция encodeURIComponent() — это встроенный метод JavaScript, который кодирует полный URL-адрес путем замены всех символов, кроме буквенно-цифровых символов A-Z, a-z, 0-9и отдельные символы -, _, ., ~со знаком процента, за которым следуют две шестнадцатеричные цифры. Этот метод обычно используется для кодирования параметров строки запроса.

Пример:

const url = 'https://example.com/?search=' + encodeURIComponent('URL encoding');
console.log(url);
// Output: https://example.com/?search=URL%20encoding

Метод 2: encodeURI()
Функция encodeURI()аналогична encodeURIComponent(), но она используется для кодирования полного URL-адреса, исключая параметры строки запроса. Этот метод сохраняет определенные символы, такие как :, /, ?, #и &которые важны для определения URL-адресов.

Пример:

const url = 'https://example.com/' + encodeURI('path with spaces/index.html');
console.log(url);
// Output: https://example.com/path%20with%20spaces/index.html

Метод 3: escape()
Хотя функция escape()не предназначена специально для кодирования URL-адресов, ее можно использовать для кодирования URL-адресов. Он заменяет большинство небуквенно-цифровых символов знаком %, за которым следуют две шестнадцатеричные цифры. Однако он не кодирует такие символы, как @, *, +, -или 25<. /с>.

const url = 'https://example.com/' + escape('example+page');
console.log(url);
// Output: https://example.com/example%2Bpage

const url = 'https://example.com/?search=' + 'URL encoding'.replace(/ /g, '%20');
console.log(url);
// Output: https://example.com/?search=URL%20encoding