如何阻止URL.toString()方法对加号(+)符号进行转义处理

核心原因 #

URLSearchParams 遵循URI编码标准，会将参数值内的字面量+自动转义为%2B：因为查询参数场景中+默认是空格的编码标识，API会对传入的参数值做全量转义避免语义冲突，因此直接传入+拼接的字符串必然会被转义。

最优适配方案（贴合谷歌搜索场景） #

你需要的谷歌搜索参数+分隔效果，本质就是搜索关键词之间的空格被编码为+，完全可以通过标准API的默认行为实现：用空格拼接关键词数组后再传入searchParams.set，API会自动将空格编码为+，不需要额外处理：

function getQueryUrl(array) {
  // 用空格拼接关键词数组
  const urlParamsString = array.join(" ");
  const url = new URL(window.location);
  url.searchParams.set("query", urlParamsString);
  return url.toString();
}

通用自定义拼接方案 #

如果你的场景确实需要在参数值中使用字面量+而非空格的编码，可以手动拼接查询参数段绕开searchParams的自动转义逻辑，注意自行保证数组元素已经做了必要的URI编码避免参数异常：

function getQueryUrl(array) {
  const url = new URL(window.location);
  // 先移除已存在的同名参数避免冲突
  url.searchParams.delete("query");
  const queryValue = array.join("+");
  const prefix = url.search ? "&" : "?";
  return `${url.toString()}${prefix}query=${queryValue}`;
}

内容的提问来源于stack exchange，提问作者Selbi