Питання Зашифруйте URL-адресу в JavaScript?


Як спокійно кодувати URL-адресу за допомогою JavaScript так, щоб його можна було вставити в рядок GET?

var myUrl = "http://example.com/index.html?param=1&anotherParam=2";
var myOtherUrl = "http://example.com/index.html?url=" + myUrl;

Я припускаю, що вам потрібно кодувати myUrl змінна на цій другій лінії?


2126
2017-12-02 02:37


походження


Подивіться на це encodeURI () і decodeURI (). - Zack The Human
Побачити Функція JavaScript urlencode. - Yanni
Ви можете використовувати цей інструмент тут: phillihp.com/toolz/url-encode-decode - phillihp
encodeURIComponent () - Andrew


Відповіді:


Перевірте вбудовану функцію encodeURIComponent(str) і encodeURI(str).
У вашому випадку це має працювати:

var myOtherUrl = 
       "http://example.com/index.html?url=" + encodeURIComponent(myUrl);

2492
2017-12-02 02:43



Як щодо додавання пояснення @ cms дали? escape є також дійсним варіантом. - hitautodestruct
відповідно до @CMS encodeURI насправді не є безпечним для кодування URL-адреси. - Ifnot
@AnaelFavre, оскільки він призначений для кодування всієї URL-адреси, яка не дозволяє такі символи, як :, /, @ тощо. Ці 2 методи не повинні використовуватися взаємозамінними, ви повинні знати, що ви кодуєте, щоб використовувати правильний метод. - Buu Nguyen
Дивись також developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/... і developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/... - Michał Perłakowski
Як вже згадувалось в іншому відповідь на цій сторінці, цей сайт Красиво деталізує причину використання цього методу - Brad Parks


У вас є три варіанти:

  • escape() не буде кодувати: @*/+

  • encodeURI() не буде кодувати: ~!@#$&*()=:/,;?+'

  • encodeURIComponent() не буде кодувати: ~!*()'

Але у вашому випадку, якщо ви хочете пройти a URL-адреса в a GET параметр іншої сторінки, ви повинні використовувати escape або encodeURIComponent, але ні encodeURI.

Див. Запитання про переповнення стакана Краща практика: втеча або encodeURI / encodeURIC компонентів для подальшого обговорення.


1373
2017-12-02 02:49



Кодування символів, яке використовується при викраденні, є змінним. Дотримуйтесь encodeURI і encodeURIComponent, які використовують UTF-8. - erickson
Будь обережний. Це уникнення перетворює не-ASCII-символи в його послідовності для викликів Unicode, як-от %uxxx. - opteronn
Я використовую encodeURIComponent і помічаю, що він не буде кодувати символи труби | - kevzettler
@ kevzettler - чому б це зробити? Труби не мають семантичного значення в URI. - nickf
@ GiovanniP: Люди, які дозволяють використовувати німецьку, французьку, японську, китайську, арабську символи в якості вхідних і пропускних тестів через GET або POST. - Tseng


Дотримуватися encodeURIComponent(). Функція encodeURI() не перешкоджає кодувати багато символів, які мають семантичне значення в URL-адресах (наприклад, "#", "?" та "&"). escape() застаріла і не перешкоджає кодувати символи "+", які будуть інтерпретовані як кодовані прогалини на сервері (і, як зазначають інші, тут неправильно кодуються не-ASCII символи).

Існує приємно пояснення різниці між encodeURI() і encodeURIComponent() в іншому місці. Якщо ви хочете кодувати щось так, щоб його можна було безпечно включити як компонент URI (наприклад, як параметр рядка запиту), ви хочете використовувати encodeURIComponent().


156
2018-05-29 23:54





Особисто я вважаю, що багато API хочуть замінити "" на "+", так що я використовую наступне:

encodeURIComponent(value).replace(/%20/g,'+');

escape реалізується по-різному в різних браузерах і encodeURI не кодує більшість символів, які функціонують в URI (наприклад, # і навіть /), - це зроблено для використання на повному URI / URL, не порушуючи його.

ПРИМІТКА: Ви використовуєте encodeURIComponent для цінності рядка запиту (не поля / значення імена і, безумовно, не весь URL). Якщо ви робите це іншим способом, він не буде кодувати такі символи, як =,?, &, Можливо залишити рядок запиту.

Приклад:

const escapedValue = encodeURIComponent(value).replace(/%20/g,'+');
const url = 'http://example.com/?myKey=' + escapedValue;

66
2017-12-15 08:47



Будь ласка, зверніть увагу, що після першого знака запитання (який є частиною URL-адреси запиту) слід замінити символ% 20 лише символами +. Скажімо, я хочу переглянути http://somedomain/this dir has spaces/info.php?a=this has also spaces. Це має бути перетворено на: http://somedomain/this%20dir%20has%spaces/info.php?a=this%20has%20also%20spaces але багато реалізацій дозволяють "% 20" у рядку запиту замінити на "+". Тим не менш, ви не можете замінити '% 20' на '+' у розділі шляху URL-адреси, це призведе до помилки не знайдено, якщо у вас немає каталогу з + замість простору. - Jochem Kuijpers
@ Джочем Куйджерс, точно, ви не поставите "+" в каталог. Я застосую це лише до самих значень параметрів запиту (або, якщо потрібно, ключів), а не до всієї URL-адреси чи навіть до всієї рядка запиту. - Ryan Taylor
Я б замінив значення, а не в результаті кодування - njzk2
@ njzk2, на жаль encodeURIComponent('+') дасть тобі %2B, тому вам доведеться використовувати два регулярних вирази ... Я думаю, що це добре, чому це працює, оскільки в кінці "+" є "" закодованими по-різному. - Ryan Taylor


Якщо ви використовуєте jQuery, я б пішов $.param метод Вона URL-адреса кодує поля зіставлення об'єктів у значеннях, які легше прочитати, ніж викликати метод виходу з кожного значення.

$.param({a:"1=2", b:"Test 1"}) // gets a=1%3D2&b=Test+1

35
2018-05-13 03:32



Я вважаю, що прикладу достатньо. Якщо вам потрібна додаткова інформація про $ .param на api.jquery.com/jquery.param - Maksym Kozlenko
Майже кожен використовує jQuery, і я відчуваю себе більш комфортно з цим, а не encoreURIComponent - Cyril Duchon-Doris


Для кодування URL-адреси, як було сказано раніше, у вас є дві функції:

encodeURI()

і

encodeURIComponent()

Причина існує і в тому, що перший зберігає URL-адресу з ризиком залишити надто багато речей, а другий кодує все необхідне.

По-перше, ви можете скопіювати нещодавно втілену URL-адресу в адресний рядок (наприклад), і вона буде працювати. Однак, якщо ваші невикористані "&" перешкоджатиме розмежувачам полів, '=' 'би перешкоджати іменам і значенням полів, а' + 'виглядали б як пробіли. Але для простих даних, коли ви хочете зберегти URL-код характеру того, що ви втечі, це працює.

Другий - все, що потрібно зробити, щоб переконатися, що ніщо в вашому рядку не вказує URL-адресу. Вона залишає різні неважливі символи, які не зникають, тому URL-адреса залишається максимально доступним для читання без перешкод. URL-адреса, кодована таким чином, більше не буде працювати як URL-адреса, не зникаючи її.

Тому, якщо ви можете взяти час, ви завжди хочете використовувати encodeURIComponent () - перед додаванням у назви / значення пари кодують ім'я та значення за допомогою цієї функції, перш ніж додавати його до рядка запиту.

Я стикаюся з причинами використовувати encodeURI () - я залишу це для розумних людей.


8
2018-01-26 21:31





encodeURIComponent () - це спосіб піти.

var myOtherUrl = "http://example.com/index.html?url=" + encodeURIComponent(myUrl);

АЛЕ слід мати на увазі, що існують невеликі відмінності від PHP-версії urlencode () і, як згадано @ CMS, кодування не буде кодувати кожен символ. Хлопці на http://phpjs.org/functions/urlencode/ зроблений js еквівалентний phpencode ():

function urlencode(str) {
  str = (str + '')
    .toString();

  // Tilde should be allowed unescaped in future versions of PHP (as reflected below), but if you want to reflect current
  // PHP behavior, you would need to add ".replace(/~/g, '%7E');" to the following.
  return encodeURIComponent(str)
    .replace(/!/g, '%21')
    .replace(/'/g, '%27')
    .replace(/\(/g, '%28')
    .
  replace(/\)/g, '%29')
    .replace(/\*/g, '%2A')
    .replace(/%20/g, '+');
}

7
2017-10-01 08:03





Подібна річ я спробував з нормальним JavaScript

function fixedEncodeURIComponent(str){
     return encodeURIComponent(str).replace(/[!'()]/g, escape).replace(/\*/g, "%2A");
}

4
2018-01-05 18:49





Щоб запобігти подвійному кодування, доцільно декодувати URL-адресу перед кодуванням (якщо ви маєте справу з, наприклад, введеними користувачем URL-адресами, які можуть бути вже закодовані).

Скажемо, що у нас є abc%20xyz 123 як вхід (один пробіл вже закодований):

encodeURI("abc%20xyz 123")            //   wrong: "abc%2520xyz%20123"
encodeURI(decodeURI("abc%20xyz 123")) // correct: "abc%20xyz%20123"

3
2018-06-22 03:28