JS метод Global.encodeURI()
Загальний опис
encodeURI() є вбудованим методом у JavaScript, який призначений для кодування тексту в формат, який є безпечним і придатним для використання в уніфікованих ідентифікаторах ресурсів (URI). Завдяки йому можна гарантувати, що URL-адреси будуть читатися і інтерпретуватися правильно між різними ресурсами і платформами.
Однією з основних причин використання encodeURI() є потреба забезпечити, що спеціальні символи в URL-адресі, такі як "&", "#", " ", та інші, не будуть викликати непередбачених проблем під час переходу по посиланню або відправки запиту. Інакше кажучи, цей метод перетворює символи в URL-адресі в їх відсоткове кодування, яке може бути безпечно передано через інтернет.
Приклад:
const url = "Hello World!";
const encodedURL = encodeURI(url);
console.log(encodedURL); // Hello%20World%21
У цьому прикладі пробіл в "Hello World!" було закодовано як %20, а знак оклику – як %21.
encodeURI() корисний у ряді сценаріїв. Наприклад, при додаванні даних, отриманих від користувача, до URL-адреси перед відправкою запиту на сервер або при створенні посилань, що включають динамічний контент.
Важливо відзначити, що encodeURI() кодує лише ті символи, які мають спеціальне значення у URI. Він не кодує символи, такі як ":", "/", "?" та "@", оскільки вони вважаються дійсними символами в структурі URL. Якщо потрібно кодувати кожний символ у тексті, рекомендується використовувати encodeURIComponent() замість encodeURI().
Приклад відмінностей:
const data = "Hello, how are you? Have a nice day!";
const uri = encodeURI(data);
const uriComponent = encodeURIComponent(data);
console.log(uri); // Hello,%20how%20are%20you?%20Have%20a%20nice%20day!
console.log(uriComponent); // Hello%2C%20how%20are%20you%3F%20Have%20a%20nice%20day%21
Як бачимо, encodeURIComponent() кодує більше символів, ніж encodeURI().
- Порада
-
Коли ви кодуєте URL за допомогою
автор: BondencodeURI(), завжди перевіряйте результат, щоб бути впевненим, що він відповідає вашим очікуванням. Іноді деякі символи можуть залишитися некодованими, що може призвести до проблем при обробці URL на сервері або в інших середовищах. - Порада
-
Якщо ви розробляєте великі системи або фреймворки, розгляньте можливість створення загальних службових функцій для кодування URL, які б враховували особливості вашої системи та інші вимоги безпеки. Це може допомогти уникнути типових помилок при кодуванні і забезпечити консистентність у всьому проекті.
автор: Bond - Порада
-
Перед використанням
encodeURI()завжди визначайте, яку частину URL ви плануєте кодувати. Якщо кодуєте лише параметри запиту або інші компоненти URL, які можуть містити спеціальні символи, розгляньте використанняencodeURIComponent()замістьencodeURI()для більш точного кодування.Приклад:
автор: Bondconst base = "https://example.com/query?"; const param = "name=John&age=20"; const encodedURL = base + encodeURIComponent(param); - Нотатка
-
Пам'ятайте, що повторне кодування вже закодованого URL може призвести до непередбачуваних результатів. Додавання додаткового кодування до вже закодованого URL може зробити його непридатним для використання.
Приклад:
автор: Bondconst encodedParam = encodeURIComponent("name=John&age=20"); const doubleEncoded = encodeURIComponent(encodedParam); // Неправильно!
Синтаксис
encodeURI(uri)Параметри
uri-
Рядок, який потрібно закодувати як URI.
автор: Bond
Повернення
string-
Повертає новий рядок, який представляє наданий рядок, закодований як URI.
автор: Bond
Винятки
URIError: ця помилка виникає, якщо в URI присутній окремий сурогатний символ, який не може бути закодований методом.
Переглядачі
| Переглядач |  |
 |
 |
 |
 |
 |
|---|---|---|---|---|---|---|
| 1 | 1 | 1.1 | 7 | 12 | 5.5 |
| Переглядач |  |
 |
 |
 |
|---|---|---|---|---|
| 4.4 | 18 | 4 | 1 |
| Переглядач |  |
 |
|---|---|---|
| 0.10.0 | 1.0 |
Приклади
+ запропонувати свій приклад у пісочниці
В інтерфейсі користувач вводить текст для кодування у поле введення. Після натискання на кнопку "Кодувати", текст буде закодований за допомогою методу encodeURI() і результат буде відображений на сторінці.
У даному прикладі ми маємо базову URL адресу, до якої потрібно додати рядок запиту. Користувач вводить рядок "Книги про JavaScript&author=Джон", але цей рядок містить символ "&", який є спеціальним символом в URL. Використовуючи метод encodeURI(), ми кодуємо цей рядок таким чином, щоб його можна було безпечно додати до URL.
// Базова URL адреса
const baseURL = "https://example.com/search?query=";
// Рядок пошуку, введений користувачем
const userQuery = "Книги про JavaScript&author=Джон";
// Кодуємо рядок запиту, щоб можна було його безпечно додати до URL
const encodedURL = baseURL + encodeURI(userQuery);
console.log(encodedURL);
// Виведе: "https://example.com/search?query=Книги%20про%20JavaScript&author=%D0%94%D0%B6%D0%BE%D0%BD"Тут ми маємо заголовок новини, який хочемо поділитися у Twitter. Однак, перед тим як додати цей заголовок до URL для ділитися, нам потрібно його закодувати. Для цього ми використовуємо метод encodeURI(). В результаті отримуємо коректний URL, який можна використовувати для ділитися контентом у соціальних мережах.
// Заголовок новини, який користувач хоче поділитися
const newsTitle = "Новий курс про JavaScript в Україні!";
// Кодуємо заголовок, щоб створити URL для ділитися новиною у Twitter
const shareURL = "https://twitter.com/intent/tweet?text=" + encodeURI(newsTitle);
console.log(shareURL);
// Виведе: "https://twitter.com/intent/tweet?text=Новий%20курс%20про%20JavaScript%20в%20Україні!"Коментарі
Коментарів ще немає — будьте першим!