jQuery的XML错误“否”访问控制 - 允许 - 原产地“标头的请求的资源present。” [英] jQuery xml error ' No 'Access-Control-Allow-Origin' header is present on the requested resource.'

查看:158
本文介绍了jQuery的XML错误“否”访问控制 - 允许 - 原产地“标头的请求的资源present。”的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我的工作我的只是为了好玩,这个个人项目,我想读它位于<一个xml文件href="http://www.ecb.europa.eu/stats/eurofxref/eurofxref-daily.xml">http://www.ecb.europa.eu/stats/eurofxref/eurofxref-daily.xml并解析XML和使用它的货币之间转换值。

到目前为止,我已经拿出code以下是pretty的基础,以读取XML,但我得到了下面的错误。

  

XMLHtt prequest无法加载的 * 的*。没有访问控制 - 允许 - 原产地   头是在被请求的资源present。起源    http://run.jsbin.com ,因此不允许访问。

  $(文件)。就绪(
    功能() {
        $阿贾克斯({
            键入:GET,
            网址:http://www.ecb.europa.eu/stats/eurofxref/eurofxref-daily.xml,
            数据类型:XML,
            成功:函数(XML){
                警报(AAA);
            }
         });
    }
);
 

我看不出有什么毛病我code,所以我希望有人能指出我在做什么毛病我code和我怎么能解决这个问题。

解决方案

您将无法使一个Ajax调用 http://www.ecb.europa.eu/stats/eurofxref /eurofxref-daily.xml 从部署在 http://run.jsbin.com 文件因的同源策略


作为源(又名原产地)页面,并在目标的URL是在不同的域(<$ C C $> run.jsbin.com 和 www.ecb.europa.eu ),您的code实际上是试图使一个的跨域(CORS) 的要求,不是一个普通的 GET

在几句话,在同源策略的说,浏览器应该只允许AJAX调用服务在HTML页面的同一个域


例:

一个页面 http://www.example.com/myPage.html 只能直接请求服务,这是在的http:// www.example.com ,像 http://www.example.com/api/myService 。如果该服务被托管在其他领域(比如 http://www.ok.com/api/myService ),浏览器会不会使直接调用(如你倒是期望的那样)。相反,它会尝试做一个CORS请求。

要说得很快,执行(CORS)申请*在不同的领域,您的浏览器:

  • 将包括原始请求的原产地头(与该网页的域值),并执行它像往常一样;然后
  • 只有当服务器的响应的这一要求包含的充足的头文件( 访问控制 - 允许 - 原产地一个的>)允许CORS请求,浏览将完成呼叫(几乎**完全方式它将如果HTML页面是在相同的域)。
    • 如果预期的头部不来,浏览器只是放弃了(就像对你做了)。


<子> *上面描绘了的简单的要求的步骤,如一个普通的 GET ,没有花哨的头。如果请求并不简单(如 POST 应用程序/ JSON 的内容类型),浏览器会拿着它一会儿,并实现它之前,会先发送一个选项请求的目标URL。像上面的,它不仅会继续,如果针对这种选项请求包含CORS头。这选项呼叫被称为 preflight 的要求。
<子> **我说的几乎的,因为有定期的电话和CORS系统调用之间的其他差别。重要的是,一些标题,即使present的响应,将<一href="http://stackoverflow.com/questions/1557602/jquery-and-ajax-response-header/15444439#15444439">not拾起浏览器,如果他们不包括在 访问控制 - 揭露-头 头。


如何解决?

那只是一个错字?有时JavaScript的code的只是一个在目标域错字。你检查?如果页面是 www.example.com 只会定期调用 www.example.com !其他URL,如 api.example.com 甚至 example.com WWW。 example.com:8080 被认为是不同的域的浏览器!是的,如果该端口是不同的,那么它是一个不同的领域!

添加标题。的最简单方法的启用的CORS是通过添加必需的头文件(如访问控制 - 允许 - 原产地)的服务器的响应。 (每个服务器/语言有办法做到这一点 - 。这里查了一些解决方案)

最后一招:如果您没有服务器端访问该服务,您也可以反映它(通过诸如反向代理的工具),以及包括所有必要的标头有

I am working on this personal project of mine just for fun where I want to read an xml file which is located at http://www.ecb.europa.eu/stats/eurofxref/eurofxref-daily.xml and parse the xml and use it to convert values between the currencies.

So far I have come up with the code below which is pretty basic in order to read the xml but I get the following error.

XMLHttpRequest cannot load **. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://run.jsbin.com' is therefore not allowed access.

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

I don't see anything wrong with my code so I am hoping someone could point out what I am doing wrong with my code and how I could fix it.

解决方案

You won't be able to make an ajax call to http://www.ecb.europa.eu/stats/eurofxref/eurofxref-daily.xml from a file deployed at http://run.jsbin.com due to the same-origin policy.


As the source (aka origin) page and the target URL are at different domains (run.jsbin.com and www.ecb.europa.eu), your code is actually attempting to make a Cross-domain (CORS) request, not an ordinary GET.

In a few words, the same-origin policy says that browsers should only allow ajax calls to services at the same domain of the HTML page.


Example:

A page at http://www.example.com/myPage.html can only directly request services that are at http://www.example.com, like http://www.example.com/api/myService. If the service is hosted at another domain (say http://www.ok.com/api/myService), the browser won't make the call directly (as you'd expect). Instead, it will try to make a CORS request.

To put it shortly, to perform a (CORS) request* across different domains, your browser:

  • Will include an Origin header in the original request (with the page's domain as value) and perform it as usual; and then
  • Only if the server response to that request contains the adequate headers (Access-Control-Allow-Origin is one of them) allowing the CORS request, the browse will complete the call (almost** exactly the way it would if the HTML page was at the same domain).
    • If the expected headers don't come, the browser simply gives up (like it did to you).


* The above depicts the steps in a simple request, such as a regular GET with no fancy headers. If the request is not simple (like a POST with application/json as content type), the browser will hold it a moment, and, before fulfilling it, will first send an OPTIONS request to the target URL. Like above, it only will continue if the response to this OPTIONS request contains the CORS headers. This OPTIONS call is known as preflight request.
** I'm saying almost because there are other differences between regular calls and CORS calls. An important one is that some headers, even if present in the response, will not be picked up by the browser if they aren't included in the Access-Control-Expose-Headers header.


How to fix it?

Was it just a typo? Sometimes the JavaScript code has just a typo in the target domain. Have you checked? If the page is at www.example.com it will only make regular calls to www.example.com! Other URLs, such as api.example.com or even example.com or www.example.com:8080 are considered different domains by the browser! Yes, if the port is different, then it is a different domain!

Add the headers. The simplest way to enable CORS is by adding the necessary headers (as Access-Control-Allow-Origin) to the server's responses. (Each server/language has a way to do that - check some solutions here.)

Last resort: If you don't have server-side access to the service, you can also mirror it (through tools such as reverse proxies), and include all the necessary headers there.

这篇关于jQuery的XML错误“否”访问控制 - 允许 - 原产地“标头的请求的资源present。”的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
相关文章
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆