URLSearchParams: параметры без ручной склейки

Назначение

URLSearchParams помогает собирать и читать параметры запроса с учётом кодирования специальных символов.

Как это работает

Методы set и append различаются: первый заменяет значения ключа, второй добавляет ещё одно. Для повторяющихся параметров нужен getAll. Пробел в сериализованной строке обычно представлен плюсом.

Пример

const params = new URLSearchParams();
params.set('q', 'HTML & CSS');
params.append('tag', 'html');
params.append('tag', 'css');
console.assert(params.get('q') === 'HTML & CSS');
console.assert(params.getAll('tag').length === 2);

Что должно получиться

Фраза сохраняется одним значением, а tag имеет два отдельных значения. Сериализацию можно использовать в URL, но сервер всё равно обязан проверять смысл параметров.

Граница применения и частая ошибка

Не склеивайте пользовательский ввод с амперсандом и знаком равенства вручную. Эти символы могут стать частью структуры запроса вместо буквального значения.

Самостоятельная проверка

Добавьте поисковую фразу с & и двумя пробелами. Затем прочитайте её обратно и убедитесь, что она не превратилась в несколько параметров.

Связанные материалы

• Статусы HTTP
• Панель Network
• Структура проекта