JS中如何在URL传递多个ID参数并解决URL过长问题

你当前采用GET请求传参方式，将序列化后的ID列表直接拼接在URL中传输。主流浏览器、服务器对URL长度普遍限制在2KB~8KB区间，500个ID很容易超出长度上限，最终导致请求失败。

• 方案1：改用POST请求传参（最推荐）
  将ID参数放到POST请求的请求体中传输，POST请求没有严格的长度限制，完全可以承载500个ID的传输需求。参考代码如下：

var setData = this.view.data;
// 可直接用数组map方法替换lodash的each，写法更简洁
var setIds = setData.map(data => data.id);
var postData = JSON.stringify({
  setList: setIds 
});

fetch("/framework/servlet.jsp?activity=SetPreview&action=export", {
  method: "POST",
  headers: {
    "Content-Type": "application/json"
  },
  body: postData
}).then(res => {
  // 导出场景可直接处理返回的二进制流实现下载
  if (res.ok) return res.blob();
  throw new Error("导出请求异常");
}).then(blob => {
  // 本地生成下载链接触发下载
  const downloadUrl = window.URL.createObjectURL(blob);
  const downloadLink = document.createElement('a');
  downloadLink.href = downloadUrl;
  downloadLink.download = '导出文件.xlsx'; // 替换为实际业务需要的文件名和后缀
  document.body.appendChild(downloadLink);
  downloadLink.click();
  window.URL.revokeObjectURL(downloadUrl);
  document.body.removeChild(downloadLink);
}).catch(err => {
  console.error("导出失败：", err);
});

该方案需要后端配合调整，从POST请求体中读取JSON格式参数，不再从URL query参数中取值。

• 方案2：临时兼容方案（无需调整后端接口）
  如果你暂时无法修改后端的参数接收逻辑，可以优化参数拼接格式，减少无效字符占用，一定程度压缩URL长度：

var setData = this.view.data;
// 直接将ID用逗号拼接，省去JSON序列化的额外符号占用
var setIdsStr = setData.map(data => data.id).join(',');
// 必须对参数值做URI转义，避免特殊字符导致参数解析异常
var url =  "/framework/servlet.jsp?activity=SetPreview&action=export&setList=" + encodeURIComponent(setIdsStr);

注意：该方案仅能缓解URL过长问题，如果ID本身长度大、数量多，仍然可能超出长度限制，仅适合临时过渡使用。

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