jsonp跨域请求,动态script标签实现跨域
1、什么是跨域
首先一个域名地址的组成是:
http://www.xxx.com:8080/xxx/xxx.jsp
协议子域名主域名端口号请求资源地址
当协议、子域名、主域名、端口号中任意一个不相同时,都算作是不同域。
不同域之间相互请求资源,就算作“跨域”。而这是被浏览器的安全机制所禁止的。
2、这里要说的是处理跨域其中一个方法——jsonp
jsonp可用于解决主流浏览器的跨域数据访问的问题,其中的原理是利用<script>元素的跨域能力
科普基础知识:web页面上凡是拥有“src”这个属性的标签都拥有跨域的能力,比如<script>,<img>
JSONP,JSON width Padding,采用json 作为传输数据的载体,具体的实现通过script标签跨域应用来完成。
3、实现方法说明
a,客户端(我的域名)页面代码控制
b,服务端(提供服务和数据)的数据可控。
4、举例实现方法
<script type="text/javascript">
//////////////////////////////////
// jQuery的调用
//////////////////////////////////
$.ajax({
crossDomain :true,
url: 'http://s.weibo.com/ajax/jsonp/suggestion?key=a', //不同的域
type: 'GET', // jsonp模式只有GET是合法的
dataType: 'jsonp', // 数据类型
jsonp: '_cb', // 指定回调函数名,与服务器端接收的一致,并回传回来
success: function(data) {
console.log(data);
}
});
//////////////////////////////////
// jsonp的原理
//////////////////////////////////
//服务器调用的全局函数,用来接受数据
function getResult(o) {
console.log(o.data);
}
</script>
<script type="text/javascript" src="http://s.weibo.com/ajax/jsonp/suggestion?_cb=getResult"></script>
例子中用的是微博API,查看更多http://open.weibo.com/wiki/%E5%BE%AE%E5%8D%9AAPI
jsonp跨域请求,动态script标签实现跨域的更多相关文章
- 动态Script标签 解决跨域问题
动态Script 解决跨域问题 1.动态创建scriptcreateScript : function(src){ var varScript = document.createElement(&q ...
- 动态script标签同步加载 ps:无打包编译,静态实现静态资源入口动态配置,无编译打包静态资源添加版本号
/**功能:创建动态标签加载css ,js文件,重点是js文件,利用onloading加递归实现动态标签的同步加载用法:在html文件body底部script内部声明并调用下列函数,obj中写要加载的 ...
- 跨域访问 - 跨域请求 同源策略概念对跨域请求的影响 及几种解决跨域请求的方法如 jsonp
为什么会设置同源策略 > 适用于浏览器的一种资源访问策略 > 同源策略(Same origin policy)是一种约定,它是浏览器最核 心也最 基本的安全功能,如果缺少了同源策略,则浏览 ...
- 循序渐进Python3(十一) --6-- Ajax 实现跨域请求 jsonp 和 cors
Ajax操作如何实现跨域请求? Ajax (XMLHttpRequest)请求受到同源策略的限制. Ajax通过XMLHttpRequest能够与远程的服务器进行信息交互,另外 ...
- AJAX 跨域请求 - JSONP获取JSON数据
Asynchronous JavaScript and XML (Ajax ) 是驱动新一代 Web 站点(流行术语为 Web 2.0 站点)的关键技术.Ajax 允许在不干扰 Web 应用程序的显示 ...
- JSONP(跨域请求) —— 一种非官方跨域数据交互协议
1.JSONP的作用 由于同源策略的限制,XmlHttpRequest只允许请求当前源(域名.协议.端口)的资源,为 了实现跨域请求,可以通过script标签实现跨域请求,然后再服务器端输出JSON数 ...
- AJAX 跨域请求的解决办法:使用 JSONP获取JSON数据
由于受到浏览器的限制,ajax不允许跨域通信.如果尝试从不同的域请求数据,会出现安全错误.如果能控制数据驻留的远程服务器并且每个请求都前往同一域,就可以避免这些安全错误.但是,如果仅停留在自己的服务器 ...
- 【转】AJAX 跨域请求 - JSONP获取JSON数据
来源:http://justcoding.iteye.com/blog/1366102/ Asynchronous JavaScript and XML (Ajax ) 是驱动新一代 Web 站点(流 ...
- ajax跨域请求のJSONP
简单说了一下,JSON是一种基于文本的数据交换方式,或者叫做数据描述格式. JSON的优点: 1.基于纯文本,跨平台传递极其简单: 2.Javascript原生支持,后台语言几乎全部支持: 3.轻量级 ...
随机推荐
- 【SharePoint】K2 for SharePoint 安装笔记【未完工】
0.安装环境说明 0.1.软件版本 OS : Window Server 2012 标准版 SharePoint : 2013标准版 K2 : 4.6.9 0.2.环境结构 SharePoint 20 ...
- hibernate 过滤
1.可以使用@Where的过滤,不过这种过滤式全局的,支持延迟加载. 2.可以使用@Filters,这种过滤不支持延迟加载. @Entity@Table(name = "qc315_tous ...
- ViewPager+Fragment 滑动菜单效果 实现步骤
1.xml中引用ViewPager <android.support.v4.view.ViewPager android:id="@+id/viewPa ...
- .NET面试题汇总
目录 本次给大家介绍的是我收集以及自己个人保存一些.NET面试题 简介 1.C# 值类型和引用类型的区别 2.如何使得一个类型可以在foreach 语句中使用 3.sealed修饰的类有什么特点 4. ...
- 如何用openssl命令行生成证书
老大要我在web server里面加上https功能,可是但就使用openssl生成证书就耗费了我两天时间,网上有很多相关的资料,但是都写的很复杂, 照着他们的来,还是走了很多弯路. 我总结一下,步骤 ...
- hibernate出现 org.hibernate.PropertyNotFoundException: field [departmen] not found on cn.itcast.hibernate.domain.Employee1错误
hibernate出现 org.hibernate.PropertyNotFoundException: field [departmen] not found on cn.itcast.hibern ...
- 机器学习实战之SVM
一引言: 支持向量机这部分确实很多,想要真正的去理解它,不仅仅知道理论,还要进行相关的代码编写和测试,二者想和结合,才能更好的帮助我们理解SVM这一非常优秀的分类算法 支持向量机是一种二类分类算法,假 ...
- 大数据:Hive常用参数调优
1.limit限制调整 一般情况下,Limit语句还是需要执行整个查询语句,然后再返回部分结果. 有一个配置属性可以开启,避免这种情况---对数据源进行抽样 hive.limit.optimize.e ...
- php部分--题目:投票 重点:两个div套用,显示百分比;
1.建立两个表格:要显示百分比的话,就要在选项表中加上一列标记number 2.链接数据库,并对题目和选项进行显示 <?php $db=new MySQLi("localhost&qu ...
- 九度OJ 1059:abc (基础题)
时间限制:1 秒 内存限制:32 兆 特殊判题:否 提交:3642 解决:2869 题目描述: 设a.b.c均是0到9之间的数字,abc.bcc是两个三位数,且有:abc+bcc=532.求满足条件的 ...