通过 AJAX 调用 API答案

【问题标题】：API call over AJAX通过 AJAX 调用 API
【发布时间】：2018-03-06 13:37:37
【问题描述】：

我是 AJAX 新手，我想通过 this API 生成密码。我想使用 AJAX，但不知道如何以及在哪里指定参数。

$.ajax({
    url: 'https://passwordwolf.com/?length=10&upper=off&lower=off&special=off&exclude=012345&repeat=5',
    dataType: "text json",
    type: "POST",
    data: {upper: off, lower: on, special: off},
    success: function(jsonObject,status) {

        console.log("function() ajaxPost : " + status);

    }
});

非常感谢，请不要讨厌我的编程技能！

【问题讨论】：

这取决于您调用的 API 是否希望在查询字符串（即 URL 的一部分）或请求正文（即通过 data 选项包含）中发送变量。你需要先检查一下，然后你就会知道该怎么做。
@ADyson 通过查看 URL，我可以判断它必须在 URL 中，然后我可以省略 data: part 吗？
是的。还要检查 API 要求您使用哪种 HTTP 方法（即 GET 或 POST 或 PUT 或 DELETE）。如果您使用 ajax 跨域，您还需要验证它是否支持 CORS - 如果不支持，则 ajax 请求将不起作用。
另外，在访问了上面的 URL，这是一个专供用户查看的 HTML 页面，它建议使用不同的 API 链接以获取机器可读 JSON 格式的数据 - https://passwordwolf.com/api/?upper=off&lower=off&special=off&length=10&exclude=012345&repeat=5 是调用实际 API 的正确 URL。它应该通过 GET 完成（因为我能够将 URL 粘贴到浏览器栏中并从那里运行它，这总是会导致 GET）
但是，正如这里演示的那样：jsfiddle.net/5a2xayy2 API 不支持 CORS（请参阅浏览器控制台中的错误）。因此，您必须从非 ajax 上下文中提出请求，或者使用下面答案中显示的解决方法。

标签： javascript jquery json ajax get

【解决方案1】：

看看他们的 API：

您应该使用GET 方法，而不是POST。
网址应为https://passwordwolf.com/api/（注意末尾的/api）。
此外，passwordwolf 不接受 CORS，因此您应该从服务器端调用该服务并使用 appropriate CORS headers 将其镜像到您的前端。

参见下面的演示（它使用 cors-anywhere 来规避 CORS 问题）。

还展示了如何正确使用对象设置参数。

var CORS = 'https://cors-anywhere.herokuapp.com/';

$.ajax({
  url: CORS + 'https://passwordwolf.com/api/',
  dataType: "json",
  type: "GET",
  data: {
    length: 10,
    upper: "off",
    lower: "off",
    special: "off",
    exclude: "012345",
    repeat: 5
  },
  success: function(jsonObject, status) {
    console.log("ajax result: " + JSON.stringify(jsonObject));
  }
});

&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;

【讨论】：