一尘不染

jQuery xml错误'请求的资源上没有'Access-Control-Allow-Origin'标头。

javascript

到目前为止,我想出了下面的代码,它是读取xml的非常基本的代码,但是出现以下错误。

XMLHttpRequest无法加载****。所请求的资源上不存在“ Access-Control-Allow-Origin”标头。因此,不允许访问源’
http://run.jsbin.com ‘。

$(document).ready( 
    function() {     
        $.ajax({          
            type:  'GET',
            url:   'http://www.ecb.europa.eu/stats/eurofxref/eurofxref-daily.xml',
            dataType: 'xml',              
            success: function(xml){
                alert('aaa');
            }
         });
    }
);

我没有发现我的代码有什么问题,所以我希望有人可以指出我的代码有什么问题以及如何解决。


阅读 325

收藏
2020-04-25

共1个答案

一尘不染

由于同源策略,你将无法http://www.ecb.europa.eu/stats/eurofxref/eurofxref-daily.xml从部署的文件进行Ajax调用。http://run.jsbin.com

由于源页面(也称为源页面)和目标 URL位于不同的域(run.jsbin.com和www.ecb.europa.eu),因此你的代码实际上是在尝试发出跨域(CORS)请求,而不是普通的GET。

简而言之,同源策略表示浏览器应仅允许对HTML页面同一域中的服务进行ajax调用。

例:
的网页http://www.example.com/myPage.html只能直接请求的服务http://www.example.com,例如http://www.example.com/api/myService。如果服务托管在另一个域(例如http://www.ok.com/api/myService),则浏览器将不会直接拨打电话(如你所愿)。相反,它将尝试发出CORS请求。

简而言之,要在不同域中执行(CORS)请求*,你的浏览器:

将Origin在原始请求中包含标头(以页面的域为值)并照常执行;然后
- 仅当服务器对该请求的响应包含允许CORS请求的足够的标头(Access-Control-Allow-Origin即其中之一)时,浏览器才会完成调用(几乎**与HTML页面位于相同域时完全相同)。
- 如果期望的标头不出现,浏览器只会放弃(就像你所做的那样)。

上面描述了简单请求中的步骤,例如GET没有花式标题的常规。如果请求不是简单的(例如POST带有application/json内容类型的),浏览器将稍等一下,然后在完成OPTIONS请求之前首先将请求发送到目标URL。像上面一样,只有在对此OPTIONS请求的响应包含CORS标头时,它才会继续。此OPTIONS调用称为预检请求。
我说这几乎是因为常规电话和CORS电话之间还有其他差异。重要的一点是,即使标头包含在响应中,但如果Access-Control-Expose-Headers标头中不包含某些标头,浏览器也不会将其提取。

如何解决?
这只是一个错字吗?有时,JavaScript代码在目标域中只是一个错字。你检查了吗 如果页面位于该页面,www.example.com则只会定期调用www.example.com!其他URL,例如api.example.com或什至example.com或被浏览器www.example.com:8080视为不同的域!是的,如果端口不同,则它是不同的域!

添加标题。启用 CORS 的最简单方法是Access-Control-Allow-Origin在服务器的响应中添加必要的标头(如)。(每种服务器/语言都可以做到这一点- 在此处检查一些解决方案。)

不得已:如果你没有服务器端对该服务的访问权限,则也可以对其进行镜像(通过反向代理之类的工具),并在其中包括所有必需的标头。

2020-04-25