如何解决跨域问题


JSONP:

原理是:动态插入`script`标签,通过`script`标签引入一个`js`文件,这个js文件载入成功后会执行我们在url参数中指定的函数,并且会把我们需要的`json`数据作为参数传入。

由于同源策略的限制,`XmlHttpRequest`只允许请求当前源(域名、协议、端口)的资源,为了实现跨域请求,可以通过`script`标签实现跨域请求,然后在服务端输出JSON数据并执行回调函数,从而解决了跨域的数据请求。

优点是兼容性好,简单易用,支持浏览器与服务器双向通信。缺点是只支持GET请求。

`JSONP`:`json+padding`(内填充),顾名思义,就是把JSON填充到一个盒子里

>CORS

服务器端对于`CORS`的支持,主要就是通过设置`Access-Control-Allow-Origin`来进行的。如果浏览器检测到相应的设置,就可以允许`Ajax`进行跨域的访问。

>通过修改document.domain来跨子域

将子域和主域的`document.domain`设为同一个主域.前提条件:这两个域名必须属于同一个基础域名!而且所用的协议,端口都要一致,否则无法利用`document.domain`进行跨域

主域相同的使用`document.domain`

>使用window.name来进行跨域

`window`对象有个`name`属性,该属性有个特征:即在一个窗口(window)的生命周期内,窗口载入的所有的页面都是共享一个`window.name`的,每个页面对`window.name`都有读写的权限,`window.name`是持久存在一个窗口载入过的所有页面中的

>使用HTML5中新引进的`window.postMessage`方法来跨域传送数据

还有flash、在服务器上设置代理页面等跨域方式。个人认为`window.name`的方法既不复杂,也能兼容到几乎所有浏览器,这真是极好的一种跨域方法。
时间: 2024-10-06 10:27:09

如何解决跨域问题的相关文章

前端解决跨域问题的8种方案(最新最全)

原文:http://www.cnblogs.com/JChen666/p/3399951.html 1.同源策略如下: URL 说明 是否允许通信 http://www.a.com/a.jshttp://www.a.com/b.js 同一域名下 允许 http://www.a.com/lab/a.jshttp://www.a.com/script/b.js 同一域名下不同文件夹 允许 http://www.a.com:8000/a.jshttp://www.a.com/b.js 同一域名,不同端

web api 解决跨域的问题

web api 总是会遇到跨域的问题,今天我找到了如下方法解决跨域: 1: a:在配置文件中的 加上如下代码 <system.webServer> <httpProtocol> <customHeaders> <add name="Access-Control-Allow-Origin" value="*" /> <add name="Access-Control-Allow-Headers"

前端解决跨域问题的8种方案(最新最全)(转)

1.同源策略如下: URL说明是否允许通信 http://www.a.com/a.jshttp://www.a.com/b.js同一域名下允许 http://www.a.com/lab/a.jshttp://www.a.com/script/b.js同一域名下不同文件夹允许 http://www.a.com:8000/a.jshttp://www.a.com/b.js同一域名,不同端口不允许 http://www.a.com/a.jshttps://www.a.com/b.js同一域名,不同协议

HTML5解决跨域问题

HTML5解决跨域问题 由于浏览器的同源策略,网络连接的跨域访问是不被允许的,XHR对象不能直接与非同源的网站处理数据交互.而同源指的是什么呢?同源的范畴包括:规则(协议),主机号(域名.ip等),端口号. 但是随着开放,共享平台的流行,跨域访问的需求愈加强烈.目前最常用的跨域方案是动态加入script标签,这多少有点hack的意味,跨域访问似乎一直没有什么安全且光明正大的办法. 终于,HTML5提供的XMLHttpRequest Level2实现了跨域访问以及其他的一些新功能.下面我们会详细讨

Ajax 是什么?Ajax 的交互模型?同步和异步的区别?如何解决跨域问题

Ajax 是什么: 1. 通过异步模式,提升了用户体验 2. 优化了浏览器和服务器之间的传输,减少不必要的数据往返,减少了带宽占用 3. Ajax 在客户端运行,承担了一部分本来由服务器承担的工作,减少了大用户量下的服务器负载. Ajax 的最大的特点: 1. Ajax可以实现动态不刷新(局部刷新) 2. readyState 属性 状态 有5个可取值: 0 = 未初始化,1 = 启动, 2 = 发送,3 = 接收,4 = 完成 Ajax 同步和异步的区别: 1. 同步:提交请求 -> 等待服务

前端开发如何独立解决跨域问题

背景 跨域是由浏览器同源策略引起的,是指页面请求的接口地址,必须与页面url地址处于同域上(即域名,端口,协议相同).这是为了防止某域名下的接口被其他域名下的网页非法调用,是浏览器对JavaScript施加的安全限制. 这个措施出发点是好的,但在项目开发的过程中,常常给前端开发者带来麻烦. 由于页面开发中,静态资源是放在本地电脑上的,访问这些资源通常通过IP方式(127.0.0.1)或者localhosts来访问,与线上服务器所在域名不符,不能顺利进行接口调用. 解决跨域问题常用的解决方案有两个

动态Script标签 解决跨域问题

动态Script 解决跨域问题 1.动态创建scriptcreateScript : function(src){ var varScript = document.createElement("script"); if (src != "") { varScript.src = src; } varScript.language = "javascript"; varScript.type = "text/javascript&quo

解决跨域访问

解决跨域访问的方法 1.用响应头 response.setHeader("Access-Control-Allow-Origin","*");//允许哪些服务器访问 response.setHeader("Access-Control-Allow-Methods","GET POST");//允许的提交方式 2.使用代理 3.JSONP 原理:通过JavaScript标签来访问服务器,并接受服务器返回的数据来实现跨域访问 js

前端解决跨域问题的8种方案

原文http://blog.csdn.net/joyhen/article/details/21631833 1.同源策略如下: URL 说明 是否允许通信 http://www.a.com/a.jshttp://www.a.com/b.js 同一域名下 允许 http://www.a.com/lab/a.jshttp://www.a.com/script/b.js 同一域名下不同文件夹 允许 http://www.a.com:8000/a.jshttp://www.a.com/b.js 同一域

非jsonp解决跨域问题

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