Кодування та декодування URL-адрес у JavaScript має важливе значення для веб-розробки, особливо під час виконання запитів GET із параметрами запиту. Цей процес гарантує, що спеціальні символи в URL-адресах правильно інтерпретуються сервером. Наприклад, пробіли перетворюються на %20 або + в URL-адресах. У цьому посібнику описано, як використовувати такі функції JavaScript, як encodeURI(), encodeURIComponent(), escape(), decodeURI(), decodeURIComponent() і unescape() для ефективного кодування та декодування URL-адрес.

приклад:

• Відкрийте www.google.com і введіть пошуковий запит geeks для geeks.
• Коли з’являться результати пошуку, спостерігайте за URL-адресою рядка браузера. URL-адреса веб-переглядача міститиме символ %20 або знак + замість пробілу.
• URL-адреса відображатиметься так: https://www.google.com/search?q=geeks%20for%20geeks або https://www.google.com/search?q=geeks+for+geeks

Примітка : браузер автоматично перетворив пробіли на знаки + або %20.

Кодування URL: Кодування в Javascript може бути досягнуто за допомогою:

Зміст

• 1. Функція JavaScript encodeURI
• 2. Функція JavaScript encodeURIComponent().
• 3. Функція JavaScript escape().
• 1. Функція JavaScript decodeURI().
• 2. Функція JavaScript decodeURIComponent().
• 3. Функція JavaScript unescape().
• 4. Модуль рядка запитів JavaScript

1. Функція JavaScript encodeURI

The функція encodeURI(). використовується для кодування повного URI. Ця функція кодує спеціальні символи, за винятком символів (, / ?: @ & = + $ #).

Синтаксис:

encodeURI( complete_uri_string );>

const url = 'https://www.google.com/search?q=geeks for geeks'; const encodedURL = encodeURI(url); console.log(encodedURL)>

https://www.google.com/search?q=geeks%20for%20geeks>

2. Функція JavaScript encodeURIComponent().

The функція encodeURIComponent(). використовується для кодування деяких частин або компонентів URI. Ця функція кодує спеціальні символи. Крім того, він кодує такі символи: , / ? : @ & = + $ #

Синтаксис:

encodeURIComponent( uri_string_component );>

const component = 'geeks for geeks'; const encodedComponent = encodeURIComponent(component); console.log(encodedComponent);>

geeks%20for%20geeks>

3. Функція JavaScript escape().

Функція JavaScript escape(). приймає рядок як єдиний параметр і кодує рядок, який можна передати через комп’ютерну мережу, яка підтримує символи ASCII. Кодування — це процес перетворення звичайного тексту в зашифрований текст.

Синтаксис:

escape( string )>

Примітка: Функція escape() кодує лише спеціальні символи, ця функція застаріла.

Винятки: @ – + . /*_

приклади програм на python

const url = 'https://www.google.com/search?q=geeks for geeks'; const encodedURL = encodeURI(url);// encoding using encodeURI console.log(encodedURL) console.log(' ' + escape(url)); //encoding using escape>

https://www.google.com/search?q=geeks%20for%20geeks https%3A//www.google.com/search%3Fq%3Dgeeks%20for%20geeks>

Декодування URL

Декодування в Javascript можна здійснити за допомогою

1. Функція JavaScript decodeURI().

The функція decodeURI(). використовується для декодування URI, створеного encodeURI() .

Синтаксис:

decodeURI( complete_encoded_uri_string )>

приклад : Цей приклад описує функція decodeURI(). з Javascript .

const url = 'https://www.google.com/search?q=geeks%20for%20geeks'; const decodedURL = decodeURI(url); console.log(decodedURL)>

https://www.google.com/search?q=geeks for geeks>

2. Функція JavaScript decodeURIComponent().

The функція decodeURIComponent(). використовується для декодування деяких частин або компонентів URI, створених за допомогою encodeURIComponent().

Синтаксис:

decodeURIComponent( encoded_uri_string_component )>

приклад : Цей приклад описує decodeURIComponent() Javascript.

const component = 'geeks%20for%20geeks' const decodedComponent = decodeURIComponent(component); console.log(decodedComponent)>

geeks for geeks>

3. Функція JavaScript unescape().

Ця функція приймає рядок як один параметр і використовує його для декодування цього рядка, закодованого функцією escape(). Шістнадцяткова послідовність у рядку замінюється символами, які вони представляють під час декодування через функція unescape().

Синтаксис:

unescape(string)>

Примітка: Ця функція декодує лише спеціальні символи, ця функція застаріла.

Винятки: @ – + . /*_

const url = 'https://www.google.com/search?q=geeks for geeks'; const encodedURL = encodeURI(url); console.log(encodedURL) console.log(escape(url)); console.log(decodeURI(encodedURL)); console.log(unescape(encodedURL));>

https://www.google.com/search?q=geeks%20for%20geeks https%3A//www.google.com/search%3Fq%3Dgeeks%20for%20geeks https://www.google.com/search?q=geeks for geeks https://www.google.com/search?q=geeks for ...>

4. Модуль рядка запитів JavaScript

Модуль querystring надає утиліти для аналізу та форматування рядків запиту URL-адреси. Його можна використовувати для кодування та декодування компонентів URL.

Кодування URL:

Щоб закодувати URL-адресу, ми можемо використати функцію querystring.stringify(), щоб створити рядок запиту з об’єкта, а потім використати encodeURIComponent() для кодування отриманого рядка.

const querystring = require('querystring'); const urlParams = {  q: 'geeks for geeks',  page: 1,  sort: 'desc' }; const encodedURL = 'https://www.google.com/search?' + querystring.stringify(urlParams); console.log(encodedURL);>

Вихід:

https://www.google.com/search?q=geeks%20for%20geeks&page=1&sort=desc>

Декодування URL:

Щоб декодувати URL-адресу, ми можемо використати функцію querystring.parse(), щоб розібрати рядок запиту в об’єкт і отримати доступ до декодованих значень.

const decodedParams = querystring.parse('q=geeks%20for%20geeks&page=1&sort=desc'); console.log(decodedParams.q); // Output: geeks for geeks console.log(decodedParams.page); // Output: 1 console.log(decodedParams.sort); // Output: desc>

Різниця decodeURIComponent і decodeURI:

Кодування та декодування URL-адрес у JavaScript має вирішальне значення для безперебійної веб-розробки. Використовуючи такі функції, як encodeURI(), encodeURIComponent(), escape(), decodeURI(), decodeURIComponent() і unescape(), розробники можуть переконатися, що їхні URL-адреси правильно відформатовані та доступні для читання серверами. Ця навичка необхідна для обробки параметрів запиту в запитах GET і забезпечує зручну роботу користувача на вашому веб-сайті.