Как кодировать и декодировать URL
Если вы когда-либо видели %20 в URL, где должен быть пробел, или %C3%A9 там, где должен быть символ с диакритикой, вы сталкивались с URL-кодированием. Это фундаментальный кирпичик веба, и его понимание помогает отлаживать сломанные ссылки, проблемы API и отправки форм.
Что делает URL-кодирование
URL могут содержать только ограниченный набор безопасных символов: буквы (A-Z, a-z), цифры (0-9) и несколько специальных символов (-, _, ., ~). Всё остальное — пробелы, диакритика, эмодзи, символы вроде &, =, #, ? — должно быть конвертировано в безопасный формат.
URL-кодирование (также называемое percent-encoding) заменяет небезопасные символы на %, за которым следует их шестнадцатеричное байтовое значение:
| Символ | Закодировано |
|---|---|
| Пробел | %20 |
| & | %26 |
| = | %3D |
| # | %23 |
| ? | %3F |
| / | %2F |
| @ | %40 |
Когда необходимо URL-кодирование
- Параметры запроса со специальными символами — запрос вроде
цена > 100 & категория = обувьнуждается в кодировании, чтобы работать в URL - Не латинские символы в URL — имена, города или контент на других языках должны быть закодированы
- API-запросы — при ручном построении API-вызовов значения параметров часто нуждаются в кодировании
- Отладка — когда URL не работает, его декодирование раскрывает реальные значения
Как кодировать и декодировать
- Выберите кодировать или декодировать — выберите направление. Возьмите encodeURIComponent для параметров запроса или encodeURI для полных URL.
- Вставьте ваш ввод — введите текст или URL. Результат обновляется мгновенно.
- Скопируйте вывод — используйте результат в вашем коде, API-запросе или браузере.
Советы
- Кодируйте значения, а не целые URL — если вы кодируете целый URL, слэши и двоеточия, структурирующие URL, тоже будут закодированы, что его сломает. Кодируйте только значения внутри параметров запроса.
- Двойное кодирование — кодирование уже закодированной строки производит вещи вроде
%2520(%становится%25). Если ваш URL выглядит неправильно, проверьте, не закодировано ли что-то дважды. - Декодируйте для отладки — когда API-запрос проваливается или URL выглядит нечитаемым, декодируйте его, чтобы увидеть реальные значения. Это часто немедленно раскрывает проблему.
- Используйте встроенные функции вашего языка — в продакшен-коде всегда используйте
encodeURIComponent()(JavaScript),urllib.parse.quote()(Python) илиURLEncoder.encode()(Java), а не кодируйте вручную.
Часто задаваемые вопросы
В чём разница между encodeURI и encodeURIComponent?
encodeURI сохраняет действительные символы в структуре URL (слэши, двоеточия, знаки вопроса). encodeURIComponent кодирует всё, кроме букв, цифр и нескольких безопасных символов. Используйте encodeURIComponent для значений параметров запроса, encodeURI для полных URL.
Почему пробелы становятся %20 или +?
В URL-кодировании пробелы становятся %20. В данных формы (application/x-www-form-urlencoded) пробелы становятся +. Оба действительны в своих контекстах, но %20 — это универсальный стандарт для URL.
Должен ли я кодировать URL вручную?
В большинстве случаев ваш язык или фреймворк занимается кодированием автоматически. Ручное кодирование полезно при ручном построении URL, отладке API-запросов или работе со строками запроса, содержащими специальные символы.
Отправляются ли мои данные на сервер?
Нет. Всё кодирование и декодирование происходит в вашем браузере.