строки Кодировать URL-адрес в JavaScript?




кодирование js (11)

Как вы безопасно кодируете URL-адрес с помощью JavaScript, чтобы его можно было помещать в строку GET?

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

Я предполагаю, что вам нужно кодировать переменную myUrl на этой второй строке?


Проверьте встроенную функцию encodeURIComponent(str) и encodeURI(str) .
В вашем случае это должно работать:

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

Чтобы кодировать URL-адрес, как было сказано ранее, у вас есть две функции:

encodeURI()

а также

encodeURIComponent()

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

Во-первых, вы можете скопировать недавно экранированный URL-адрес в адресную строку (например), и это сработает. Однако ваши unescaped '&' будут вмешиваться в полевые разделители, '=' будут мешать именам полей и значениям, а «+» будут выглядеть как пробелы. Но для простых данных, когда вы хотите сохранить природу URL-адреса того, что вы ускользаете, это работает.

Во-вторых, все, что вам нужно сделать, чтобы убедиться, что ничто в вашей строке не связано с URL-адресом. Он оставляет различные несущественные символы незанятыми, чтобы URL-адрес оставался максимально понятным для человека без помех. URL-адрес, закодированный таким образом, больше не будет работать как URL-адрес, не отменив его.

Поэтому, если вы можете потратить время, вы всегда хотите использовать encodeURIComponent () - перед добавлением пар имя / значение кодируйте имя и значение с помощью этой функции, прежде чем добавлять их в строку запроса.

Мне сложно найти причины использования encodeURI () - я оставлю это более умным людям.


Что такое кодировка URL:

URL-адрес должен быть закодирован, если в URL есть специальные символы. Например:

console.log(encodeURIComponent('?notEncoded=&+'));

В этом примере мы можем наблюдать, что все символы, кроме строки notEncoded , кодируются notEncoded %. URL-кодирование также известно как процентное кодирование, потому что оно пропускает все специальные символы с%. Затем после этого знака% каждый специальный символ имеет уникальный код

Зачем нужна кодировка URL:

Определенные символы имеют особое значение в строке URL. Например,? символ обозначает начало строки запроса. Чтобы успешно найти ресурс в Интернете, необходимо различать, когда символ подразумевается как часть строки или части структуры URL-адреса.

Как мы можем добиться кодировки URL в JS:

JS предлагает кучу встроенной функции полезности, которую мы можем использовать для простого кодирования URL-адресов. Это два удобных варианта:

  1. encodeURIComponent() : принимает компонент URI в качестве аргумента и возвращает кодированную строку URI.
  2. encodeURI() : принимает URI в качестве аргумента и возвращает кодированную строку URI.

Пример и оговорки:

Помните, что не передавайте весь URL (включая схему, например https: //) в encodeURIComponent() . Это может фактически превратить его в недействительный URL. Например:

// for a whole URI don't use encodeURIComponent it will transform
// the / characters and the URL won't fucntion properly
console.log(encodeURIComponent("http://www.random.com/specials&char.html"));

// instead use encodeURI for whole URL's
console.log(encodeURI("http://www.random.com/specials&char.html"));

Мы можем заметить, что мы поместили весь URL-адрес в encodeURIComponent , чтобы слэш-черты foward (/) также были преобразованы в специальные символы. Это приведет к тому, что URL-адрес не будет функционировать должным образом.

Поэтому (как следует из названия) используйте:

  1. encodeURIComponent на определенной части URL-адреса, который вы хотите кодировать.
  2. encodeURI на весь URL, который вы хотите кодировать.

Stick с developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/… . Функция developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/… не требует кодирования многих символов, имеющих смысловое значение в URL-адресах (например, «#», «?» И «&»). escape() устарел и не удосуживается кодировать символы «+», которые будут интерпретироваться как закодированные пробелы на сервере (и, как указано другими здесь, неправильно кодирует URL-символы, отличные от ASCII).

Существует хорошее объяснение разницы между encodeURI() и encodeURIComponent() другом месте. Если вы хотите что-то закодировать, чтобы его можно было включить в качестве компонента URI (например, в качестве параметра строки запроса), вы хотите использовать encodeURIComponent() .


Чтобы предотвратить двойное кодирование, рекомендуется декодировать url перед кодированием (если вы имеете дело с введенными пользователем URL-адресами, например, которые могут быть уже закодированы).

Допустим, у нас есть abc%20xyz 123 как вход (одно пространство уже закодировано):

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

Вы можете использовать библиотеку esapi и закодировать свой url, используя следующую функцию. Функция терпит, что '/' не теряются для кодирования, пока остальная часть текстового содержимого закодирована:

function encodeUrl(url)
{
    String arr[] = url.split("/");
    String encodedUrl = "";
    for(int i = 0; i<arr.length; i++)
    {
        encodedUrl = encodedUrl + ESAPI.encoder().encodeForHTML(ESAPI.encoder().encodeForURL(arr[i]));
        if(i<arr.length-1) encodedUrl = encodedUrl + "/";
    }
    return url;
}

https://www.owasp.org/index.php/ESAPI_JavaScript_Readme


Если вы используете jQuery, я бы пошел на метод $.param . Этот URL-адрес кодирует поля сопоставления объектов для значений, которые легче читать, чем вызов метода escape для каждого значения.

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

У вас есть три варианта:

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

  • encodeURI() не будет кодировать: [email protected]#$&*()=:/,;?+'

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

Но в вашем случае, если вы хотите передать URL в параметр GET другой страницы, вы должны использовать escape или encodeURIComponent , но не encodeURI .

См. Вопрос «Переполнение стека». Лучшая практика: escape или encodeURI / encodeURIComponent для дальнейшего обсуждения.


Ничто не сработало для меня. Все, что я видел, это HTML-страница входа в систему, возвращающаяся на клиентскую сторону с кодом 200. (302 сначала, но тот же Ajax-запрос, загружающий страницу входа в другой Ajax-запрос, который должен был быть перенаправлением, а не загрузкой простого текст страницы входа в систему).

В контроллере входа я добавил эту строку:

Response.Headers["land"] = "login";

И в глобальном обработчике Ajax я сделал это:

$(function () {
    var $document = $(document);
    $document.ajaxSuccess(function (e, response, request) {
        var land = response.getResponseHeader('land');
        var redrUrl = '/login?ReturnUrl=' + encodeURIComponent(window.location);
        if(land) {
            if (land.toString() === 'login') {
                window.location = redrUrl;
            }
        }
    });
});

Теперь у меня нет никаких проблем, и это работает как шарм.


Лично я считаю, что многие 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;

Кодировать строку URL

    var url = $(location).attr('href'); //get current url
    //OR
    var url = 'folder/index.html?param=#23dd&noob=yes'; //or specify one

var encodedUrl = encodeURIComponent(url);
console.log(encodedUrl);
//outputs folder%2Findex.html%3Fparam%3D%2323dd%26noob%3Dyes


for more info go http://www.sitepoint.com/jquery-decode-url-string




encoding