跨源策略和Fiddler JSON调试

我正在使用JSON数据开发现代webapp。 我发现以下博客文章使用名为Fiddler的工具来模拟JSON数据。

我正在使用Notepad ++进行本地开发，主要是在Chrome上进行测试（我最终会关注更多浏览器）。 我有一个主HTML文件“index.html”，我使用的文件结构如下所示： 

index.html assets /js /css /img

我通常通过从Notepad ++在Chrome中启动index.html文件来运行我的测试。 但是，因为我想使用Fiddler的JSON“欺骗”function，所以我遇到了跨源策略限制。 我有Fiddler的自动回复工具匹配给定的URI（这里， http：//server.anywhere.com/test ），然后返回在文件中预制的JSON响应。

XMLHttpRequest无法加载http://server.anywhere.com/test 。 Access-Control-Allow-Origin不允许使用null。

代码就像它获得的一样简单（jQuery 1.9.1）： 

 $(document).ready(function(){ $.getJSON("http://server.anywhere.com/test", function(data) { $.each( data, function( i, item ) { console.log('Item number: ', i); }); }); });

有一个更好的方法吗？ 也许是Chrome中的开发工具？

谢谢！

您不需要另外的网络服务器，您可以使用Fiddler的AutoResponder完成所有操作。 只需编辑相关规则，即可获得包含请求站点原点值的Access-Control-Allow-Origin响应头。

如果您需要执行“非简单”（CORS术语）请求，请添加如下规则：

Method:OPTIONS PartialTargetURL ，动作为*CORSPreflightAllow

在规则返回目标响应之前，到规则列表。 此规则将导致Fiddler肯定地响应XMLHttpRequest对象发送的预检请求。

坏消息是Chrome和Firefox出于安全原因不允许跨域调用。

选项1：使用AJAX调用本地PHP文件，在该文件中使用“fopen”来获取数据。 （如果您的Web应用程序在服务器上运行，请使用）

选项2：Safari和移动设备将允许您通过此请求获取数据（如果您的Web应用程序完全在客户端运行，请使用） 

  $.ajax({ url: ('www.sitewherejsonis.com/data.json'), type: 'GET', dataType: 'json', beforeSend: function(xhr) { xhr.setRequestHeader("Authorization", "Base 64"; // if you need to authentificate }, success: function (data, textStatus, xhr) { // do something } error: function(xhr, exception) { // catch error } });

我能够让这个工作。 我最终通过命令行使用SimpleHTTPServer来启动程序。 然后我将浏览器指向localhost：8000并且工作正常。 使用Fiddler2和谷歌浏览器。

在另一个post中发布：

试试这个 – https://api.allowallorigin.com/restapi?url=www.sitewherejsonis.com/data.json

我尝试了多个选项后创建了这个解决方案。 同一行上的另一个解决方案可以完成工作，但会更改JSON数据位置，直到付费为止。 以上服务是免费的，并将继续免费。 如果人们觉得它很有用，那么我可能会放一个主页和一些谷歌广告，但在可预见的将来它应继续保持免费。

示例代码： 

  jPath.prototype.loadJSONDataFromUrl = function(_url, callback) { $.getJSON(_url, function(data) { $.fn.jsonData = JSON.stringify(data); }).done(function(json){ if( callback != null) { callback(); } }).fail(function(){ $.getJSON('https://api.allowallorigin.com/allorigin/restapi?url='+_url, function(data) { console.log(data); console.log(JSON.stringify(data)); $.fn.jsonData = JSON.stringify(data); }).done(function(json){ if( callback != null) { callback(); } }); }); }
Interesting Posts