什么是URL编码：

当URL中有特殊字符时，应对URL进行编码。例如：

console.log（encodeURIComponent（'？notEncoded=&+'））；

我们可以在这个例子中观察到，除了字符串notEncoded之外的所有字符都用%符号编码。URL编码也称为百分比编码，因为它用%转义所有特殊字符。然后在这个%符号之后，每个特殊字符都有一个唯一的代码

为什么我们需要URL编码：

某些字符在URL字符串中具有特殊值。例如？字符表示查询字符串的开头。为了在web上成功定位资源，必须区分字符是字符串的一部分还是URL结构的一部分。

如何在JavaScript中实现URL编码：

JavaScript提供了一系列内置实用程序函数，我们可以使用这些函数轻松地对URL进行编码。有两个方便的选项：

encodeURIComponent（）：将URI的一个组件作为参数，并返回编码的URI字符串。encodeURI（）：将URI作为参数并返回编码的URI字符串。

示例和警告：

注意不要将整个URL（包括方案，例如https://）传递到encodeURIComponent（）中。这实际上可以将其转换为不起作用的URL。例如：

//对于整个URI，不要使用encodeURIComponent，它将转换///字符和URL不能正常工作console.log（encodeURIComponent（“http://www.random.com/specials&char.html"));//而是对整个URL使用encodeURIconsole.log（encodeURI（“http://www.random.com/specials&char.html"));

我们可以观察到，如果我们将整个URL放在encodeURIComponent中，正斜杠（/）也会转换为特殊字符。这将导致URL不再正常运行。

因此（顾名思义）使用：

encodeURIComponent位于要编码的URL的特定部分。要编码的整个URL上的encodeURI。

最好的答案是对查询字符串中的值使用encodeURIComponent（而不是其他）。

然而，我发现许多API都想用“+”替换“”，所以我不得不使用以下方法：

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

escape在不同浏览器中的实现方式不同，encodeURI不编码许多字符（如#和甚至/）——它可以在完整的URI/URL上使用，而不会破坏它——这并不是非常有用或安全的。

正如@Jochem在下面指出的，您可能希望在（每个）文件夹名称上使用encodeURIComponent（），但无论出于什么原因，这些API似乎不希望在文件夹名称中使用+，所以普通的encodeURIComponents非常有用。

例子：

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

它更容易与JavaScript对象一起使用，并且为所有参数提供了正确的URL编码。

如果您使用jQuery，我会使用$.param方法。它对一个对象进行URL编码，将字段映射到值，这比对每个值调用转义方法更容易读取。

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

不要忘记用/g标志替换所有编码的“”

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

我总是用这个来编码URL。这是完全安全的，因为它将对每个字符进行编码，即使它不必进行编码。

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

坚持使用encodeURIComponent（）。函数encodeURI（）不需要对URL中具有语义重要性的许多字符进行编码（例如“#”、“？”和“&”）。escape（）已被弃用，并且不必对“+”字符进行编码，因为这些字符将在服务器上被解释为已编码的空格（正如其他人在这里指出的，不正确地对非ASCII字符进行URL编码）。

其他地方对encodeURI（）和encodeURIComponent（）之间的区别有很好的解释。如果您希望对某个内容进行编码，以便它可以安全地作为URI的一个组件（例如作为查询字符串参数）包含，则需要使用encodeURIComponent（）。