跨域GET请求，浏览器和本地主机之间的差异进行调用

Cross-domain GET request, difference between browser and localhost making the call

本文关键字：之间 调用 主机 请求 GET 浏览器 跨域      更新时间：2023-09-26

我尝试从本地托管的流星应用程序(=> App running at: http://localhost:3000/)向API发出GET请求，并在这样做时得到错误:

"XMLHttpRequest无法加载[the-api-url]。请求的资源上没有'Access-Control-Allow-Origin'标头。因此，不允许访问原产地http://localhost:3000。"

然而，当我将[the- API -url]粘贴到浏览器中并按ENTER键时，相应的API响应显示在浏览器窗口中(一个小JSON对象)。我读过一些关于跨域请求问题的其他SO帖子，但我不明白解决方案，或者从我的代码或从浏览器发送GET之间的区别是什么。有人能解释为什么会发生这种行为，以及对我的代码/设计进行适当的更改吗?我现有的代码如下:

$.ajax({
  type: "get",
  url: auth_ad_act_url,
  data: {
    ads_token: ACCESS_TOKEN
  },
  dataType: 'jsonp',
  success: function(data, status) {
    console.log(data);
  }
});

编辑:我做了一个类型为"get"的jQuery.ajax()，提供了一个URL，参数对象和成功回调函数，数据类型为"jsonp"来处理跨域请求。

我发布了新的代码。现在的错误是响应不正确。(我知道这一点，因为它在我的浏览器中工作，并且响应者与API文档对齐)。响应是"资源解释为脚本，但传输MIME类型文本/html: https://host.com/apps/[my-app-id]/authorize_ad_account?callbac…"，但它应该是一个对象的关键'url'和另一件事。当我包含'jsonp'时，我也得到错误"Uncaught SyntaxError: Unexpected token:"。但是上面提到的不正确的响应仍然被记录到控制台，所以我不明白语法错误何时发生，或者在哪里。

同源策略不包括您在地址栏中键入的内容。如果它这样做，你将无法访问任何网站，除非它保存在您的本地机器上!

在您的情况下，为了从jQuery的get中获取所需的资源，您要么需要使用托管在匹配域上的服务器端代理，要么因为您正在使用JSON，请查看您使用的API是否支持JSONP。

有可能获得JSON数据与跨域请求。您必须使用JSONP并定义一个回调方法，该方法必须在调用和JSON数据中。

你的请求: 

$.ajax({
    type: "GET",
    url: auth_ad_act_url + "&callback=?",
    jsonpCallback: "jsonCallback",
    dataType: "jsonp",
    success: function(data) {
        // Do something with the data
    }
)};

外部服务器的JSON文件:

jsonCallback(INSERT_HERE_THE_JSON_DATA);

如果您无法在外部服务器上添加jsonCallback，请查看CORS。

相关文章：