Вопрос: Кодировать 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переменная на этой второй строке?


2100


источник


Ответы:


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

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

2472



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

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

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

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

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

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


1364



Придерживайтесь encodeURIComponent(), Функция encodeURI()не требует кодирования многих символов, имеющих семантическое значение в URL-адресах (например, «#», «?» и «&»). escape()устарел и не хочет кодировать символы «+», которые будут интерпретироваться как закодированные пробелы на сервере (и, как указывается другими здесь, неправильно кодирует URL-символы, отличные от ASCII).

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


153



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

65



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

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

35



To encode a URL, as has been said before, you have two functions:

encodeURI()

and

encodeURIComponent()

The reason both exist is that the first preserves the URL with the risk of leaving too many things unescaped, while the second encodes everything needed.

With the first, you could copy the newly escaped URL into address bar (for example) and it would work. However your unescaped '&'s would interfere with field delimiters, the '='s would interfere with field names and values, and the '+'s would look like spaces. But for simple data when you want to preserve the URL nature of what you are escaping, this works.

The second is everything you need to do to make sure nothing in your string interfers with a URL. It leaves various unimportant characters unescaped so that the URL remains as human readable as possible without interference. A URL encoded this way will no longer work as a URL without unescaping it.

So if you can take the time, you always want to use encodeURIComponent() -- before adding on name/value pairs encode both the name and the value using this function before adding it to the query string.

I'm having a tough time coming up with reasons to use the encodeURI() -- I'll leave that to the smarter people.


8



encodeURIComponent() is the way to go.

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

BUT you should keep in mind that there are small differences from php version urlencode() and as @CMS mentioned, it will not encode every char. Guys at http://phpjs.org/functions/urlencode/ made js equivalent to 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



Similar kind of thing I tried with normal javascript

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

4



To prevent double encoding it's a good idea to decode the url before encoding (if you are dealing with user entered urls for example, which might be already encoded).

Lets say we have abc%20xyz 123 as input (one space is already encoded):

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

3



Nothing worked for me. All I was seeing was the HTML of the login page, coming back to the client side with code 200. (302 at first but the same Ajax request loading login page inside another Ajax request, which was supposed to be a redirect rather than loading plain text of the login page).

In the login controller, I added this line:

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

And in the global Ajax handler, I did this:

$(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;
            }
        }
    });
});

Now I don't have any issue, and it works like a charm.


2



Encode URL String

    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

1



You can use esapi library and encode your url using the below function. The function endures that '/' are not lost to encoding while the remainder of the text contents are encoded:

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


0