前端跨域记录

Posted 2020-10-06 落落月

一、跨域定义及类型

定义：只要协议、域名、端口有任何一个不同，都被当做不同的域。

类型：（由于浏览器的同源策略）

1）浏览器中不同域的框架之间不能进行js交互操作；

2）不能通过ajax去请求不同源中的文档；

注意：由于协议和端口造成的跨域，前端无法解决。

 

跨域处理：

1、document.domain

用于处于跨域的第一种类型，iframe类型。

例子：

A页面：http://www.baidu.com/a.html

B页面：http://www.google.com/b.html（作为iframe页面嵌入到A页面中）

 

A页面中：

var iframe = document.getElementById(‘iframe‘);
var win = iframe.contentWindow;
var doc = win.document;
console.log(doc); //报错

结论：A页面可以得到B页面的window对象，但无法获取window对象的属性和方法；

使用document.domain设置两个页面的主域相同。（注意：主域只能设置为自身或者更高一级的父域）

A页面设置document.domain = ‘baidu.com’；B页面设置document.domain = ‘baidu.com’；

这样便可以进行父子域的js交互。