前端跨域问题如何解决

229 阅读1分钟

nginx/cors/http-proxy等为常用的前端处理跨域方式

  1. jsonp 在页面插入一个 script标签,地址栏增加 cb 函数,后端接受到请求后,返回执行 cb(后端要返回给前端的数据) ,缺点:只支持 get
  2. cors 后端 配置权限控制允许源,将前端源写入
  3. postMessage 两个页面可以访问 iframe,一方发 postMessage ,一方接受 onmessage 接受,postMessage 第一个传数据,第二个传要发送目标的源
  4. document.domain 二级域名通信,子域父域 iframe,父子域分别设置 domain 为同一个
  5. window.name 空字符串 ,iframe,需要a/b两个同源页面c一个不同源的页面,a 引用 c, c把数据放在 window.name,把c引用改到b,a/b在同源即可访问
  6. location.hash iframe 需要 a/b 两个同源页面c一个不同源页面,a传hash给c,c接受hash数据后,传数据给b,b寻找到a修改a的hash,将c传来的数据携带过去
  7. http-proxy 中间件
  8. nginx,配置 头,权限控制允许源,将前端源写入
  9. websocket 不存在跨域,客户端用 WebSocket 创建 ws对象, onopen,send发送数据,onmessage 接受数据,node 端可以使用 ws 包,创建 wss 对象,服务端on('connection')监听连接,on('message')获取数据,send发送数据