URL Encode / Decode
Что такое URL-кодирование
URL-кодирование (percent-encoding) — это механизм преобразования символов в формат, безопасный для передачи через URL. Любой символ, не входящий в набор допустимых, заменяется на последовательность %XX, где XX — шестнадцатеричный код байта. Этот механизм описан в стандарте RFC 3986 и является основой работы всех веб-приложений.
Percent-encoding
Каждый байт символа преобразуется в %HH, где HH — шестнадцатеричное значение. Например, пробел становится %20, а кириллическая буква занимает 2 байта в UTF-8: «П» превращается в %D0%9F. Это гарантирует корректную передачу данных через HTTP-протокол.
RFC 3986
Стандарт определяет синтаксис URI и правила кодирования. Безопасные (unreserved) символы: A-Z, a-z, 0-9, дефис, точка, подчёркивание, тильда. Зарезервированные символы (:, /, ?, #, &, = и другие) имеют особое значение в URL и должны кодироваться при использовании в качестве данных.
UTF-8 и кириллица
Современные браузеры используют UTF-8 для кодирования не-ASCII символов в URL. Кириллические буквы занимают 2 байта (диапазон %D0%80–%D1%BF), что важно учитывать при ограничениях длины URL. Максимальная длина URL в большинстве браузеров составляет около 2000 символов.
Где используется URL-кодирование
URL-кодирование — фундаментальная часть веб-технологий. Понимание его работы необходимо каждому разработчику и маркетологу.
API-разработка
Передача параметров в REST и GraphQL API. Корректное кодирование query-параметров критически важно для работы API: незакодированные спецсимволы (&, =, ?) разрушают структуру запроса.
Веб-скрапинг
Формирование URL для парсинга страниц. При автоматическом сборе данных необходимо правильно кодировать поисковые запросы, фильтры и пагинацию в параметрах URL.
Аналитика и UTM
UTM-метки (utm_source, utm_medium, utm_campaign) требуют кодирования значений с пробелами, кириллицей и спецсимволами. Некорректное кодирование приводит к потере данных в Яндекс Метрике и Google Analytics.
SEO и Cyrillic URL
Яндекс поддерживает кириллические URL (ЧПУ), но при копировании они автоматически кодируются. Понимание percent-encoding помогает корректно настраивать канонические адреса, редиректы и карту сайта.
Mailto и протоколы
Ссылки вида mailto:, tel:, и пользовательские схемы URI требуют кодирования специальных символов в теле письма, теме и других параметрах, иначе ссылка не откроется корректно.
Deep Links и OAuth
Callback URL в OAuth-потоках, deep links в мобильных приложениях и redirect_uri параметры требуют двойного кодирования (URL внутри URL), что является частым источником ошибок.
Таблица кодирования/ справочник символов
Какие символы кодируются, а какие передаются без изменений. Безопасные символы по RFC 3986 не требуют кодирования. Зарезервированные символы имеют специальное значение в структуре URL.
Безопасные (unreserved) — НЕ кодируются
Зарезервированные — кодируются в данных
| Символ | Код | Назначение в URL |
|---|---|---|
| : | %3A | Разделитель протокола (http:) |
| / | %2F | Разделитель пути (/path/to) |
| ? | %3F | Начало query-строки |
| # | %23 | Начало фрагмента (якоря) |
| & | %26 | Разделитель параметров |
| = | %3D | Присвоение значения параметру |
| + | %2B | Пробел (в form-urlencoded) |
| @ | %40 | Разделитель userinfo и хоста |
| пробел | %20 | Пробел (или + в формах) |
Кириллица (UTF-8)
| Символ | URL-код | UTF-8 байты |
|---|---|---|
| А | %D0%90 | 0xD0 0x90 |
| Б | %D0%91 | 0xD0 0x91 |
| Я | %D0%AF | 0xD0 0xAF |
| а | %D0%B0 | 0xD0 0xB0 |
| я | %D1%8F | 0xD1 0x8F |
| ё | %D1%91 | 0xD1 0x91 |
encodeURI vs encodeURIComponent
Две самые популярные функции JavaScript для URL-кодирования работают по-разному. Понимание их различий критически важно для корректной работы с URL в веб-приложениях.
encodeURI()
Кодирует строку как целый URI. Не кодирует зарезервированные символы, которые являются частью структуры URL: : / ? # [ ] @ ! $ ' ( ) * + , ; =
Пример:
encodeURI("https://example.com/путь?q=запрос")Результат:
https://example.com/%D0%BF%D1%83%D1%82%D1%8C?q=%D0%B7%D0%B0%D0%BF%D1%80%D0%BE%D1%81Когда использовать: когда нужно закодировать целый URL, сохранив его структуру (протокол, хост, путь, параметры).
encodeURIComponent()
Кодирует строку как компонент URI. Кодирует все зарезервированные символы, включая : / ? # & =. Оставляет только: A-Z a-z 0-9 - _ . ~ ! ' ( ) *
Пример:
encodeURIComponent("ключ=значение&другой")Результат:
%D0%BA%D0%BB%D1%8E%D1%87%3D%D0%B7%D0%BD%D0%B0%D1%87%D0%B5%D0%BD%D0%B8%D0%B5%26%D0%B4%D1%80%D1%83%D0%B3%D0%BE%D0%B9Когда использовать: когда нужно закодировать значение параметра или любую часть URL, которая может содержать спецсимволы.
Сводная таблица различий
| Символ | encodeURI | encodeURIComponent |
|---|---|---|
| Пробел | %20 | %20 |
| / | / (не кодирует) | %2F |
| ? | ? (не кодирует) | %3F |
| & | & (не кодирует) | %26 |
| = | = (не кодирует) | %3D |
| # | # (не кодирует) | %23 |
| @ | @ (не кодирует) | %40 |
| Кириллица | %D0%XX | %D0%XX |
Советы по работе с URL
Практические рекомендации, которые помогут избежать распространённых ошибок при кодировании и декодировании URL.
1Используйте encodeURIComponent для параметров
Самая частая ошибка — использование encodeURI для кодирования значений query-параметров. Если значение содержит & или =, структура URL будет нарушена. Всегда используйте encodeURIComponent для отдельных значений.
2Избегайте двойного кодирования
Двойное кодирование превращает %20 в %2520. Это происходит, когда уже закодированная строка кодируется повторно. Проверяйте, не закодирован ли текст перед кодированием. Признак: наличие %25 в результате.
3Пробел: %20 или +?
В стандарте RFC 3986 пробел кодируется как %20. Но формат application/x-www-form-urlencoded (HTML-формы) использует + вместо %20. JavaScript-функции encodeURI и encodeURIComponent используют %20. Используйте URLSearchParams для формата с плюсами.
4Ограничение длины URL
Спецификация HTTP не ограничивает длину URL, но браузеры имеют свои лимиты: Chrome — около 2 МБ, IE — 2083 символа, серверы (Apache, Nginx) обычно 8 КБ. Кириллица увеличивает длину в 3-6 раз, учитывайте это при формировании URL.
5URL в URL (redirect_uri)
При передаче URL в качестве параметра другого URL (например, redirect_uri в OAuth) необходимо полностью закодировать вложенный URL через encodeURIComponent. Иначе символы ?, & и = вложенного URL будут интерпретированы как часть внешнего.
6Серверная сторона
Серверные языки имеют свои аналоги: Python — urllib.parse.quote(), PHP — urlencode() и rawurlencode(), Java — URLEncoder.encode(). Убедитесь, что кодировка на клиенте и сервере совпадает (UTF-8 — стандарт де-факто).
Как пользоваться инструментом
Четыре режима работы для решения разных задач: кодирование, декодирование, разбор URL и генерация query-строк.
Кодирование
Выберите метод (encodeURIComponent для параметров, encodeURI для целого URL). Введите текст — результат появится мгновенно. Скопируйте одним нажатием.
Декодирование
Вставьте закодированную строку с %XX последовательностями. Инструмент автоматически определит и декодирует все percent-encoded символы, включая кириллицу.
Разбор URL
Вставьте полный URL — инструмент разложит его на компоненты: протокол, хост, путь, query-параметры и фрагмент. Удобно для анализа сложных ссылок.
Query Builder
Добавляйте пары ключ-значение — инструмент автоматически сформирует закодированную query-строку. Идеально для построения API-запросов и UTM-меток.
Связанные расчёты
Другие инструменты для разработчиков, которые могут пригодиться при работе с URL и данными.
Base64 Encode/Decode
Кодирование и декодирование Base64. Часто используется вместе с URL-кодированием для передачи бинарных данных.
Генератор хешей
MD5, SHA-256 хеши для проверки целостности данных, передаваемых через URL-параметры.
Генератор UUID
Генерация уникальных идентификаторов для использования в URL-параметрах и API-запросах.
Часто задаваемые вопросы
Был ли этот калькулятор полезен?
Инструмент справочный — не заменяет эксперта
Только для информационных целей. Все расчёты, результаты и данные, предоставляемые инструментом, носят исключительно ознакомительный и справочный характер. Они не являются профессиональной консультацией — медицинской, юридической, финансовой, инженерной или иной.
Точность результатов. Калькулятор основан на общепринятых формулах и методиках, однако фактические результаты могут отличаться в зависимости от индивидуальных условий, исходных данных и применяемых стандартов. Мы не гарантируем полноту, точность или актуальность приведённых расчётов.
Профессиональные решения — медицинские, финансовые, инженерные — должны приниматься только после консультации с квалифицированным специалистом. Не используйте автоматический расчёт как единственное основание для важных решений.
Ограничение ответственности. Авторы и разработчики сервиса не несут ответственности за прямой или косвенный ущерб, возникший из-за использования данных расчётов. Пользователь принимает на себя всю ответственность за интерпретацию результатов.
Похожие калькуляторы
HTML Entity кодировщик/декодировщик
Конвертация спецсимволов HTML: именованные, числовые и hex-entities. Кодирование и декодирование & < > и других символов.
/html-entity-encoderJSON форматтер и валидатор
Онлайн форматирование, валидация и минификация JSON с русским интерфейсом. Подсветка синтаксиса, древовидный просмотр, статистика и проверка ошибок.
/json-formatterRegex-тестер с русской документацией
Онлайн тестирование регулярных выражений с подсветкой совпадений, захватом групп и русскоязычной документацией. Шпаргалка по синтаксису regex.
/regex-tester-ruКалькулятор размера бандла (JS/CSS)
Оценка итогового размера фронтенд-сборки по зависимостям. Сравнение пакетов, бюджет бандла, рекомендации по оптимизации.
/razmer-bandla-js-cssBase64 кодировщик/декодировщик
Кодирование и декодирование Base64 онлайн с поддержкой UTF-8 и кириллицы. Base64URL, Data URI, статистика размера.
/base64-encoder-decoderJWT декодер
Декодирование и анализ JWT-токенов онлайн. Просмотр header, payload и signature с русскоязычными пояснениями. Проверка срока действия токена.
/jwt-decoderSQL форматтер (beautifier)
Онлайн форматирование SQL-запросов с подсветкой синтаксиса. Поддержка MySQL, PostgreSQL, MS SQL. Форматирование, минификация и подсветка SQL.
/sql-formatterКонвертер кодировок текста
Конвертация текста между кодировками UTF-8, Windows-1251, KOI8-R, CP866. Исправление кракозябр (mojibake) и битой кириллицы онлайн.
/konverter-kodirovokCSV ↔ JSON ↔ XML конвертер
Онлайн конвертация между форматами CSV, JSON и XML. Настройка разделителей, форматирование и автоопределение формата входных данных.
/konverter-csv-json-xmlКонвертер Unix Timestamp ↔ дата
Онлайн конвертер Unix Timestamp в дату и обратно. Текущий Unix-таймстемп, конвертация с учётом часовых поясов России, форматы ISO 8601 и RFC 2822.
/konverter-unix-timestampКонвертер кириллица ↔ латиница (раскладка)
Исправление текста, набранного в неправильной раскладке. QWERTY ↔ ЙЦУКЕН с автоопределением.
/konverter-raskladkiГенератор Cubic Bezier (CSS transition)
Интерактивный генератор кривых Безье для CSS анимаций. Визуальная настройка плавности переходов, пресеты (ease, linear) и копирование кода.
/cubic-bezierКалькулятор код-ревью: время, размер PR, дефекты, нагрузка
Комплексный калькулятор код-ревью: оценка времени проверки кода, анализ размера PR (XS/S/M/L/XL), покрытие ревью и bus factor, плотность дефектов и escape rate, нагрузка команды ревьюеров, метрики качества (churn, rework, first-pass yield).
/code-review-calculatorКалькулятор теории цвета: гармония, конвертер, палитры, смешивание, дальтонизм
Комплексный инструмент для работы с цветом: цветовые гармонии (комплементарная, аналогичная, триадная, тетрадная), конвертер HEX/RGB/HSL/HSV/CMYK, генератор палитр (монохроматическая, shades, tints, tones), смешивание цветов (аддитивное/субтрактивное), симулятор дальтонизма и анализ цветовой температуры.
/color-theory-calculatorКалькулятор градиентов и интерполяции цветов
Генератор плавных переходов между цветами. Создайте CSS градиент онлайн, получите коды цветов (HEX/RGB) и настройте количество шагов.
/color-gradient