如何正确地将 URL 参数添加到 AJAX 数据对象？答案

【问题标题】：How do you properly add URL parameters to an AJAX data object?如何正确地将 URL 参数添加到 AJAX 数据对象？
【发布时间】：2016-02-13 01:36:42
【问题描述】：

我遇到了一个我似乎无法弄清楚的奇怪问题。我的应用程序使用 AJAX 来访问 JSON 并检索数据。我正在使用平台的内置参数支持过滤category 和tag。所以我的格式（有效）如下所示：

示例（工作）：

$.ajax({
  url: "http://blog.squarespace.com/blog", 
  data: {format:"json",tag:"mobile"}, 
  dataType: "json", 
  method: "GET"
}).done(function(data){ console.log(data) });

记录的数据：

Object {website: Object, websiteSettings: Object, collection: Object, template: Object, shoppingCart: Object…}
calendarView: false
collection: Object
empty: false
emptyFolder: false
items: Array[1]
shareButtons: Object
shoppingCart: Object
showCart: false
tagFilter: "mobile"
template: Object
website: Object
websiteSettings: Object
__proto__: Object

在上面，您可以看到它检索到一个 items 数组，因为存在一个帖子。

当我点击使用多个单词或非字母字符的类别/标签时会出现问题。

AJAX 请求示例（不工作）：

$.ajax({
  url: "http://blog.squarespace.com/blog", 
  data: {format:"json",tag:"Lee%20and%20Morris"}, 
  dataType: "json", 
  method: "GET"
}).done(function(data){ console.log(data) });

Object {website: Object, websiteSettings: Object, collection: Object, template: Object, shoppingCart: Object…}
calendarView: false
collection: Object
empty: false
emptyFolder: false
shareButtons: Object
shoppingCart: Object
showCart: false
tagFilter: "Lee%20and%20Morris"
template: Object
website: Object
websiteSettings: Object
__proto__: Object

您只需访问浏览器中的 URL，即可确认此位置是否有帖子：http://blog.squarespace.com/?format=json&tag=Lee%20and%20Morris

在尝试调试后，我还发现通过附加标记参数并点击该 URL，它可以按预期工作。

示例（工作）：

$.ajax({
  url: "http://blog.squarespace.com/blog?tag=Lee%20and%20Morris", 
  data: {format:"json"}, 
  dataType: "json", 
  method: "GET"
}).done(function(data){ console.log(data) });

calendarView: false
collection: Object
empty: false
emptyFolder: false
items: Array[1]
shareButtons: Object
shoppingCart: Object
showCart: false
tagFilter: "Lee%20and%20Morris"
template: Object
website: Object
websiteSettings: Object
__proto__: Object

所以我的问题是为什么在使用 data 对象时这不起作用，但在其他方面工作正常？

【问题讨论】：

我相信 jQuery 默认对值进行编码。如果你使用 data: {format:"json",tag:"Lee and Morris"}, 会发生什么？
“发送错误代码”是什么意思？
感谢 Felix King 看起来就是这样。我正在检查我必须调整的内容。但是如果字符串已经被编码，那还不够好吗？我不太明白为什么会出现问题。
@jasonbarone：好吧，如果你对数据进行双重编码，那么你会告诉服务器从字面上寻找Lee%20and%20Morris（即包括%20！）而不是Lee and Morris。跨度>
有道理，如果你想抛出一个答案，我可以关闭它。再次感谢！

标签： javascript jquery json ajax xmlhttprequest

【解决方案1】：

根据 Felix King 的评论，我的问题是由于 jQuery 为您编码数据对象字符串。通过简单地使用未编码的字符串执行请求，我的问题就解决了。

$.ajax({
  url: "http://blog.squarespace.com/blog", 
  data: {format:"json",tag:"Lee and Morris"}, 
  dataType: "json", 
  method: "GET"
}).done(function(data){ console.log(data) });

【讨论】：