JSONP 跨域访问代理API-yahooapis实现代码


Posted in Javascript onDecember 02, 2012

你是否遇到了想利用AJAX访问一些公网API,但是你又不想建立自己的代理服务,因为有时我根本就没打算涉及服务端任何代码,但是讨厌的浏览器的同源策略,阻止了我们的ajax调用。
比如我想访问一个天气的restfull api,如果我直接去GET:

$.get("http://m.weather.com.cn/data/101010100.html");

JSONP 跨域访问代理API-yahooapis实现代码 
看见这问题相信大家都不会陌生,也会很自然的得到解决方案,但是我这里真的不想touch任何服务端代码,用jsonp吧,但是服务端没实现契约。
在这里我是时候引入主角yahoo提供的jsonp代理:http://query.yahooapis.com/v1/public/yql
实现跨域访问代码为:http://jsfiddle.net/whitewolf/4UDpf/9/
html:
<script type="text/javascript" src="http://ajax.cdnjs.com/ajax/libs/json2/20110223/json2.js"></script> 
<div id="content"> 
</div>

js: 
$(function(){ 
$.getJSON("http://query.yahooapis.com/v1/public/yql", { 
q: "select * from json where url=\"http://m.weather.com.cn/data/101010100.html\"", 
format: "json" 
}, function(data) { 
var $content = $("#content") 
if (data.query.results) { 
$content.text(JSON.stringify(data.query.results)); 
} else { 
$content.text('no such code: ' + code); 
} 
});

});
效果:
JSONP 跨域访问代理API-yahooapis实现代码 
多的就不用说了,jsonp原理我相信大家也很清楚。
Javascript 相关文章推荐
Jquery实现列表(隔行换色,全选,鼠标滑过当前行)效果实例
Jun 09 Javascript
js获取select标签选中值的两种方式
Jan 09 Javascript
js正则表达式中test,exec,match方法的区别说明
Jan 29 Javascript
JavaScript对象学习小结
Sep 02 Javascript
JavaScript中的this,call,apply使用及区别详解
Jan 29 Javascript
深入理解jQuery3.0的domManip函数
Sep 01 Javascript
HTML5实现微信拍摄上传照片功能
Apr 21 Javascript
react开发教程之React 组件之间的通信方式
Aug 12 Javascript
Vue.js自定义事件的表单输入组件方法
Mar 08 Javascript
如何使用less实现随机下雪动画详解
Jan 02 Javascript
JavaScript对JSON数组简单排序操作示例
Jan 31 Javascript
vue基于Echarts的拖拽数据可视化功能实现
Dec 04 Vue.js
script标签属性type与language使用选择
Dec 02 #Javascript
JavaScript中valueOf函数与toString方法深入理解
Dec 02 #Javascript
json对象转字符串如何实现
Dec 02 #Javascript
javascript 构造函数强制调用经验总结
Dec 02 #Javascript
js精度溢出解决方案
Dec 02 #Javascript
JavaScript词法作用域与调用对象深入理解
Nov 29 #Javascript
浏览器加载、渲染和解析过程黑箱简析
Nov 29 #Javascript
You might like
中东人咖啡哲学
2021/03/03 咖啡文化
php 取得瑞年与平年的天数的代码
2009/08/10 PHP
snoopy 强大的PHP采集类使用实例代码
2010/12/09 PHP
laravel 修改.htaccess文件 重定向public的解决方法
2019/10/12 PHP
php装饰者模式简单应用案例分析
2019/10/23 PHP
PHP pthreads v3在centos7平台下的安装与配置操作方法
2020/02/21 PHP
php7 图形用户界面GUI 开发示例
2020/02/22 PHP
一个简单的JavaScript数据缓存系统实现代码
2010/10/24 Javascript
js 获取屏幕各种宽高的方法(浏览器兼容)
2013/05/15 Javascript
浅析js设置控件的readonly与enabled属性问题
2013/12/25 Javascript
运行Node.js的IIS扩展iisnode安装配置笔记
2015/03/02 Javascript
AngularJS基础知识笔记之过滤器
2015/05/10 Javascript
JS实现密码框根据焦点的获取与失去控制文字的消失与显示效果
2015/11/26 Javascript
最佳的JavaScript错误处理实践
2016/07/16 Javascript
js检测离开或刷新页面时表单数据是否更改的方法
2016/08/02 Javascript
Angular 5.x 学习笔记之Router(路由)应用
2018/04/08 Javascript
vue中子组件调用兄弟组件方法
2018/07/06 Javascript
jQuery实现仿京东防抖动菜单效果示例
2018/07/06 jQuery
JS实现使用POST方式发送请求
2019/08/30 Javascript
微信小程序引入VANT组件的方法步骤
2019/09/19 Javascript
用十张图详解TensorFlow数据读取机制(附代码)
2018/02/06 Python
python正则实现提取电话功能
2018/02/24 Python
python调用matlab的m自定义函数方法
2019/02/18 Python
使用Python+wxpy 找出微信里把你删除的好友实例
2019/02/21 Python
python五子棋游戏的设计与实现
2019/06/18 Python
解决Django 在ForeignKey中出现 non-nullable field错误的问题
2019/08/06 Python
Python参数传递对象的引用原理解析
2020/05/22 Python
python 调用Google翻译接口的方法
2020/12/09 Python
如何利用cmp命令比较文件
2013/09/23 面试题
民主生活会剖析材料
2014/09/30 职场文书
2014年仓库工作总结
2014/11/20 职场文书
交通事故责任认定书
2015/08/06 职场文书
人为什么会“幸灾乐祸”?
2019/08/06 职场文书
IDEA 2022 Translation 未知错误 翻译文档失败
2022/04/24 Java/Android
Python matplotlib安装以及实现简单曲线的绘制
2022/04/26 Python
正则表达式基础与常用验证表达式
2022/06/16 Javascript