入门级跨域理解

324 阅读1分钟

前言

关于跨域,在此之前,我的理解一直都是如面试题中解答的那样,两个网站之间协议、域名、端口不同则不能相互访问数据就是跨域。然而在实际项目中,对于联调过程的代理总一知半解,在各种抛根问底后做一下记录并分享给和我一样的同学。

什么是跨域

跨域是指浏览器端为了安全实施JavaScript而限制其不能执行其他网站的脚本。是由浏览器的同源策略导致的。

注意点:是浏览器行为,服务端不存在跨域。

什么是同源策略

即请求中的url地址,必须与浏览器上的url地址处于同域上,也就是域名,端口,协议相同。 同源策略限制了如下行为:

  • Cookie、LocalStorage 和 IndexDB 无法读取
  • DOM 和 JS 对象无法获取
  • Ajax请求发送不出去

注意点:localhost 调用 127.0.0.1 不符合同源策略,跨域

实际开发中联调过程解决跨域的原理

在开发中,一般会使用webpack-dev-server启动一个使用express的Http服务器。然后配置请求代理,在浏览器请求发出后本地服务器拦截并指向配置的后端资源服务器,拿到数据后返回。

其他解决跨域的办法

这里不做记录,手动搜索可找到很多文章详解。按需查找使用。

帮助理解,推荐如下:


拙略见解,如有瑕疵请评论指教