如何将数组作为 URL 参数传递？答案

【问题标题】：How to pass an array as a URL parameter?如何将数组作为 URL 参数传递？
【发布时间】：2017-03-22 10:39:01
【问题描述】：

我想传递一个数组并作为 URL 参数添加到我的页面上的链接，因为稍后在服务器端我需要数组中的值。我该怎么做？

myArray = ['aaa', 'bbb', 'ccc'];

$('#myLink').attr({"href" : '/myLink?array=' + myArray});

我不确定这样做是否正确？

【问题讨论】：

“我应该怎么做？” 这实际上取决于您使用的服务器端语言以及它希望如何格式化数据。例如。服务器是否期望 JSON？还是每个值的参数？逗号分隔的值列表？还有什么？
由于你使用的是jQuery，你可以试试$.param({ array: myArray }, true);
答案是你不能，不是用 Javascript。你最终得到的所有解决方案实际上都不会是你会通过的东西。你可以做的是传递一个类似参数的数组，然后用你的服务器端语言返回。为什么你仍然需要传递整个数组？
@FelixKling 我在服务器端使用 laravel
stackoverflow.com/questions/18417265/…查看以上链接。

标签： javascript jquery laravel

【解决方案1】：

我的做法：

var myArray = ['aaa', 'bbb', 'ccc'];
var baseUrl = '/myLink';
var paramName = 'array=';

var arrayAsString = '?' + paramName + myArray.join('&' + paramName);
var urlWithParams = baseUrl + arrayAsString;

window.location.href = urlWithParams;

【讨论】：

【解决方案2】：

如何将字符串数组作为 URL 参数传递：

const myLink = 'https:/example.com/api'
const myArray = ['aaa', 'bbb', 'ccc'];
let apiUrl = `${myLink}/query?`;

myArray.forEach((x, i) => {
  if (i === 0) {
    apiUrl += `array=${x}`;
  } else {
    apiUrl += `&array=${x}`;
  }
});

console.log(apiUrl);
document.body.innerHTML = apiUrl;

【讨论】：

【解决方案3】：

我会采用这种方法，

var myArray = ['aaa', 'bbb', 'ccc', ];

var myArrayQry = myArray.map(function(el, idx) {
    return 'myArray[' + idx + ']=' + el;
}).join('&');

// myArray[0]=aaa&myArray[1]=bbb&myArray[2]=ccc

然后，我在服务器端检索 URL 查询参数作为数组。

【讨论】：

【解决方案4】：

它不应该依赖于服务器端：根据URI标准规范，所有参数必须有一个名称并且应该有一个值。但是可以有多个同名的参数，这才是序列化数组的正确方式：

http://server/context?array=aaa&array=bbb&array=ccc&otherparameter=x

你可以这样做：

var s="";
for (var i=0;i< myArray.length;i++)
{
  s+="&myArray="+myArray[i];
}
var url="http://server/context?"+s;

【讨论】：

这个不错但需要将s+="&myArray="+myArray[i];编辑为s+="&myArray[]="+myArray[i];
@megyptm 不，一点也不。我的方法将为名为“myArray”的参数生成多个值。正如你所说，它是一个名为“myArray[]”的参数。
为什么不使用URLSearchParams？使用方法 .append 和 .toString

【解决方案5】：

您可以序列化 JSON：

myArray = ['aaa', 'bbb', 'ccc'];
var arrStr = encodeURIComponent(JSON.stringify(myArray));
$('#myLink').attr({ href: '/myLink?array=' + arrStr });

如果您的解析（在下一页）也是通过 JavaScript 完成的，那么您将反过来使用 JSON.parse()。在 PHP 中，它将是 json_decode()。

【讨论】：

"encodeURIComponent" 是标准的js函数吗？
@rezaakhlaghi：是的，见developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…

【解决方案6】：

试试这个

$('#myLink').attr({"href" : '/myLink?array=' + myArray.join(',')});

在服务器上：捕获和拆分数据。

【讨论】：

干净优雅的方式来实现这一点。