jsonp 解决跨域传输
JSONP是JSON with Padding的略称。它是一个非官方的协议,它允许在服务器端集成Script tags返回至客户端,通过javascript callback的形式实现跨域访问(这仅仅是JSONP简单的实现形式)
背景: 自己的网站简称A要使用B网站提供的json数据。首先想到的是在A网站的javascript代码里通过Ajax异步请求B网站获取json数据,但是浏览器会禁止这种做法,因为A和B是不同域的。
解决办法:浏览器允许调用不同域的javascript代码文件.<script>标签的src属性并不被同源策略所约束,所以可以获取任何服务器上脚本并执行
A网站
<script type="text/javascript">
function addScriptTag(src){
var script = document.createElement('script');
script.setAttribute("type","text/javascript");
script.src = src;
document.body.appendChild(script);
}
window.onload = function(){
//调用远程服务
addScriptTag("http://localhost:20002/MyService.ashx?callback=person");
}
//回调函数person
function person(data) {
alert(data.name + " is a " + data.sex);
}
</script>
B网站 http://localhost:20002/MyService.ashx?callback=person 可以返回json数据
jQuery框架也当然支持JSONP,可以使用$.getJSON(url,[data],[callback])方法(详细可以参考http://api.jquery.com/jQuery.getJSON/)。那我们就来修改下程序A的代码,改用jQuery的getJSON方法来实现(下面的例子没用用到向服务传参,所以只写了getJSON(url,[callback])):
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
$.getJSON("http://localhost:20002/MyService.ashx?callback=?",function(data){
alert(data.name + " is a a" + data.sex);
});
</script>
jsonp 解决跨域传输的更多相关文章
- 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以何种格式来交换数据?第二个是跨域的 ...
- 详解Jquery和AngularJs,Servlet中jsonp解决跨域问题(转)
众所周知,jsonp可以解决跨域问题,下面是我在查阅资料和实际项目使用后的一些总结. Jquery中jsonp的使用 //myUrl = "http://localhost:8090/api ...
- 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 ...
- ajax使用jsonp解决跨域问题
发现这几篇博客写的不错,转载过来看: js跨域及解决方案 http://www.cnblogs.com/oneword/archive/2012/12/03/2799443.html 如何解决aj ...
- 深入了解jsonp解决跨域访问
在这个项目中,我们做的充分利用jsonp这是一个特点跨界,完成简单的单点登录认证和权限控制的统一.道,各有各的优点.各有各的优点,选择什么方式实现全然取决于我们自己或者项目经理的开发经验,对各种框架的 ...
- 什么是jsonp?——使用jsonp解决跨域请求问题
我们在使用ajax请求的时候经常会产生跨域问题,这是由于浏览器的同源策略导致的.所谓同源,即域名.协议.端口均相同,否则不管是静态页面还是动态网页或者web服务都无法通过ajax正常请求.有时候,我们 ...
随机推荐
- webpack安装和简单配置
1.webpack是一个基于node的项目,所以先装好node和npm 参考我的随笔:https://www.cnblogs.com/jtnote/p/6230384.html 2.先创建 ...
- Ubuntu 16.04安装各种软件
Ubuntu 16.04发布了,带来了很多新特性,同样也依然带着很多不习惯的东西,所以装完系统后还要进行一系列的优化. 1.删除libreoffice libreoffice虽然是开源的,但是Java ...
- 实用的 集合工具类 和 String工具类
集合工具类:CollectionUtil method: 1.isNotEmpty() 不为空 2.isEmpty() 为空 举例:map集合 Map<String,String ...
- 关于在python manage.py createsuperuser时报django.db.utils.OperationalError: no such table: auth_user的解决办法
在stackflow上看到解决的办法是需要进行数据路的migrate:https://stackoverflow.com/questions/39071093/django-db-utils-oper ...
- MySQL中InnoDB全文检索
InnoDB存储引擎从1.2.x开始支持全文索引技术,其采用full inverted index的方式.在InnoDB存储引擎中,将(DocumentID,Postition)视为一个ilist.因 ...
- 江卓尔与比特币增发,谣言or先知-千氪
最近,很多圈内人都在讨论比特币是否应该增发,但等等,比特币真的会增发吗?到底是真有增发计划还是某些人别有用心地在散布谣言? 那么消息是从哪里出来的?北京时间 2 月 10 日晚,莱比特矿池创始人江卓尔 ...
- vuejs组件通信
<body> <div id="example"> <father></father> </div> </body ...
- Hexo+yilia添加helper-live2d插件宠物动画,很好玩的哦~~
个人主页:https://www.yuehan.online 现在博客:www.wangyurui.top 安装模块: 博客根目录选择cmd命令窗口或者git bash 输入以下代码,安装插件 操作: ...
- Java基础—String总结
特点 String不属于8种基本数据类型,String是一个对象. 因为对象的默认值是null,所以String的默认值也是null:但它又是一种特殊的对象,有其它对象没有的一些特性. String实 ...
- spring RMI的使用
Spring整合RMI的原理 客户端的核心是RmiProxyFactoryBean,包含serviceURL属性和serviceInterface属性. 通过JRMP访问服务.JRMP JRMP:ja ...