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标签实现跨域的更多相关文章

  1. 动态Script标签 解决跨域问题

     动态Script 解决跨域问题 1.动态创建scriptcreateScript : function(src){ var varScript = document.createElement(&q ...

  2. 动态script标签同步加载 ps:无打包编译,静态实现静态资源入口动态配置,无编译打包静态资源添加版本号

    /**功能:创建动态标签加载css ,js文件,重点是js文件,利用onloading加递归实现动态标签的同步加载用法:在html文件body底部script内部声明并调用下列函数,obj中写要加载的 ...

  3. 跨域访问 - 跨域请求 同源策略概念对跨域请求的影响 及几种解决跨域请求的方法如 jsonp

    为什么会设置同源策略 > 适用于浏览器的一种资源访问策略 > 同源策略(Same origin policy)是一种约定,它是浏览器最核 心也最 基本的安全功能,如果缺少了同源策略,则浏览 ...

  4. 循序渐进Python3(十一) --6--  Ajax 实现跨域请求 jsonp 和 cors

    Ajax操作如何实现跨域请求?       Ajax (XMLHttpRequest)请求受到同源策略的限制.       Ajax通过XMLHttpRequest能够与远程的服务器进行信息交互,另外 ...

  5. AJAX 跨域请求 - JSONP获取JSON数据

    Asynchronous JavaScript and XML (Ajax ) 是驱动新一代 Web 站点(流行术语为 Web 2.0 站点)的关键技术.Ajax 允许在不干扰 Web 应用程序的显示 ...

  6. JSONP(跨域请求) —— 一种非官方跨域数据交互协议

    1.JSONP的作用 由于同源策略的限制,XmlHttpRequest只允许请求当前源(域名.协议.端口)的资源,为 了实现跨域请求,可以通过script标签实现跨域请求,然后再服务器端输出JSON数 ...

  7. AJAX 跨域请求的解决办法:使用 JSONP获取JSON数据

    由于受到浏览器的限制,ajax不允许跨域通信.如果尝试从不同的域请求数据,会出现安全错误.如果能控制数据驻留的远程服务器并且每个请求都前往同一域,就可以避免这些安全错误.但是,如果仅停留在自己的服务器 ...

  8. 【转】AJAX 跨域请求 - JSONP获取JSON数据

    来源:http://justcoding.iteye.com/blog/1366102/ Asynchronous JavaScript and XML (Ajax ) 是驱动新一代 Web 站点(流 ...

  9. ajax跨域请求のJSONP

    简单说了一下,JSON是一种基于文本的数据交换方式,或者叫做数据描述格式. JSON的优点: 1.基于纯文本,跨平台传递极其简单: 2.Javascript原生支持,后台语言几乎全部支持: 3.轻量级 ...

随机推荐

  1. 每天一个 Linux 命令(57):ss命令

    ss是Socket Statistics的缩写.顾名思义,ss命令可以用来获取socket统计信息,它可以显示和netstat类似的内容.但ss的优势在于它能够显示更多更详细的有关TCP和连接状态的信 ...

  2. cart算法

  3. TP框架模板中ifelse

    {if $_username}<ul class="afterLogin">    <li class="username"><a ...

  4. 【Python】字典~深入篇

    字典的定义 字典是一系列键值对,字典用放在{}一系列键值对表示 info = {','city':'KunMing'} 字典增.删.改.查 增加新元素 指定字典名,用方括号括起来的键和相关的值 inf ...

  5. APU的Vsense引脚的作用

    JACK学习文档推荐: 开关电源PCB布局注意事项 开关电源PCB布线注意事项 一.Sense电压检测(FB) “Sense+”和“Sense-”,就是四线制中的电压检测线,high-sense 和l ...

  6. POJ 1698 Alice&#39;s Chance(最大流+拆点)

    POJ 1698 Alice's Chance 题目链接 题意:拍n部电影.每部电影要在前w星期完毕,而且一周仅仅有一些天是能够拍的,每部电影有个须要的总时间,问能否拍完电影 思路:源点向每部电影连边 ...

  7. 在Editplus中配置java的(带包)编译(javac)和执行(java)的方法

    配置的前提是电脑安装了JDK而且配置好了相关的环境变量(JAVA_HOME,path和classpath). 配置好后在命令行中输入javac和java验证是否配置成功: 假设出现上面的情况则说明配置 ...

  8. Bootstrap学习速查表(四) 栅格系统

    Bootstrap框架的网格系统工作原理如下: 1.数据行(.row)必须包含在容器(.container)中,以便为其赋予合适的对齐方式和内距(padding).如: 2.在行(.row)中可以添加 ...

  9. 请设计一个函数,用来判断在一个矩阵中是否存在一条包含某字符串所有字符的路径。路径可以从矩阵中的任意一个格子开始,每一步可以在矩阵中向左,向右,向上,向下移动一个格子。如果一条路径经过了矩阵中的某一个格子,则该路径不能再进入该格子。 例如 a b c e s f c s a d e e 矩阵中包含一条字符串"bccced"的路径,但是矩阵中不包含"abcb"路径,因为字符串的第一个字符b占据了矩阵中

    // test20.cpp : 定义控制台应用程序的入口点. // #include "stdafx.h" #include<iostream> #include< ...

  10. VSTS跟Kubernetes整合进行CI/CD

    利用VSTS跟Kubernetes整合进行CI/CD   为什么VSTS要搭配Kubernetes? 通常我们在开发管理软件项目的时候都会碰到一个很头痛的问题,就是开发.测试.生产环境不一致,导致开发 ...