Кодирование URL: Полное руководство
Кодирование URL, также известное как процентное кодирование, необходимо для создания веб-приложений, которые правильно обрабатывают пользовательский ввод, параметры запроса и специальные символы. Неправильное кодирование URL вызывает сломанные ссылки, уязвимости безопасности и повреждение данных. Это подробное руководство объясняет, как работает кодирование URL и когда использовать различные функции кодирования.
Что такое кодирование URL?
Кодирование URL — это механизм преобразования символов, которые имеют специальное значение в URL или не разрешены в URL, в безопасный формат, который может быть правильно передан. Когда вы видите %20 в URL, это символ пробела, который был URL-кодирован. Процесс называется процентным кодированием, потому что специальные символы заменяются знаком процента (%), за которым следует их шестнадцатеричное представление. Символ пробела (ASCII 32, hex 20) становится %20. Амперсанд & (ASCII 38, hex 26) становится %26. Это позволяет этим символам появляться в URL как данные, а не интерпретироваться как структура URL. URL могут безопасно содержать только ограниченный набор символов. Незарезервированные символы, которые не нуждаются в кодировании: буквы (A-Z, a-z), цифры (0-9) и четыре специальных символа: дефис (-), подчеркивание (_), точка (.) и тильда (~). Все остальные символы должны быть процентно-кодированы, когда они появляются в компонентах URL, где они могут быть неправильно истолкованы. Процесс кодирования прямолинеен: возьмите UTF-8 байтовое представление символа, затем представьте каждый байт как %XX, где XX — двузначное шестнадцатеричное значение. Простые ASCII символы кодируются в одну последовательность %XX. Не-ASCII символы, такие как ö, кодируются в несколько последовательностей: ö в UTF-8 — это байты C3 B6, поэтому становится %C3%B6. Кодирование URL — это не шифрование или обфускация — это исключительно о безопасности символов. Кодированная форма тривиально декодируется, и любой, читающий URL, может понять, что %20 означает пробел. Цель — техническая корректность, а не безопасность или конфиденциальность. Понимание кодирования URL необходимо для: программного построения URL с пользовательским вводом, правильного парсинга URL для извлечения данных, отладки нерабочих ссылок, предотвращения инъекционных атак в веб-приложениях и работы с API, передающими данные в URL.
Зарезервированные символы
Определенные символы "зарезервированы" в URL, потому что они имеют специальные значения в структуре URL. Когда эти символы появляются в данных URL (таких как значения параметров запроса), они должны быть кодированы, чтобы предотвратить их интерпретацию как структурных элементов. Зарезервированные символы и их функции URL: ? отделяет путь от строки запроса, & разделяет параметры запроса, = разделяет имена параметров от значений, / разделяет сегменты пути, # отмечает идентификатор фрагмента, : разделяет схему от хоста и хост от порта, @ разделяет информацию о пользователе от хоста, + в строках запроса представляет пробел (application/x-www-form-urlencoded). Рассмотрим этот URL: https://example.com/search?q=кошки&собаки. Это выглядит как два параметра запроса: q=кошки и собаки (без значения). Но если вы намеревались искать "кошки&собаки" как одну фразу, & был неправильно истолкован. Правильное кодирование: ?q=кошки%26собаки. Неспособность кодировать зарезервированные символы вызывает реальные проблемы. Значение параметра запроса, содержащее =, ломает парсинг. Путь к файлу, содержащий ? или #, неожиданно обрезается. API, принимающий структурированные данные в параметрах запроса, может быть манипулирован некодированными специальными символами. Некоторые зарезервированные символы безопасны в определенных компонентах URL. / в компоненте пути разделяет директории и не должен кодироваться, если это ваше намерение. Но тот же / в значении параметра запроса должен быть кодирован для предотвращения путаницы. Эта контекстная чувствительность — почему существуют разные функции кодирования. Юникод-символы всегда нуждаются в кодировании в URL. Хотя современные браузеры отображают декодированные URL для читаемости, базовая передача использует кодированные формы. Интернационализированное доменное имя (IDN) вроде münchen.de становится xn--mnchen-3ya.de (Punycode) на уровне DNS, хотя браузеры скрывают эту сложность. Для построения URL: кодируйте любое значение, которое может содержать специальные символы, кодируйте весь пользовательский ввод, используйте подходящую функцию кодирования для вашего контекста (путь, запрос, фрагмент), и в случае сомнений кодируйте — избыточное кодирование безопаснее, чем недостаточное.
encodeURI против encodeURIComponent
JavaScript предоставляет две функции кодирования URL, которые служат разным целям. Использование неправильной — частый источник ошибок. Понимание их различий помогает вам правильно выбирать для каждой ситуации. encodeURI() предназначена для кодирования полного, валидного URI. Она сохраняет символы, имеющие структурное значение в URI: :, /, ?, #, @, &, =, + и другие. Используйте encodeURI, когда у вас есть полный URL и вы хотите сделать его безопасным для передачи без нарушения его структуры. Пример: encodeURI("https://example.com/путь с пробелами/page?param=value") становится "https://example.com/путь%20с%20пробелами/page?param=value". Обратите внимание, что структурные символы (://?=) сохранены, в то время как пробелы кодированы. encodeURIComponent() кодирует все, кроме букв, цифр и: - _ . ~. Она предназначена для кодирования отдельных компонентов URI — особенно значений параметров запроса. Она кодирует символы, которые encodeURI сохраняет, включая &, =, / и ?. Пример: encodeURIComponent("кошки & собаки?") становится "кошки%20%26%20собаки%3F". &, пробел и ? все кодированы, потому что они имели бы специальное значение, если бы были вставлены в URL. Когда использовать каждую: используйте encodeURIComponent для значений параметров запроса: "?q=" + encodeURIComponent(userInput). Используйте encodeURIComponent для сегментов пути при построении URL по частям. Используйте encodeURI, когда у вас есть полный URL, который хорошо сформирован, но может содержать пробелы или не-ASCII символы. Распространенные ошибки: использование encodeURI на значениях параметров позволяет инъекцию. Если userInput — это "a&b=c", encodeURI не поможет — & и = остаются некодированными. Использование encodeURIComponent на полном URL ломает его, кодируя структурные символы. Для строк запроса конкретно многие разработчики используют URLSearchParams вместо ручного кодирования: new URLSearchParams({q: "кошки & собаки"}).toString() правильно производит "q=кошки+%26+собаки". Это обрабатывает кодирование автоматически и производит правильно отформатированные строки запроса. На других языках: Python имеет urllib.parse.quote() и quote_plus(), PHP имеет urlencode() и rawurlencode(), и каждый язык имеет похожие пары. Различие всегда: полный URL против компонентного кодирования.
Попробовать инструмент
Кодировщик/Декодер URL
Узнать больше
Вопросы и ответы
Кодировщик/Декодер URL
Вопросы и ответы →