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 相关文章推荐
Dom 学习总结以及实例的使用介绍
Apr 24 Javascript
JavaScript按位运算符的应用简析
Feb 04 Javascript
JQuery删除DOM节点的方法
Jun 11 Javascript
JS定时器使用,定时定点,固定时刻,循环执行详解
May 31 Javascript
用jQuery向div中添加Html文本内容的简单实现
Jul 13 Javascript
分析JavaScript数组操作难点
Dec 18 Javascript
在vue项目中使用Nprogress.js进度条的方法
Jan 31 Javascript
详解Webpack loader 之 file-loader
Nov 07 Javascript
React父子组件间的传值的方法
Nov 13 Javascript
小程序获取当前位置加搜索附近热门小区及商区的方法
Apr 08 Javascript
vue.js实现三级菜单效果
Oct 19 Javascript
Vue插槽_特殊特性slot,slot-scope与指令v-slot说明
Sep 04 Javascript
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
PHP中include与require使用方法区别详解
2013/10/19 PHP
phpMyAdmin无法登陆的解决方法
2017/04/27 PHP
广告代码静态化js通用函数
2007/05/09 Javascript
javascript 表单的友好用户体现
2009/01/07 Javascript
JavaScript 判断判断某个对象是Object还是一个Array
2010/01/28 Javascript
js下获取div中的数据的原理分析
2010/04/07 Javascript
使用UglifyJS合并/压缩JavaScript的方法
2012/03/07 Javascript
详解jquery uploadify 上传文件
2013/11/09 Javascript
教你用jquery实现iframe自适应高度
2014/06/11 Javascript
JavaScript定时显示广告代码分享
2015/03/02 Javascript
JavaScript 数组中最大最小值
2016/06/05 Javascript
搭建Bootstrap离线文档的方法
2016/12/02 Javascript
js验证手机号、密码、短信验证码代码工具类
2020/06/24 Javascript
JQuery和html+css实现带小圆点和左右按钮的轮播图实例
2017/07/22 jQuery
360doc网站不登录就无法复制内容的解决方法
2018/01/27 Javascript
在vue项目中,使用axios跨域处理
2018/03/07 Javascript
AngularJs的UI组件ui-Bootstrap之Tooltip和Popover
2018/07/13 Javascript
JS实现获取毫秒值及转换成年月日时分秒的方法
2018/08/15 Javascript
详解ES6 Promise的生命周期和创建
2019/08/18 Javascript
js 获取本周、上周、本月、上月、本季度、上季度的开始结束日期
2020/02/01 Javascript
基于JS实现table导出Excel并保留样式
2020/05/19 Javascript
解决vue elementUI 使用el-select 时 change事件的触发问题
2020/11/17 Vue.js
[36:45]TNC vs VGJ.S 2018国际邀请赛小组赛BO2 第二场 8.18
2018/08/19 DOTA
用Python实现换行符转换的脚本的教程
2015/04/16 Python
python制作爬虫爬取京东商品评论教程
2016/12/16 Python
Ubuntu下创建虚拟独立的Python环境全过程
2017/02/10 Python
Python处理XML格式数据的方法详解
2017/03/21 Python
numpy数组广播的机制
2019/07/12 Python
django处理select下拉表单实例(从model到前端到post到form)
2020/03/13 Python
远程教育心得体会
2014/01/03 职场文书
syb养殖创业计划书
2014/01/09 职场文书
新年晚会主持词
2014/03/24 职场文书
2015年度学校卫生工作总结
2015/05/12 职场文书
幼儿园毕业典礼家长致辞
2015/07/29 职场文书
超级实用!五步法则,教你写好年终工作总结
2019/12/05 职场文书
在JavaScript中如何使用宏详解
2021/05/06 Javascript