众所周知,jsonp可以解决跨域问题,下面是我在查阅资料和实际项目使用后的一些总结。

Jquery中jsonp的使用

//myUrl = "http://localhost:8090/api/test";
$.ajax({
  type:"GET",
  url:myUrl,
  dataType:"jsonp",
  jsonp:"callback",
  jsonpCallback:"jsonpCallback",
  success:function(data){
    alert(data.msg);
  }
});
function jsonpCallback(data){
  alert(data);
}
  1. jsonp只能使用get请求,解决同源问题,返回javascript代码,因为请求javascript文件是没有同源问题的。
  2. 当请求数据类型为jsonp时,会将callback=jsonpCallback加在url上,http://localhost:8090/api/testcallback=jsonpCallback
  3. 前台javascript中定义jsonpCallback函数,此函数必须定义在window下,也就是全局的函数,否则找不到。
  4. 后台获取请求的callback参数值jsonpCallback,返回字符串"jsonpCallback(result)",result为返回结果。
  5. 请求返回的是script tag,首先会调用jsonpCallback函数,不管是否找到该函数,都会调用success函数。
  6. 如果没有定义jsonp和jsonpCallback,jsonp默认为"callback",jsonpCallback会是Jquery自动生成的函数名。

angularJS中jsonp的使用

myUrl = "http://localhost:8090/api/testcallback=JSON_CALLBACK";
$http.jsonp(myUrl).success(
  function(data){
    alert(data);
  }
);
  1. angularJS中使用$http.jsonp函数
  2. 指定callback和回调函数名,函数名为JSON_CALLBACK时,会调用success回调函数,JSON_CALLBACK必须全为大写。
  3. 也可以指定其它回调函数,但必须是定义在window下的全局函数。
  4. url中必须加上callback
  5. 当callback为JSON_CALLBACK时,只会调用success,即使window中有JSON_CALLBACK函数,也不会调用该函数。
 Servlet中的使用
@Override
protectedvoiddoPost(HttpServletRequestreq,HttpServletResponseresp)throwsServletException,IOException{
  resp.setContentType("application/json;charset=UTF-8");
  PrintWriterout=resp.getWriter();
  StringcallbackFunName=req.getParameter("callback");
  StringBuilderstringBuilder=newStringBuilder(callbackFunName);
  stringBuilder.append("(");
  stringBuilder.append(123);
  stringBuilder.append(")");
  out.println(stringBuilder.toString());
  out.print(result);
  out.flush();
  out.close();
}

详解Jquery和AngularJs,Servlet中jsonp解决跨域问题(转)的更多相关文章

  1. jquery及原生javascript对jsonp解决跨域问题实例详解

    jquery方式 前端: $.ajax({ url: 'http://m.xxx.tv/goLottery', data: { data: data }, type: 'GET', dataType: ...

  2. HTML5中Access-Control-Allow-Origin解决跨域问题

    www.111cn.net 更新:2015-01-07 编辑:flyfox 来源:转载 跨域在开发中一些是一个比较常见的问题虽然有json或者xml来解决,现在html5开始流行了,我们可以通过Acc ...

  3. AJAX跨域问题解决方法(2)——JSONP解决跨域

    JSONP是什么?JSON全称为JSON with Padding,是JSON的一种补充的使用方式,不是官方协议. 使用JSONP服务器后台要改动吗?JSONP不同于一般的ajax请求返回json对象 ...

  4. JSONP解决跨域问题,什么是JSONP(转)

    原文链接:https://www.cnblogs.com/xinxingyu/p/6075881.html 说到AJAX就会不可避免的面临两个问题,第一个是AJAX以何种格式来交换数据?第二个是跨域的 ...

  5. jsonp解决跨域问题

    日常开发网页中,时常遇到跨域问题,通常解决办法:后端提供的接口支持jsonp格式,前端采用dataType:jsonp. 一:Jquery封装的AJAX,dataType:jsonp格式的方法: $. ...

  6. CORS,jsonp解决跨域问题

    同源和跨域 同源策略(Same origin policy)是一种约定,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,则浏览器的正常功能可能都会受到影响.可以说Web是构建在同源策略基础之上 ...

  7. 非jsonp解决跨域问题

    1.服务器端解决跨域问题:配置filter在filter中设置请求头import java.io.IOException; import javax.servlet.Filter;import jav ...

  8. jQuery中jsonp的跨域处理,no access-control-allow-origin,unexpected token

    引言 ajax跨域就无法成功获取数据了,需要通过jsonp来处理 报错如下 1.改为jsonp var targeturl = ajaxurl+"?g=Api&m="+m+ ...

  9. 深入了解jsonp解决跨域访问

    在这个项目中,我们做的充分利用jsonp这是一个特点跨界,完成简单的单点登录认证和权限控制的统一.道,各有各的优点.各有各的优点,选择什么方式实现全然取决于我们自己或者项目经理的开发经验,对各种框架的 ...

随机推荐

  1. SQL Server 字符串处理

    ) SET @str='AP-FQC-2014072300004' --获取指定字符第一次出现的位置 SELECT PATINDEX('%-%',@str) --返回:3 --获取指定字符第一次出现的 ...

  2. How much do we need to learn to be a Self-driving Car Engineer?

    Before everything we need programming skills in C++ and Python. One of the suggested book for C++ le ...

  3. More Effective C++ (2)

    接下来的是more effective c++ 11至20条款: 11.禁止异常信息(exceptions)传递到析构函数外.析构函数的调用情况可能有两种:(1)对象正常销毁 (2)异常传播过程中的栈 ...

  4. 一个封装较好的删除方法(Delete)

    前台的引用 @Html.ActionLink(“删除字样”,“后台的删除方法”,new{绑定id},new{@style="样式"});方法,如何要独立使用的话,一般还要使用到相应 ...

  5. openstack 网卡

    桥接基本原理: 物理网卡eth0 br0(桥) tap0,tap1(tap是给vm使用的接口)

  6. OC面向对象及继承

    1. 面向对象它通过给程序中加入扩展语句,把函数“封装”进编程所必需的“对象”中.面向对象的编程语言使得复杂的工作条理清晰.编写容易.说它是一场革命,不是对对象本身而言,而是对它们处理工作的能力而言. ...

  7. 关于css3的自定义字体

    css3的@font-face属性打破了中文页面字体一成不变的格局,但今天本菜在用的时候并不那么爽.开始各种引用外部ttf文件失败.下了300M+的字体文件,苦逼的试了一下午.终于有一个ttf引用成功 ...

  8. iOS开发之Xcode 6更新默认不支持armv7s架构

    最近一次的Xcode 6更新默认不再支持arm7s架构,究竟是要废除不用呢还是仅仅只是一个疏忽? 目前的Xcode 6配置里定义${ARCHS_STANDARD}为armv7, arm64,当然这个定 ...

  9. DOM节点操作

    请尊重知识,请尊重原创 更多资料参考请见  http://www.cezuwang.com/listFilm?page=1&areaId=906&filmTypeId=1  一.创建节 ...

  10. go中间的&和*

    package main import "fmt" func main() { var a int = 1 var b *int = &a var c **int = &a ...