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

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

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

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

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

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

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

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

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

В другом месте есть хороший объяснение разницы между encodeURI() и encodeURIComponent(). Если вы хотите что-то закодировать, чтобы его можно было безопасно включить в качестве компонента URI (например, в качестве параметра строки запроса), вы хотите использовать 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;
            }
        }
    });
});

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

Лучший ответ - использовать encodeURIComponent на значения в строке запроса (и нигде больше).

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

const value = encodeURIComponent(value).replace('%20','+');
const url = 'http://example.com?lang=en&key=' + value

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

И как @Jochem указывает ниже, вы можете использовать encodeURIComponent() для (каждого) имени папки, но по какой-то причине эти API, похоже, не хотят, чтобы + в именах папок, поэтому простой старый encodeURIComponent отлично работает.

Пример:

const escapedValue = encodeURIComponent(value).replace('%20','+');
const escapedFolder = encodeURIComponent('My Folder'); // no replace
const url = `http://example.com/${escapedFolder}/?myKey=${escapedValue}`;

Я бы посоветовал использовать пакет qs npm

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

его проще использовать с объектом JS, и он дает вам правильную кодировку URL для всех параметров

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

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

Подобные вещи я пробовал с обычным javascript

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

Кодировать строку 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.info(encodedUrl);
//outputs folder%2Findex.html%3Fparam%3D%2323dd%26noob%3Dyes


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

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('!', '%21')
    .replace('\'', '%27')
    .replace('(', '%28')
    .replace(')', '%29')
    .replace('*', '%2A')
    .replace('%20', '+');
}

Вы можете использовать библиотеку 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

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

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

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

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

encodeURI()

и

encodeURIComponent()

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Пример и предостережения:

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

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

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

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

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

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

Вот ЖИВАЯ ДЕМО встроенных функций encodeURIComponent() и decodeURIComponent() JS:

<!DOCTYPE html>
<html>
  <head>
    <style>
      textarea{
        width:30%;
        height:100px;
      }
    </style>
    <script>
      // encode string to base64
      function encode()
      {
        var txt = document.getElementById("txt1").value;
        var result = btoa(txt);
        document.getElementById("txt2").value = result;
      }
      // decode base64 back to original string
      function decode()
      {
        var txt = document.getElementById("txt3").value;
        var result = atob(txt);
        document.getElementById("txt4").value = result;
      }
    </script>
  </head>
  <body>
    <div>
      <textarea id = "txt1">Some text to decode
      </textarea>
    </div>
    <div>
      <input type = "button" id = "btnencode" value = "Encode" onClick = "encode()"/>
    </div>
    <div>
      <textarea id = "txt2">
      </textarea>
    </div>
    <br/>
    <div>
      <textarea id = "txt3">U29tZSB0ZXh0IHRvIGRlY29kZQ==
      </textarea>
    </div>
    <div>
      <input type = "button" id = "btndecode" value = "Decode" onClick = "decode()"/>
    </div>
    <div>
      <textarea id = "txt4">
      </textarea>
    </div>
  </body>
</html>

Используйте функцию fixedEncodeURIComponent, чтобы строго соблюдать RFC 3986:

function fixedEncodeURIComponent(str) {
  return encodeURIComponent(str).replace(/[!'()*]/g, function(c) {
    return '%' + c.charCodeAt(0).toString(16);
  });
}

Элегантный способ

По моему скромному мнению, самый элегантный способ кодирования параметров запроса - это создать объект с такими параметрами, как

const queryParams = { param1: 'value1', param2: 'value2' }

а затем закодируйте его, используя:

const queryString = new URLSearchParams(queryParams).toString()

как упоминалось в этом ответе: https://stackoverflow.com/a/53171438/7284582

Вы не должны использовать encodeURIComponent() напрямую.

Взгляните на RFC3986: Uniform Resource Identifier (URI): Generic Syntax

sub-delims = "!" / "$" / "&" / "'" / "(" / ")" / "*" / "+" / "," / ";" / " = "

The purpose of reserved characters is to provide a set of delimiting characters that are distinguishable from other data within a URI.

Эти зарезервированные символы из определения URI в RFC3986 НЕ экранируются encodeURIComponent().

Веб-документы MDN: encodeURIComponent ()

To be more stringent in adhering to RFC 3986 (which reserves !, ', (, ), and *), even though these characters have no formalized URI delimiting uses, the following can be safely used:

Используйте функцию MDN Web Docs ...

function fixedEncodeURIComponent(str) {
  return encodeURIComponent(str).replace(/[!'()*]/g, function(c) {
    return '%' + c.charCodeAt(0).toString(16);
  });
}

Представление

Сегодня (2020.06.12) я провожу тест скорости выбранных решений на MacOs HighSierra 10.13.6 в браузерах Chrome 83.0, Safari 13.1, Firefox 77.0. Эти результаты могут быть полезны для массового кодирования URL-адресов.

Выводы

• encodeURI (B) кажется самым быстрым, но это не рекомендуется для url-ов
• escape (A) - быстрое кросс-браузерное решение
• решение F, рекомендованное MDN, является средне быстрым
• решение D самое медленное

Подробности

Для решений АBCDEF Я провожу два теста

• для короткого url - 50 символов - можно запустить ЗДЕСЬ
• для длинного url - 1M char - можно запустить ЗДЕСЬ

function A(url) {
	return escape(url);
}

function B(url) {
	return encodeURI(url);
}

function C(url) {
	return encodeURIComponent(url);
}

function D(url) {
	return new URLSearchParams({url}).toString();
}

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

function F(url) {
  return encodeURIComponent(url).replace(/[!'()*]/g, function(c) {
    return '%' + c.charCodeAt(0).toString(16);
  });
}



// ----------
// TEST
// ----------

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

[A,B,C,D,E,F]
  .forEach(f=> console.info(`${f.name} ?url=${f(myUrl).replace(/^url=/,'')}`));

This snippet only presents code of choosen solutions

Примеры результатов для Chrome

var myOtherUrl = 
   "http://example.com/index.html?url = " + encodeURIComponent(myUrl).replace(/%20/g,'+');

Не забудьте флаг / g, чтобы заменить все закодированные ''

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

function urlEncode(text) {
    encoded = '';
    for (let char of text) {
        encoded += '%' + char.charCodeAt(0).toString(16);
    }
    return encoded;
}