跨域到底是什么

什么是跨域

简单来说跨域是指一个域下的文档或脚本想要去去请求另一个域下的资源
其实一些像A链接、重定向、表单提交的资源跳转,像 <link>、<script>、<img>、<frame> 等dom标签,还有样式中 background:url()、@font-face() 等嵌入的文件外链,又比如一些像 js 发起的ajax请求、dom 和 js 对象的跨域操作等等都是跨域,我们通常所说的跨域,大多是由浏览器同源策略限制引起的一类请求场景,这里你可能注意到了同源策略,那么浏览器的同源策略是什么呢?

浏览器同源策略

同源策略/SOP(Same origin policy)是一种约定,由 Netscape 公司1995年引入浏览器,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,浏览器很容易受到 XSS、CSFR 等攻击
同源同源,什么是源呢?源指的是 协议、域名、端口 ,那么同源即三者相同,即便是不同的域名指向同一个ip地址,也不同源
我们来看一个域名组成,我们以 http://www.hahaha.com/abc/a.js 为例

http:// --> 协议
www --> 子域名
hahaha.com --> 主域名
80 --> 端口(http:// 默认端口是80)
abc/a.js --> 请求资源路径

那么我们以这个域名的源为例,来与下面这些做下对比

跨域到底是什么
而在不同源的情况下,同源策略限制了我们

  • Cookie、LocalStorage、IndexedDB 等存储性内容无法读取
  • DOM 节点和 Js对象无法获得
  • AJAX 请求发送后,结果被浏览器拦截(注意是 请求发送出去了,也拿到结果了,只是被浏览器截胡了)

到了这里,相信你对跨域已经有所了解了,那么我们如何有效的规避跨域呢,应该说如何解决跨域问题,因为我们在开发过程中免不了要跨域,针对不同的类型,解决跨域的方式也有很多

方式较多,可以点击进去看 解决跨域具体方式