如何解决跨域

什么是跨域

跨域问题就是浏览器同源策略所导致的。同源策略是一个重要的安全策略，它用于限制一个origin的文档或者它加载的脚本如何能与另一个源的资源进行交互。它能帮助阻隔恶意文档，减少可能被攻击的媒介。

怎样才是同源

协议 域名 端口三者必须一致
ps: http默认端口为80 https默认端口为443
http://www.example.com:80 === http://www.example.com
https://www.example.com:443 === https://www.example.com

如何解决跨域

1.CORS

//nodejs端解决方式，或者可以使用第三方中间件，koa-cors/express-cors
app.use(async (ctx, next) => {
  ctx.set("Access-Control-Allow-Origin", ctx.headers.origin);
  ctx.set("Access-Control-Allow-Credentials", true);
  ctx.set("Access-Control-Request-Method", "PUT,POST,GET,DELETE,OPTIONS");
  ctx.set(
    "Access-Control-Allow-Headers",
    "Origin, X-Requested-With, Content-Type, Accept, cc"
  );
  if (ctx.method === "OPTIONS") {
    ctx.status = 204;
    return;
  }
  await next();
});

2.node正向代理

//webpack配置
devServer: {
    port: 8000,
    proxy: {
      "/api": {
        target: "http://localhost:8080"
      }
    }
  }

3.Nginx反向代理 没用过

4.JSONP 没用过

5.websocket 可以建立持久链接，做实时数据的处理

6.ifame postMessage通信

7.document.domain/window.location.hash/window.name

参考链接：
https://juejin.cn/post/6844904126246027278#heading-2