JSONProxy - 获取跨域json数据工具
JSONProxy是一款很好的获取json数据的代理网站,“Enables cross-domain requests to any JSON API”。当你苦于无法跨域获取json数据时,不妨一试,说不定能事半功倍。
比如这位朋友,想通过ajax获取必应的每日一图的url(是否可以通过ajax获取“Bing每日一图”?)很显然,这个ajax是跨域的,直接获取会因为跨域报错;服务端也肯定不会有对你本地localhost的“Access-Control-Allow-Origin”的设置,所以CORS策略也是不行的;因为是个json数据,没有方法名包裹,所以jsonp也是不行。楼主暂时还没接触过其他的跨域方法,如果要我去获取url,只能通过服务端的代码,服务端去获取json数据,然后index页面去ajax请求服务端获取的json数据(此时index页面和服务端同源),代码量增加,而要做的仅仅只是获取一个json数据啊!这时JSONProxy就帮你做好了服务端的工作,是不是很爽!
Easy: JSONP
原生的JavaScript:
<script>
function myCallback(data){
console.log(data);
}
</script>
<script src="https://jsonp.afeld.me/?callback=myCallback&url=http://jsonview.com/example.json"></script>
myCallback函数里的data就是返回的json数据了。很显然,服务器会帮你去请求你需要的json数据,然后包裹在你设置的回调函数名中,这时要注意的代码中的红色两处要保持一致,url后跟的就是需要的json数据地址。
当然JQuery封装好的方法更加简单:
<script>
$.getJSON('https://jsonp.afeld.me/?callback=?&url=http://jsonview.com/example.json', function(data){
console.log(data);
});
</script>
Easier: Cross-domain AJAX (CORS)
比jsonp更简单的方法是CORS(好吧,也没简单到哪去啊...)
<script>
$.get('https://jsonp.afeld.me/?url=http://jsonview.com/example.json', function(data){
console.log(data);
});
</script>
这回是真正地发送了ajax请求了,为什么跨域了还能请求?因为服务端设置好了。

而请求的json数据也是服务端帮你获取的。也就是说,客户端发送请求,服务端解析请求的url,然后服务器作为代理发送http请求去请求json数据(这时不存在客户端跨域),再返回给客户端作为回调的参数。
Easiest: jQuery Plugin
最简单的,我怎么感觉越来越复杂了...
略...
总结,因为要用第三方的服务器,所以既耗时又有不确定因素(比如服务器挂了),不合适用在真正项目中,自己玩玩尚可。
JSONProxy - 获取跨域json数据工具的更多相关文章
- 关于试用jquery的jsonp实现ajax跨域请求数据的问题
我们在开发过程中遇到要获取另一个系统数据时,就造成跨域问题,这就是下文要说的解决办法: 先我们熟悉下json和jsonp的区别: 使用AJAX就会不可避免的面临两个问题,第一个是AJAX以何种格式来交 ...
- HTML5 postMessage 跨域交换数据
前言 之前简单讲解了利用script标签(jsonp)以及iframe标签(window.name.location.hash)来跨域交换数据,今天我们来学习一下HTML5的api,利用postMes ...
- 使用jQuery-AJAX–读取获得跨域JSONP数据的示例
在项目开发中,如果在同一个域名下就不存在跨域情况,使用$.getJSON()即可实现.但是需要跨域请求其他域名下面的Json数据就需要JSONP的方式去请求,跨域写法和getJSON有差异.如下: ...
- jquery跨域请求数据
jquery跨域请求数据 jquery跨越请求数据.实际开发中经常会碰到两个网站数据交互问题,当向另一个站点请求数据该如何做? 实际上非常容易,请按照下面的步骤做: 第一:编写js,通过get获取远程 ...
- jquery 跨域请求数据问题
昨天参加了一个前端的面试,被问到一个跨域请求数据问题,我们之前一直用的是apicloud的api进行请求的,跨域是被apicloud封装起来的,也就没有注意跨域请求数据的问题.当被问到用jquery跨 ...
- Vue用axios跨域访问数据
Vue用axios跨域访问数据axios是vue-resource的替代品,vue-resource不再维护.安装axios:npm install axios使用vue-cli开发时,由于项目本身启 ...
- 用原生js来处理跨域的数据(jsonp)
说明总结: 1.ajax和jsonp其实本质上是不同的东西.ajax的核心是通过XmlHttpRequest获取非本页内容,而jsonp的核心则是动态添加<script>标签来调用服务器提 ...
- JavaScript跨域提交数据
1.通过jsonp跨域 场景:假设前台有JS方法"crossJS", 1.1发送请求http://www.xxx.com/?callback=crossJS.(创建一个scr ...
- jquery ajax跨域取数据
jsonp.js/html 主要是利用jquery ajax和jsonp的datatype 跨站点请求数据,记录~ 同源策略:同端口,同协议,同域:所以ajax不能支持跨域取得数据,解决方案一般是js ...
随机推荐
- linux 2>&1
2>&1就是用来将标准错误2重定向到标准输出1中的.此处1前面的&就是为了让bash将1解释成标准输出而不是文件1.至于最后一个&,则是让bash在后台执行 例如:/us ...
- Effective Java 58 Use checked exceptions for recoverable conditions and runtime exceptions for programming errors
Three kinds of throwables Throwables Checked Recoverable checked exceptions Y Y runtime exceptions N ...
- apache 开启zgip 压缩模式
一.Apache开启gzip压缩模式在目录apache\conf\httpd.conf 配置 httpd.conf 文件: #去掉LoadModule deflate_module modules/m ...
- Linux LDAP Server--->Clients配置
Linux Ldap Configuration LDAP Server Base Software & SysTem Info SysTem Info 系统版本:centos 6.4 LDA ...
- Linux dsh
一.简介 目前在企业网络中越来越多的出现Linux服务器,而如何方便高效的管理大量的Linux服务器是系统管理员非常关心的一个问题,而dsh正是一个通过命令行有效地管理大量Linux的工具. 二. ...
- xamarin.android 图片高斯模糊效果
代码如下: private static float BITMAP_SCALE = 0.1f; private static float BLUR_RADIUS = 12.0f; public sta ...
- 【ubuntu】中文输入法安装二三事
本来很愉快地刷着JS程序,很有感慨啊,想写篇博客记一下学习笔记,结果忘记了博客账号,后来通过邮箱找回了之后想要开始写..发现ubuntu的中文输入法不能用啊(其实不是不能用,就是小白没搞清楚状况,双系 ...
- tomcat发布记录
web项目发布详细步骤 服务器 tomcat服务器1.删除webapps文件夹里面的项目war包-->ifm.war(项目war名称)2.把项目的ifm.war放到webapps里面3.删除we ...
- 原始的2文件的makefile错误
从来没系统的看过makefile文档,平时属于复制模板,用完即忘,下午尝试按自己的理解写一个最简单的makefile,含2个.c文件,1个.h文件,费了个把小时,参考别人的文章才弄出来,特记录. ma ...
- Sample SecondarySort 浅析
示例文件: 100 99 100 98 100 56 100 78 20 100 30 100 20 50 30 50 30 60 20 80 需求:首先按第一个数字分组,组成按第二个数字排序. 解决 ...