jsonp的作用,jsonp用法
一、跨域请求的概念
为了JavaScript的安全性,不允许跨域调用其他页面的对象。
二。JSON和jsonp
JSON是一种基于文本的数据交换方式(不支持跨域),而JSONP是一种非官方的跨域数据交换协议。
使用json格式传输数据的客户端代码如下:
content type: application/JSON;charset=utf-8 ,
数据类型: json ,//json不支持跨域请求,只能使用jsonp。
数据:{
用户:JSON.stringify(用户)
成功:函数(数据){
$( #用户名)[0]。innerHTML=data.user _ name
$(#user_teleNum)[0]。innerHTML=data.user _ teleNum
$(#user_ID)[0]。innerHTML=data.user _ ID
错误:函数(){
Alert(“请求超时错误!”);
但是,单纯使用json无法支持跨域的资源请求。为了解决这个问题,我们需要采用jsonp数据交互协议。众所周知,js文件的调用不受是否跨域的限制,所以如果想通过纯web跨域访问数据,只能尝试在远程服务器上将json数据封装成js格式文件,供客户端调用和进一步处理。这就是jsonp协议的原理。该协议的一个关键点是允许用户向服务器传递一个回调参数,然后服务器在返回数据时将这个回调参数作为函数名包装JSON数据,这样客户端就可以随意定制自己的函数来自动处理返回的数据。
简单来说,json不支持跨域,但是js可以跨域。所以json数据在服务器端被客户端提供的JS函数封装,然后函数提供给客户端调用,从而获得jsON数据。
在开发过程中,如果出现类似“access-control-allow-origin不允许origin * * * * *的错误。”,可能是json数据不支持跨域造成的,要考虑jsonp协议。
如果出现类似“语法错误:意外标记:的错误。parseerror。可能是返回的json数据没有被“回调”传递的函数名封装。
客户端代码如下:
$(function () {
var用户={
用户名“:”HelloWorld
$.ajax({
网址: http://localhost:8080/Changyou/UserInfo ,
类型: POST ,
content type: application/JSON;charset=utf-8 ,
数据类型: jsonp ,//json不支持跨域请求,只能使用jsonp。
数据:{
用户:JSON.stringify(用户)
Jsonp: callback ,//传递给请求处理程序或页面以获取Jsonp回调函数名称的参数名,默认为callback。
JsonpCallback: userHandler ,//用户定义的jsonp回调函数的名称。默认是jQuery自动生成的随机函数名,也可以写“?”,jQuery会自动为您处理数据
成功:函数(数据){
$( #用户名)[0]。innerHTML=data.user _ name
$(#user_teleNum)[0]。innerHTML=data.user _ teleNum
$(#user_ID)[0]。innerHTML=data.user _ ID
错误:函数(){
Alert(“请求超时错误!”);
受保护的void doPost(HttpServletRequest请求,HttpServletResponse响应)引发ServletException,IOException {
response . set content type( application/JSON;charset=utf-8 );
String username=新字符串(request.getParameter(user )。getBytes(ISO-8859-1 ), utf-8 )。
String callback=新字符串(request.getParameter(callback )。getBytes(ISO-8859-1 ), utf-8 )。
System.out.println(接收数据:用户名);
system . out . println( callback: callback 的值);
JSON object user=JSON object . from object(用户名);
System.out.println(收到的用户名: user . get( username ));
JSON object userinfo=new JSON object();
Userinfo.put(用户名,张);
userinfo.put(user_teleNum , 18810011111 );
userinfo.put(user_ID , 123456789098765432 );
PrintWriter out=response . getwriter();
string backInfo=callback ( userinfo . tostring());//将json数据封装在回调函数中,提供给客户端。
out . print(backInfo);
out . close();
虽然客户端没有实现userHandler函数,但是它可以成功运行。原因是jquery在处理jsonp类型的ajax时,会自动为你生成一个回调函数,并取出数据供success属性方法调用。
Json是一种数据格式。
Jsonp是一种数据调用方式。
你可以简单理解为带回调的json就是jsonp。