Зарезервированные символы URL: полный разбор

Спецификация URL (RFC 3986) делит символы на зарезервированные (reserved) и незарезервированные (unreserved). Понимание этого деления делает очевидным, когда кодировать обязательно, а когда нет.

Незарезервированные символы (безопасны как есть)

Буквы, цифры и четыре символа - _ . ~ могут стоять в любом месте без кодирования. Их кодирование не изменило бы смысла, поэтому обычно их оставляют как есть.

Зарезервированные символы (структурный смысл)

Зарезервированные символы делят URL на части. Чтобы использовать такой символ как обычные данные, его необходимо закодировать.

• : / ? # [ ] @ — разделяют крупные разделы (scheme, path, query, fragment и т. д.)
• ! $ & ' ( ) * + , ; = — вложенные разделители, особенно для ключей и значений query

Граница между encodeURI и encodeURIComponent

encodeURI сохраняет эти зарезервированные символы, поэтому не ломает структуру уже готового URL. encodeURIComponent кодирует их все, что и нужно при вставке фрагмента вроде одного значения параметра.

Используйте encodeURIComponent для одного значения и encodeURI для целого адреса — помня лишь это правило, вы избежите большинства ошибок.