DecodeURI: примеры (JAVASCRIPT)

Короткие примеры использования

Пример 1: Декодирование простого закодированного URI.

let encoded = 'https://example.com/%D0%BF%D1%83%D1%82%D1%8C';
let decoded = decodeURI(encoded);
console.log(decoded);

https://example.com/путь

Пример 2: Декодирование с пробелами и знаками препинания.

let encoded = 'Hello%20World%21%20%D0%9F%D1%80%D0%B8%D0%B2%D0%B5%D1%82%21';
let decoded = decodeURI(encoded);
console.log(decoded);

Hello World! Привет!

Пример 3: Попытка декодирования неполной последовательности (ошибка).

try {
    let decoded = decodeURI('%AB%');
    console.log(decoded);
} catch(e) {
    console.error(e.name + ': ' + e.message);
}

URIError: URI malformed

Похожие функции в JavaScript

decodeURIComponent() - декодирует компонент URI (например, параметр запроса, хэш, путь). В отличие от decodeURI(), она декодирует ВСЕ символы, закодированные процентным кодированием, включая ; , / ? : @ & = + $ #, которые decodeURI() не декодирует, так как считает их частью структуры URI.

encodeURI() и encodeURIComponent() - противоположные функции для кодирования.

Когда что использовать:

• decodeURI() - для декодирования целого URI, полученного, например, из window.location.href, когда нужно сохранить структуру адреса.
• decodeURIComponent() - для декодирования отдельных значений (например, параметра из URLSearchParams).

Типичные ошибки

1. Использование decodeURI для декодирования параметров запроса. Это может привести к некорректному декодированию, если в значении параметра содержатся символы типа & или =.

let param = 'city=Moscow%26country=Russia';
console.log(decodeURI(param)); // city=Moscow&country=Russia - символ & декодирован
// Лучше использовать decodeURIComponent для каждого параметра отдельно.

city=Moscow&country=Russia

2. Некорректные последовательности. Если строка содержит неполные или ошибочные escape-последовательности.

try {
    decodeURI('%GG');
} catch(e) {
    console.log(e.name); // URIError
}

URIError

3. Двойное кодирование. Если URI был закодирован дважды, однократный вызов decodeURI не восстановит исходную строку.

let twiceEncoded = encodeURI(encodeURI('тест'));
console.log(decodeURI(twiceEncoded)); // %D1%82%D0%B5%D1%81%D1%82
console.log(decodeURI(decodeURI(twiceEncoded))); // тест

%D1%82%D0%B5%D1%81%D1%82
тест

Изменения в последних версиях

Функция decodeURI() была стандартизирована в ECMAScript 3-й редакции (1999 год) и с тех пор ее поведение остается стабильным и неизменным в спецификации ECMAScript.

В современных реализациях JavaScript (движках V8, SpiderMonkey, JavaScriptCore) не было значимых изменений в работе этой функции. Ее поддержка является полной и кросс-браузерной.

Единственное, на что можно обратить внимание, это корректная обработка символов Unicode и суррогатных пар в различных средах выполнения, но это касается внутренней реализации, а не изменений в спецификации.

Расширенные примеры использования

Пример 1: Обработка полного URL адреса с параметрами.

let fullEncodedURL = 'https://site.com/%D0%BA%D0%B0%D1%82%D0%B0%D0%BB%D0%BE%D0%B3?item=%D0%BA%D0%BD%D0%B8%D0%B3%D0%B0%26page=1';
let decodedURL = decodeURI(fullEncodedURL);
console.log('Декодированный URL:', decodedURL);
// Параметры декодированы частично. Символ '&' остался закодированным как %26.
// Для полного декодирования параметров нужно работать с ними отдельно.
let urlObj = new URL(decodedURL);
console.log('Параметр item:', decodeURIComponent(urlObj.searchParams.get('item')));

Декодированный URL: https://site.com/каталог?item=книга%26page=1
Параметр item: книга&page=1

Пример 2: Сравнение decodeURI и decodeURIComponent на одних данных.

let str = 'a+b c=d&e#f';
let encodedFull = encodeURI(str);
let encodedComp = encodeURIComponent(str);
console.log('encodedURI:', encodedFull);
console.log('encodedURIComponent:', encodedComp);
console.log('decodeURI(encodedURI):', decodeURI(encodedFull));
console.log('decodeURI(encodedURIComponent):', decodeURI(encodedComp)); // Не полностью декодирует!
console.log('decodeURIComponent(encodedURIComponent):', decodeURIComponent(encodedComp));

encodedURI: a+b%20c=d&e#f
encodedURIComponent: a%2Bb%20c%3Dd%26e%23f
decodeURI(encodedURI): a+b c=d&e#f
decodeURI(encodedURIComponent): a%2Bb c%3Dd%26e%23f
decodeURIComponent(encodedURIComponent): a+b c=d&e#f

Пример 3: Обработка данных из localStorage, которые могли быть закодированы.

// Эмуляция сохранения закодированной строки
let searchQuery = 'кошки & собаки';
localStorage.setItem('query', encodeURI(searchQuery));
// Получение и декодирование
let savedQuery = localStorage.getItem('query');
let originalQuery = decodeURI(savedQuery);
console.log(originalQuery);

кошки & собаки

Пример 4: Итеративное декодирование для случая неизвестного уровня кодирования.

function safeDecodeURI(uri) {
    let last = uri;
    while (last !== decodeURI(last)) {
        last = decodeURI(last);
    }
    return last;
}
let multiEncoded = encodeURI(encodeURI('специјално'));
console.log(safeDecodeURI(multiEncoded));

специјално

Альтернативы в других языках программирования

Python (urllib.parse.unquote): Аналог decodeURIComponent(). Для декодирования всего URI может потребоваться разделение на компоненты.

from urllib.parse import unquote
encoded = 'Hello%20World%21'
decoded = unquote(encoded)
print(decoded)  # Hello World!

Hello World!

PHP (urldecode): Функция urldecode() аналогична decodeURIComponent() в JavaScript.

$encoded = 'Hello+World%21';
$decoded = urldecode($encoded);
echo $decoded; // Hello World!

Hello World!

C# (System.Uri.UnescapeDataString): Ближе по функциональности к decodeURIComponent().

string encoded = "Hello%20World%21";
string decoded = System.Uri.UnescapeDataString(encoded);
Console.WriteLine(decoded);

Hello World!

MySQL (UNHEX, REPLACE): Прямого аналога нет, но можно использовать комбинацию функций для замены процентного кодирования.

SELECT REPLACE(UNHEX(REPLACE('Hello%20World', '%', '')), ' ', '%20'); -- Упрощенный пример

Отличия: В основном, поведение аналогично decodeURIComponent(), а не decodeURI(). JavaScript уникален разделением логики декодирования URI целиком и его компонентов.