详解Jquery和AngularJs,Servlet中jsonp解决跨域问题(转)
众所周知,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);
}
- jsonp只能使用get请求,解决同源问题,返回javascript代码,因为请求javascript文件是没有同源问题的。
- 当请求数据类型为jsonp时,会将callback=jsonpCallback加在url上,http://localhost:8090/api/testcallback=jsonpCallback
- 前台javascript中定义jsonpCallback函数,此函数必须定义在window下,也就是全局的函数,否则找不到。
- 后台获取请求的callback参数值jsonpCallback,返回字符串"jsonpCallback(result)",result为返回结果。
- 请求返回的是script tag,首先会调用jsonpCallback函数,不管是否找到该函数,都会调用success函数。
- 如果没有定义jsonp和jsonpCallback,jsonp默认为"callback",jsonpCallback会是Jquery自动生成的函数名。
angularJS中jsonp的使用
myUrl = "http://localhost:8090/api/testcallback=JSON_CALLBACK";
$http.jsonp(myUrl).success(
function(data){
alert(data);
}
);
- angularJS中使用$http.jsonp函数
- 指定callback和回调函数名,函数名为JSON_CALLBACK时,会调用success回调函数,JSON_CALLBACK必须全为大写。
- 也可以指定其它回调函数,但必须是定义在window下的全局函数。
- url中必须加上callback
- 当callback为JSON_CALLBACK时,只会调用success,即使window中有JSON_CALLBACK函数,也不会调用该函数。
@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解决跨域问题(转)的更多相关文章
- jquery及原生javascript对jsonp解决跨域问题实例详解
jquery方式 前端: $.ajax({ url: 'http://m.xxx.tv/goLottery', data: { data: data }, type: 'GET', dataType: ...
- HTML5中Access-Control-Allow-Origin解决跨域问题
www.111cn.net 更新:2015-01-07 编辑:flyfox 来源:转载 跨域在开发中一些是一个比较常见的问题虽然有json或者xml来解决,现在html5开始流行了,我们可以通过Acc ...
- AJAX跨域问题解决方法(2)——JSONP解决跨域
JSONP是什么?JSON全称为JSON with Padding,是JSON的一种补充的使用方式,不是官方协议. 使用JSONP服务器后台要改动吗?JSONP不同于一般的ajax请求返回json对象 ...
- JSONP解决跨域问题,什么是JSONP(转)
原文链接:https://www.cnblogs.com/xinxingyu/p/6075881.html 说到AJAX就会不可避免的面临两个问题,第一个是AJAX以何种格式来交换数据?第二个是跨域的 ...
- jsonp解决跨域问题
日常开发网页中,时常遇到跨域问题,通常解决办法:后端提供的接口支持jsonp格式,前端采用dataType:jsonp. 一:Jquery封装的AJAX,dataType:jsonp格式的方法: $. ...
- CORS,jsonp解决跨域问题
同源和跨域 同源策略(Same origin policy)是一种约定,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,则浏览器的正常功能可能都会受到影响.可以说Web是构建在同源策略基础之上 ...
- 非jsonp解决跨域问题
1.服务器端解决跨域问题:配置filter在filter中设置请求头import java.io.IOException; import javax.servlet.Filter;import jav ...
- jQuery中jsonp的跨域处理,no access-control-allow-origin,unexpected token
引言 ajax跨域就无法成功获取数据了,需要通过jsonp来处理 报错如下 1.改为jsonp var targeturl = ajaxurl+"?g=Api&m="+m+ ...
- 深入了解jsonp解决跨域访问
在这个项目中,我们做的充分利用jsonp这是一个特点跨界,完成简单的单点登录认证和权限控制的统一.道,各有各的优点.各有各的优点,选择什么方式实现全然取决于我们自己或者项目经理的开发经验,对各种框架的 ...
随机推荐
- CUBRID学习笔记 34 net参数化查询 cubrid教程示例
using CUBRID.Data.CUBRIDClient; namespace ParameterExample { class Program { static void Main(string ...
- 线程入门之sleep
package com.thread; /** * <sleep:使线程休眠一些时间> * <功能详细描述> * * @author 95Yang */ public clas ...
- Python语言精要---上
下面的记录根据: 麦金尼. 利用Python进行数据分析[M]. 机械工业出版社, 2014. 这本教材的附录部分总结而来 Python的设计特点是重视可读性,简洁性以及明确性 Python不推荐 ...
- 关于ListView嵌套GridView中的onItemClickListener失效问题
一开始在ListView中设置了onItemClickListener,在里面Log输出Item列表的位置,完全没有反应, 网上大部分说的什么把子组件屏蔽掉(而且好多都是转载的一样的), 可是我希望的 ...
- 个人博客 week1
1:看完教材后不懂的几个问题: (1):团队合作中每个人分工而行,如何保证比较完善的各人之间的信息共享? (2):敏捷开发如何保证开发的效率?即在进行大项目的开发时敏捷开发看上去会很混乱. (3):黑 ...
- Linux_常用命令_03_磁盘/挂载_信息查看
1. 1.1. mount 不带参数的话,显示的是 当前已经挂载的情况 1.2. df 不带参数的话,硬盘分区状况查询 2. 2.1. cat /proc/partitions 2.2. fdisk ...
- 【Todo】Zookeeper学习
首先,Zookeeper是基于Paxos来进行分布式选举管理的,Paxos的内容可以参考我另一篇文章:http://www.cnblogs.com/charlesblc/p/6037004.html ...
- mustache.js渲染带事件的模板
http://zccst.iteye.com/blog/2183111 最近遇到这样一个问题,预览内容可点击,问题是通过$.Mustache.render("templateId" ...
- JSP中RequestDispatcher的用法
RequestDispatcher是一个Web资源的包装器,可以用来把当前request传递到该资源,或者把新的资源包括到当前响应中.RequestDispatcher接口中定义了两个方法:inclu ...
- HTTP请求过程详解
以请求新浪的首页为例,总结HTTP请求的流程: 步骤1:浏览器首先向服务器发送HTTP请求,请求包括: 方法:GET还是POST,GET仅请求资源,POST会附带用户数据: 路径:/full/url/ ...