笔者目前主要使用Vue进行项目开发，但是我认为技术栈不重要，js才是最重要的，当时css优秀也是一名优秀的前端小开发(咳咳)，下边步入正题啦

一、跨文档通信API

唠嗑:我认为还是比较常常使用的尤其是对于项目嵌入iframe和open简直不要太好用，哈哈哈哈，咳咳，写文章呢，严肃点

(1) 使用vue-router(push)跳转如何使用(这个其实不能算作跨域)

父页面

     //父页面添加message监听子页面发送来的消息
     window.addEventListener('message', function (e) {
           //自己打印出来e就可以具体都有哪些值了
           //我比较常用的就是 e.data = {msg:"你好哇"}
     }, false);

子页面

      //子页面使用postMessage发送数据给父页面进行相关的判断
      window.parent.postMessage({
               msg:"你好哇"
      }, '*');

(2) 使用open打开子页面

      const openChildWindow = window.open('http://**.**.**.**:8080/#/mypage');
      //需要在加载成功后在发送消息 此时子页面已经绑定好监听事件了呢，不然可能会接收不到
      openChildWindow.onload = () => {
             openChildWindow.postMessage('hello word', 'http://**.**.**.**:8080/')
      }

(3) iframe

唠嗑:主要使用的是获取嵌套的iframe的dom- 然后通过contentWindow进行postMessage发送消息-监听message接收消息

  var myframe = document.getElementById('myframe');
 myframe.contentWindow.postMessage({data:'parent'}, 'http://localhost:8081');

二、jsonp

jsonp是利用资源不跨域的特性，使用的是script标签的src属性,因此只能get请求

三、前端不做修改-需要服务端配置头部等

      Access-Control-Allow-Origin: *
      //代表服务器同意把Cookie发到服务器
      Access-Control-Allow-Credentials: true 还要给ajax请求设置withCredentials=true

四、vue框架跨域

本地联调阶段使用-在vue.config.js中-devServer进行代理配置 (webpack配置)

关于解决项目中的跨域问题