jsonp 请求和回传实现
JSONP最主要的是可以解决跨域问题,不然谁会没事用这种格式。
下面是我用JSONP的一些心得体会:
JSONP是JSON with Padding的略称。它是一个非官方的协议,它允许在服务器端集成Script tags返回至客户端,通过javascript callback的形式实现跨域访问。对,它就是一种协议,不是数据格式,开始我也被
dataType: "jsonp"这个鬼东西误导了,我们根本不需要考虑格式问题,该返回什么格式就返回什么格式,只要注意几个地方就可以了: 1. jsonp: "callback",jsonpCallback:"userHandler",这两个可以自定义也可以不定义,为了可读性建议还是自定义好。
$.ajax({
url: "http://172.25.19.63:8084/web/",
type: "post",
dataType: "jsonp",
jsonp: "callback",
jsonpCallback:"userHandler",
// contentType: 'application/json',
// data:JSON.stringify(json),
data:{password: "password",
username: "username"},
success: function(data){
alert(data.name)//得到”忍着不哭泣“
},
error: function(data){
alert(data.status);//调用状态
}
});
2. 在服务器端callback = resquest.getParamter("callback")取到的值是"userHandler",然后如下图拼装起来写入response里面就OK了
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
callback = resquest.getParamter("callback")//取到的值应该是userHandler
PrintWriter out = response.getWriter();
String json = {"name":"忍着不哭泣"}
out.println(callback+"("+json+")");
out.close();
}
3.上图是json格式字符串(可以其他格式)客户端就会取到json对象。
Jsonp原理:
首先在客户端注册一个callback, 然后把callback的名字传给服务器。
此时,服务器先生成 json 数据。
然后以 javascript 语法的方式,生成一个function , function 名字就是传递上来的参数 jsonp.
最后将 json 数据直接以入参的方式,放置到 function 中,这样就生成了一段 js 语法的文档,返回给客户端。
客户端浏览器,解析script标签,并执行返回的 javascript 文档,此时数据作为参数,传入到了客户端预先定义好的 callback 函数里.(动态执行回调函数)
jsonp 请求和回传实现的更多相关文章
- 深入源码分析使用jQuery连续发起jsonp请求失败的原因
jQuery的 jsonp 大家应该是十分熟悉了.曾遇到过这样的需求1.希望请求几个相似的内容添加到页面2.请求的内容一定时间内是固定不变的,希望做个缓存. 于是脑子一拍写下了类似这样的代码 for( ...
- 使用Script元素发送JSONP请求
// 根据指定URL发送一个JSONP请求 //然后把解析得到的相应数据传递给回调函数 //在URL中添加一个名为jsonp的查询参数,用于指定该请求的回调函数的名称 function getJSON ...
- 关于laravel框架的跨域请求/jsonp请求的理解
最近刚接触laravel框架,首先要写一个跨域的单点登录.被跨域的问题卡了两三天,主要是因为对跨域这快不了解,就在刚才有点茅塞顿开的感觉,我做一下大概整理,主要给一些刚接触摸不着头脑的看,哪里写得不对 ...
- JavaScript跨域请求和jsonp请求实例
<script type="text/javascript" src="./whenReady.js"></script> <sc ...
- jsonp 请求
$.ajax()方法详解 $.ajax() 方法详解:来源 http://www.cnblogs.com/tylerdonet/p/3520862.html jsonp 调用 无法进入 success ...
- jsonp请求
发起一个jsonp请求 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type&q ...
- angular5中使用jsonp请求页面
说多了,都是眼泪,折腾了很久,各种百度,查到的例子,全都报错,可能是因为我的angular的版本太高,向下都不兼容? 我的angular版本为最新的5.2.11: 下面是正确的jsonp请求的方法 1 ...
- IE6—在链接click事件的响应函数中发送jsonp请求不生效
$("#link").click(function(){ $.ajax({ type: 'GET', dataType: 'jsonp', ...
- jquery jsonp请求错误处理
jQuery将ajax方法进行了封装,jsonp可以轻松实现跨域请求. $.ajax({type: 'GET', url: "<%= SysUtils::TASK_CENTER_URL ...
随机推荐
- Technical Committee Weekly Meeting 2016.06.21
Meeting time: 2016.June.21 1:00~2:00 Chairperson: Thierry Carrez Meeting summary: 1.Add current hou ...
- windows 7下安装Apache 2.2
一. 软件下载 软件版本:apache_2.2.25-win32-x86-no_ssl.msi 二. 软件安装 双击安装,一路Next下去,直到安装完成. 三. 配置 在安装结束之后,在右下角的状态栏 ...
- Unity C# string 与byte 直接的转换
指纹模版的转换 可还原字节数组byt string str = Convert.ToBase64String(bytes); byte[] bytes = Convert.FromBase64Stri ...
- XHML教会我的一些东西-4
今天把“河畔林语”的项目看完了.我自己也试着做了一下,这算是自己写的第一个项目吧.虽然全部是模仿,而且经常一边看写好的一边自己写,还是自己不够成熟呀. 不知道为什么,我用我的电脑进http://www ...
- codevs 1213 解的个数
1213 解的个数 时间限制: 1 s 空间限制: 128000 KB 题目等级 : 黄金 Gold 题目描述 Description 已知整数x,y满足如下面的条件: ax+by+c = ...
- 在CentOS上配置tomcat服务
# hapday start 2016-02-04 #!/bin/bash # description: Tomcat Start Stop Restart # processname: tomcat ...
- VS Code 编译器的调试工具整理
1 debbugeer for chrome的使用 下载安装,然后配置launch.json { "name": "Chrome",//名称 "typ ...
- 类型信息(RTTI和反射)——反射
运行时类型信息可以让你在程序运行时发现和使用类型信息. 在Java中运行时识别对象和类的信息有两种方式:传统的RTTI,以及反射.下面就来说说反射. 重点说说通过反射获取方法以及调用方法,即类方法提取 ...
- day003-List类、Set类
(一) 知识回顾1. day002总结 泛型没有多态.如果泛型能实现多态,那么数据类型就不安全了.违背了设计泛型的初衷. 1.1 伪泛型 泛型只存在编译器,编译生成的字节码中,不存在泛型变量的. 1. ...
- win10下同时安装jdk1.7,1.8
摘要:在开发不同项目时,可能会用到不同的jdk,需要我们在不同的jdk之间切换,怎么样在同一电脑上装不同的jdk,以此总结 1.正常安装jdk1.7,1.8 显示安装了jdk1.7,再安装jd ...