在 URL 上设置参数时对特殊字符进行编码

Question

我需要设置一些URL参数，其中还需要包含一个特殊字符

$

目前我正在使用

.set()

来创建和设置这些参数值：

const myUrl = new URL("http://www.example.com/?");

let params = new URLSearchParams();
params.set('$param1', '60');
params.set('$param2', '100');

我知道我需要使用

encodeURI()

来确保我在 URL 中获得

$

而不是

%24

- 但我在什么阶段执行此操作？

如果我在字符串化并将参数添加到 URL 时执行此操作，它们已经被转换。

myUrl.search = encodeURI(params.toString());
// Outputs: http://www.example.com/?%24param1=60&%24param2=100
// Desired: http://www.example.com/?$param1=60&$param2=100

Answer 1

在您的情况下，

$

字符被编码为

%24

，因为它是URL中的保留字符。

URLSearchParams

对象的

set

方法会自动对这些字符进行编码，以确保生成的字符串是有效的 URL。

但是，如果您想按原样包含

$

字符，您可以通过手动构造查询字符串来绕过自动编码：

const myUrl = new URL("http://www.example.com/?");

let params = ['$param1=60', '$param2=100'].join('&');

myUrl.search = params;

console.log(myUrl.toString());
// Outputs: http://www.example.com/?$param1=60&$param2=100

这将为您提供所需的输出，但请注意，根据 URL 规范，这可能不是有效的 URL，因为

$

是保留字符。这可能会导致某些服务器或 API 出现问题。

如果您控制与之交互的服务器或 API，并且您确定它可以处理查询字符串中带有

$

字符的 URL，那么这种方法应该可行。否则，坚持使用

URLSearchParams

提供的自动编码通常更安全。

请确认此解决方案是否适合您或您是否需要进一步帮助。