跨域解决方案js（跨域解决方案session）

科技前沿 • 2025-04-19 12:26 • 阅读 51

大家好，我是讯享网，很高兴认识大家。

这里说的js跨域是指通过js在不同的域之间进行数据传输或通信，比如用ajax向一个不同的域请求数据，或者通过js获取页面中不同域的框架中(iframe)的数据。只要协议、域名、端口有任何一个不同，都被当作是不同的域。

讯享网

特别注意两点：

要解决跨域的问题，我们可以使用以下几种方法：

JSONP包含两部分：回调函数和数据。
回调函数：当响应到来时要放在当前页面被调用的函数。
数据：就是传入回调函数中的json数据，也就是回调函数的参数了。

jsonp虽然很简单，但是有如下缺点：

浏览器同源策略限制：

所以我们就要用到document.domain

1) 在页面http:// www.a.com/dir/a.html中设置document.domain：

2) 在http:// script.a.com/dir/b.html也需要显示的设置document.domain

注意，document.domain的设置是有限制的：

window的name属性特征：name 值在不同的页面（甚至不同域名）加载后依旧存在，并且可以支持非常长的 name 值（2MB），即在一个窗口(window)的生命周期内,窗口载入的所有的页面都是共享一个window.name的，每个页面window.name都有读写的权限。

　　正是由于window的name属性的特征，所以可以使用window.name来进行跨域。
　　举例：
　　1）在一个a.html页面中，有如下代码：

2）再在b.html中读取window.name的值：

3）a.html载入3秒后，跳转到b.html页面中，结果为

接下来使用window.name进行跨域举例

　window.postMessage(message,targetOrigin) 方法是html5新引进的特性，可以使用它来向其它的window对象发送消息，无论这个window对象是属于同源或不同源(可实现跨域)，目前IE8+、FireFox、Chrome、Opera等浏览器都已经支持window.postMessage方法。
　　message：为要发送的消息，类型只能为字符串；
　　targetOrigin：用来限定接收消息的那个window对象所在的域，如果不想限定域，可以使用通配符 “*”。

1)创建www.test.com/a.html页面代码：

2)创建www.script.com/b.html页面代码：

CORS：一种跨域访问的机制，可以让AJAX实现跨域访问；CORS允许一个域上的网络应用向另一个域提交跨域AJAX请求。
服务器设置Access-Control-Allow-Origin HTTP响应头之后，浏览器将会允许跨域请求．
就是使用自定义的HTTP头部让浏览器与服务器进行沟通，从而决定请求或响应是应该成功，还是应该失败。

1) IE中对CORS的实现是通过xdr

2) 其它浏览器中的实现就在xhr中

3) 实现跨浏览器的CORS

2) b.html响应请求后再将通过修改a.html的hash值来传递数据，代码如下：

3) test.com域下的c.html代码：

web sockets：是一种浏览器的API，它的目标是在一个单独的持久连接上提供全双工、双向通信。(同源策略对web sockets不适用)

web sockets原理：在JS创建了web socket之后，会有一个HTTP请求发送到浏览器以发起连接。取得服务器响应后，建立的连接会使用HTTP升级从HTTP协议交换为web sockt协议。

Flash URLLoader是一种很普遍的跨域解决方案，不过需要支持iOS的话，这个方案就不可行了。 

以上八种方法，可以根据项目的实际情况来进行选择应用，个人认为window.name的方法既不复杂，也能兼容到几乎所有浏览器，这真是极好的一种跨域方法。

原文链接：https://blog.csdn.net/wangchengiii/article/details/

跨域解决方案js（跨域解决方案session）

相关推荐