有啥办法可以绕过测试服务器的跨域资源共享?

Posted

技术标签:

【中文标题】有啥办法可以绕过测试服务器的跨域资源共享?【英文标题】:Any way to get around cross-origin resource sharing for test server?有什么办法可以绕过测试服务器的跨域资源共享? 【发布时间】:2015-10-24 09:39:10 【问题描述】:

我正在为我儿子的 Wordpress 网站做一些 javascript/jQuery 编程,我通常喜欢在我的家用电脑上进行测试,而不是在现场网站上进行测试。他的网站始终使用他的域名,因此为了进行测试,我在我的主机文件中输入条目以将他的域名重定向到我的本地主机。

但是,我正在尝试测试 Yahoo Finance api 的 json 回调,但我收到有关跨域资源共享的错误。雅虎显然对我的主机文件一无所知,所以它收到了我的请求,告诉它将结果发送到另一个域。

我不确定在我的本地系统上启用 CORS 是否会有所帮助,尽管我尝试过这样做。可能我错了,它应该可以工作,也许我启用它不正确,但我怀疑我需要在他的真实服务器上启用它(在 GoDaddy 上),我不知何故怀疑他们是否愿意这样做。

有人知道解决这个问题的方法吗?如果没有相当简单的解决方案,我想我会在直播服务器上测试,并使用一个未发布的页面进行测试,这应该是相当无害的。

编辑 我想我现在更了解正在发生的事情。我的理解是,这可以防止网站通过将我请求的数据重定向到不同的地址(或类似的地址)来拦截我请求的数据。

根据要求,这是我的测试代码:

var data = encodeURIComponent('select  from yahoo.finance.quotes where symbol in ("GOOG")&env=http://datatables.org/alltables.env&format=json');
var url = 'http://query.yahooapis.com/v1/public/yql ';
jQuery.getJSON(url, 'q=' + data, callback);   

我的回调函数永远不会被调用,所以这里不相关。我可以将整个 URL 粘贴到 Firefox 或 Chrome 的地址栏中,并正确获取数据,所以我知道这是对的。

我按照 Maximillian Laumeister 的建议尝试了命令行“google-chrome --disable-web-security”,并在控制台中收到此错误:

XMLHttpRequest cannot load http://query.yahooapis.com/v1/public/yql%20?q=select%20%20from%20yahoo.fina…OG%22)%26env%3Dhttp%3A%2F%2Fdatatables.org%2Falltables.env%26format%3Djson. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://www.wenboinvestment.com' is therefore not allowed access. The response had HTTP status code 404.

他的网站是wenboinvestment.com

【问题讨论】:

Marty,您应该分享您编写的发出请求的代码。 jsfiddle.net/dzejkej/Tb9NG 【参考方案1】:

第 1 部分 - 为什么会出现跨域错误

您的错误是由您的浏览器强制执行Same-Origin Policy 引起的,这会阻止网页访问来自其他域的资源,除非满足一组特定条件。

绕过跨域资源共享错误的一种方法是在浏览器中暂时禁用同源策略。对于 Google Chrome,使用 --disable-web-security 命令行参数运行 Chrome。这将禁用 Chrome 中的同源策略,这意味着您可以从任何您想要的域加载跨域。 (当然,不要在取消这些检查的情况下浏览整个互联网,它们的存在是有原因的。)

操作方法如下:

在 Windows 中:

创建 Chrome 的快捷方式。右键单击它,单击“属性”并添加:

--disable-web-security

到“目标”字段。


在 Mac OS / Linux 中

打开命令提示符并运行:

google-chrome --disable-web-security

更多详情请见this Stack Overflow answer。


第 2 部分 - 为什么会收到 404 错误

关于您的第二个错误,您的查询只是格式错误(您将 GET 参数与查询字符串一起编码,而要正常工作,它们需要未编码)。这是一个演示固定查询的示例:

var data = encodeURIComponent("select * from yahoo.finance.quotes where symbol in ('GOOG')");
var url = 'http://query.yahooapis.com/v1/public/yql';
jQuery.getJSON(url, 'q=' + data + '&env=http://datatables.org/alltables.env&format=json', callback);

function callback(xhr) 
    console.log(xhr);

在 Chrome 中运行this JSFiddle,它应该看起来像这样(你可以看到 AJAX 结果打印到控制台):

事实证明,当您有一个格式正确的查询时,Yahoo 会设置正确的服务器标头,因此如果您只是使用 YQL,您甚至不需要使用 --disable-web-security 技巧。

【讨论】:

您证实了我在发帖后的想法,即 CORS 应该可以在不更改 GoDaddy 的情况下工作。我想我明白为什么它现在会发生。但我认为我还有其他问题,因为我不是真正的 mydomain.com,而且雅虎无法将数据返回给我。我现在得到一个稍微不同的错误。 哇,非常感谢。我确认它可以在原始 Firefox 中运行。我什至安装了 Chromium,因为 Chrome 似乎忽略了我版本中的标志,并且我发现 URL 不能直接工作,尽管我认为它以前确实如此。我不知道不对地址的一部分进行编码 - 我相信我在它最初不起作用时更改了它。随时学习新事物。 @MartyFried 很高兴你成功了,祝你项目顺利!

以上是关于有啥办法可以绕过测试服务器的跨域资源共享?的主要内容,如果未能解决你的问题,请参考以下文章

前端的跨域问题理解

Opera 的跨域资源共享

常见的跨域方法(九种解决办法)

Windows文件服务器共享的时候分配权限对于目录深文件量大的情况下,权限写入非常慢,有啥办法可以解决

wamp解决ajax跨域问题

用浏览器缓存绕过同源策略(SOP)限制