Access-Control-Allow-Origin不允许使用origin'url'

Question

我正在尝试Google Currency Calculator使用以下jquery(虚拟)代码获得货币汇率:

    $.getJSON("http://www.google.com/ig/calculator?hl=en&q=1" + "DOP" + "=?" + "USD",
        function(data) {
            $('.currNumber').each(function (index) {
                $(this).html(parseFloat($(this).html()) * 0.02681);
                                  });
          });

XMLHttpRequest无法加载http://www.google.com/ig/calculator?hl=zh-CN&q=1DOP=?USD.Access-Control-Allow-Origin不允许原点'hostURL'.

在网站上看到我发现了关于这个主题的各种主题,但他们主要是指本地文件访问,并尝试通过使用附加参数启动chrome来解决它(我也使用chrome)但这不是我的问题,实际上似乎与跨域限制更相关.

所以,问题是:我如何使用jQuery从该网址获取费率？

Answer 1

Ajax请求受浏览器的同源策略的限制.简而言之,这意味着您无法通过与运行脚本的页面不在同一域中的ajax直接与服务器通信.因此,除非您正在为google.com开发页面,否则无法直接与google.com交谈.

这种限制的解决方法涉及插入脚本标记(通过脚本标记加载的JS文件不受相同的源策略约束),然后使用JSONP回调将数据结果从这些脚本标记传回主脚本.如果您尝试使用的API支持它,那么您可能需要在此处执行此操作.

jQuery将在这里帮助你很多,因为它可以自动将ajax调用转换为通过脚本标记加载的JSONP调用,并且可以在跨域情况下工作.根据jQuery doc的ajax函数,如果它在ajax调用的参数字符串中看到"callback ="或者你设置了crossDomain选项,它会自动执行此操作.