Jsonp学习记录
来源:互联网 发布:sql注入绕过空格 编辑:程序博客网 时间:2024/05/22 13:32
1.jsonp作用
解决通过ajax的形式去调用其他网站的接口不行的缺陷。
例如:
Js代码 收藏代码
$.ajax({
url: “http://www.google.com/search?q=jquery“,
success: function(json){
alert(json.count)
}
});
2.jsonp原理
从别的网站引入js代码是可行的。
例如:
本地html引入外部网站的js
如上代码,远程js中写了
localHandler({“result”:”I’m remote data!”});
引入到本地就会执行localHandler方法。
这样就实现了跨域并获取数据的目的!
所以服务商在提供接口的时候可以这样写:
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
//获取JSON数据
String jsonData = getDataAsJson(req.getParameter(“symbol”));
//获取回调函数名
String callback = req.getParameter(“callback”);
//拼接动态JS代码
String output = callback + “(” + jsonData + “);
resp.setContentType(“text/javascript”);
PrintWriter out = resp.getWriter();
out.println(output);
// 输出为 jsonpFunc({“symbol” : “IBM”, “price” : “91.42”});
}
假设这个JSONP服务的URL为http://www.google.com/jsonp,回调的函数名为jsonpFunc,那么可以这样发送JSONP请求:
4.使用JQuery的封装进行实现
1.第一种
jQuery.getJSON(
“http://www.yourdomain.com/jsonp/ticker?symbol=IBM&callback=?”,
function(data) {
alert(“Symbol: ” + data.symbol + “, Price: ” + data.price);
}
);
其中回调函数名”callback”为”?”,即不需要用户指定,而是由jquery生成,互调函数也不需要单独定义,而是以参数的形式紧接在URL之后,URL中还可以附带供数据查询用的其他参数,如上例中的”symbol=IBM”
2.第二种
(function() {.ajax({
url : ‘http://wx.lrcyz.com/api/article/query.html‘,
data : {
id : 1,
name : ‘qq’
},
dataType : ‘jsonp’,
jsonpCallback : ‘jsonObject’, //服务器封装的方法 形如:jsonObject(data,data,data);
success : function(data) {
console.log(“成功”)
console.log(data)
if (data.list) {
var l = data.list;
for (var i = 0; i < l.length; i++) {
var obj = l[i];
$(‘.test’).append(“
}
} //$("#id").append("<div> 1 </div>") }, error : function(data) { console.log(data) } });});
3.第三种
jQuery(document).ready(function(){
$.ajax({
type: “get”,
async: false,
url: “http://flightQuery.com/jsonp/flightResult.aspx?code=CA1998“,
dataType: “jsonp”,
jsonp: “callback”,//传递给请求处理程序或页面的,用以获得jsonp回调函数名的参数名(一般默认为:callback)
jsonpCallback:”flightHandler”,//自定义的jsonp回调函数名称,默认为jQuery自动生成的随机函数名,也可以写”?”,jQuery会自动为你处理数据
success: function(json){
alert(‘您查询到航班信息:票价: ’ + json.price + ’ 元,余票: ’ + json.tickets + ’ 张。’);
},
error: function(){
alert(‘fail’);
}
});
});
- php学习记录 jsonp
- Jsonp学习记录
- jsonp学习记录
- jsonp学习
- jsonp学习
- jsonp学习
- JSONP学习
- jsonp学习一认识jsonp
- jsonp学习三jquery-jsonp
- 随笔记录 Jsonp Cookie DNS
- jsonp 跨域学习
- jsonp 学习实例
- JSONP学习笔记
- jsonp的简单学习
- 01-jsonp学习
- 02-jsonp学习
- JSONP学习小记
- JSONP学习笔记
- 第7周项目1:成员函数、友元函数和一般函数有区别(2)
- hihocoder1143 斐波拉契数列
- 学习Android从0开始之ActionBar(活动条)
- [OJ]24点游戏之递归实现(JAVA)
- JavaScript形参和实参
- Jsonp学习记录
- 第七周项目一-三个函数在一个程序中(5)
- 搜索0之1001
- HDU 1024 Max Sum Plus Plus(求m个不相交连续子序列最大和/01背包)
- 你看不见的幕后推手
- String 的基本用法
- C\C++精华总结
- Android中实现从SD卡的Gallery画廊带回图片
- Android:Android面试准备二