当前位置: 首页 > 面试题库 >

AJAX请求获取“所请求的资源上不存在'Access-Control-Allow-Origin'标头”错误

姚昊焱
2023-03-14
问题内容

我尝试GET在jQuery AJAX请求中发送请求。

$.ajax({
    type: 'GET',
    url: /* <the link as string> */,
    dataType: 'text/html',
    success: function() { alert("Success"); },
    error: function() { alert("Error"); },
});

但是,无论我尝试过什么, XMLHttpRequest cannot load <page>. No 'Access-Control-Allow- Origin' header is present on the requested resource. Origin 'http://localhost:7776' is therefore not allowed access.

我尝试了所有操作,从使用AJAX而不是jQuery 添加header : {}定义到AJAX请求,甚至设置dataType为,甚至下载了一个启用CORS的插件-但没有任何帮助。JSONP``text/plain

如果我尝试访问任何其他站点,也会发生同样的情况。

有任何适当且简单解决方案的想法吗?有没有?


问题答案:

这是设计使然。您不能使用XMLHttpRequest向另一台服务器发出任意HTTP请求,除非该服务器通过为请求主机放置Access-Control-
Allow-Origin标头来允许它。

https://developer.mozilla.org/zh-
CN/docs/Web/HTTP/Access_control_CORS

您可以在script标记中检索它(对脚本,图像和样式表没有相同的限制),但是除非返回的内容是脚本,否则它不会给您带来什么好处。

这是有关CORS的教程:

http://www.bennadel.com/blog/2327-cross-origin-resource-sharing-cors-ajax-
requests-between-jquery-and-node-
js.htm

这样做都是为了保护最终用户。假设一个图像实际上是一个图像,一个样式表只是一个样式表,而一个脚本只是一个脚本,向另一台服务器请求这些资源并不会真正造成任何危害。

但总的来说,跨域请求可能会做的不好。假设您Zoltan正在使用coolsharks.com。还要说您已经登录到mybank.com,并且浏览器中有一个mybank.com的cookie。现在,假设coolsharks.com向mybank.com发送了AJAX请求,要求将您的所有资金转入另一个帐户。因为您存储了mybank.com
cookie,所以他们成功完成了请求。所有这些都是在您不知情的情况下发生的,因为没有页面重新加载发生。这是允许一般跨站点AJAX请求的危险。

如果要执行跨站点请求,则有两个选择:

  1. 获取您向其请求的服务器之一
    。通过放入包含您(或*)的Access-Control-Allow-Origin标头来接纳您
    。b。为您提供JSONP API。

要么

  1. 编写自己的不符合标准且没有限制的浏览器。

在(1)中,您必须与要向其请求的服务器合作,在(2)中,您必须对最终用户的浏览器具有控制权。如果您不能履行(1)或(2),那么您很不幸。

但是,还有第三种选择(由charlietfl指出)。您可以从您控制的服务器发出请求,然后将结果传递回页面。例如

<script>
$.ajax({
    type: 'GET',
    url: '/proxyAjax.php?url=http%3A%2F%2Fstackoverflow.com%2F10m',
    dataType: 'text/html',
    success: function() { alert("Success"); },
    error: function() { alert("Error"); }
});
</script>

然后在您的服务器上,最简单的方法是:

<?php
// proxyAjax.php
// ... validation of params
// and checking of url against whitelist would happen here ...
// assume that $url now contains "http://stackoverflow.com/10m"
echo file_get_contents($url);

当然,此方法可能会遇到其他问题:

  • 您代理的站点是否需要正确的引荐来源网址或特定的IP地址?
  • cookie是否需要传递到目标服务器?
  • 您的白名单是否足以保护您免受随意发出的请求?
  • 当服务器接收到哪些标头(例如,修改时间等)时,您将它们传递回浏览器,而您将省略或更改哪些标头?
  • 您的服务器是否被暗示提出了非法请求(因为您是代理人)?

我敢肯定还有其他人。但是,如果所有这些问题都不能阻止它,那么第三种方法可能会很好地工作。



 类似资料:
  • 我需要发送数据通过从JavaScript到Python服务器。因为我在使用localhost,所以我需要使用CORS。我正在使用Flask框架及其模块。 作为JavaScript,我有以下几点: 和Python代码: 但是当我执行它时,我会得到这样的信息: XMLHttpRequest无法加载localhost:5000/signin.请求的资源上不存在访问控制允许起源标头。因此,不允许访问源'n

  • 问题内容: 我有一个在服务器上运行的API,并且有一个与之连接的前端客户端来检索数据。我对跨域问题进行了一些研究,并使其起作用。但是我不确定发生了什么变化。我现在在控制台中收到此错误: XMLHttpRequest无法加载https://api.mydomain/api/status。所请求的资源上没有“ Access-Control-Allow-Origin”标头。因此,不允许访问源“ http

  • 问题内容: 实际上,这不是 重复的 帖子,我知道在stackoverflow社区中多次问过的标题的一部分,我阅读了所有帖子和答案,但是我认为我使用的问题和技术是不同的。 首先,我应该提到的是我的后端应用程序,也是我的前端应用程序。 我读了一下,发现必须在App 上启用并放入 请求的标头,但是在调用api时仍然出现以下错误: 所请求的资源上没有“ Access-Control-Allow-Origi

  • 问题内容: 我正在尝试获取新闻网站的供稿。以为我会使用Google的feed API将feedburner供稿转换为json。以下网址将以json格式从Feed中返回10个帖子。http://ajax.googleapis.com/ajax/services/feed/load?v=1.0&num=10&q=http://feeds.feedburner.com/mathrubhumi 我用下面的

  • 我在区域中有一个S3 bucket,我们称之为。 在那个桶中有一个图片,我们称之为。 如果我通过浏览器访问这两个URL,我就可以检索那个图片(桶中的所有对象都是公共的)(请记住,这些是示例,而不是现实生活中的URL): https://my-bucket.s3.amazonaws.com/some-file.jpg https://s3-eu-west-1.amazonaws.com/my-buc

  • 问题内容: 我想访问来自同一域但端口号不同的信息,为此,我添加了响应头。 Servlet代码:( 显示在www.example.com:PORT_NUMBER上) jQuery代码:( 显示在www.example.com上) 几次我收到此错误(在控制台中): 该错误通常在执行时首次发生。第二次允许。 我的问题是代码中或代码中缺少什么? 任何建议将不胜感激。 更新1 我变了: 至: 然后我在控制台