前言
为了保证用户信息的安全,防止恶意的网站窃取数据,浏览器制定了同源政策。同源指的是:域名相同、协议相同、端口相同。同源策略一定能够程度上保证了安全,有时候却造成了不方便,由此前端跨域问题就出现了。我们需要跨域获取数据和进行通信。
当一个资源从与该资源本身所在的服务器不同的域或端口请求一个资源时,资源会发起一个跨域 HTTP 请求。
跨域的方法
document.domain
页面可以改变自己的源,但是也有一些限制。只能赋值为当前的子域名和主域名
document.domain = "csdn.net"; // 成功,为当前主域名
docoment.domain = "blog.csdn.net"; // 成功,为当前子域名
document.domain = "taobao.com"; // 失败。不同域
利用document.domain
进行跨域,必须属于同一个域名,而且所用协议和端口都要相同,否则无法通过document.domain
来进行跨域。
例如有一个页面,它的地址是http://www.abc.com/one.html
,在这个页面有一个iframe,它的src是http://abc.com/two.html
,显示这个页面和iframe是不同的域,所以无法在当前页面通过js获取iframe的窗口信息。
这个时候document.domain
就派上用场了。
// 当前页面为 http://www.abc.com/one.html
<iframe id = "iframe" src="http://abc.com/two.html" onload = "test()"></iframe>
<script type="text/javascript">
document.domain = 'abc.com'; //设置成主域
function test(){
console.log(document.getElementById(