筆者目前主要使用Vue進行項目開發(fā)擂啥，但是我認為技術(shù)棧不重要悯辙，js才是最重要的遗锣，當(dāng)時css優(yōu)秀也是一名優(yōu)秀的前端小開發(fā)(咳咳)货裹，下邊步入正題啦
一、跨文檔通信API
嘮嗑:我認為還是比較常常使用的 尤其是對于項目嵌入iframe和open簡直不要太好用精偿，哈哈哈哈弧圆，咳咳，寫文章呢笔咽，嚴肅點
(1) 使用vue-router(push)跳轉(zhuǎn)如何使用(這個其實不能算作跨域)
父頁面
//父頁面添加message監(jiān)聽子頁面發(fā)送來的消息
window.addEventListener('message', function (e) {
//自己打印出來e就可以具體都有哪些值了
//我比較常用的就是 e.data = {msg:"你好哇"}
}, false);
子頁面
//子頁面使用postMessage發(fā)送數(shù)據(jù)給父頁面進行相關(guān)的判斷
window.parent.postMessage({
msg:"你好哇"
}, '*');
(2) 使用open打開子頁面
const openChildWindow = window.open('http://**.**.**.**:8080/#/mypage');
//需要在加載成功后在發(fā)送消息 此時子頁面已經(jīng)綁定好監(jiān)聽事件了呢搔预，不然可能會接收不到
openChildWindow.onload = () => {
openChildWindow.postMessage('hello word', 'http://**.**.**.**:8080/')
}
(3) iframe
嘮嗑:主要使用的是獲取嵌套的iframe的dom- 然后通過contentWindow進行postMessage發(fā)送消息-監(jiān)聽message接收消息
var myframe = document.getElementById('myframe');
myframe.contentWindow.postMessage({data:'parent'}, 'http://localhost:8081');
二、jsonp
jsonp是利用資源不跨域的特性叶组，使用的是script標(biāo)簽的src屬性,因此只能get請求
三拯田、前端不做修改-需要服務(wù)端配置頭部等
Access-Control-Allow-Origin: *
//代表服務(wù)器同意把Cookie發(fā)到服務(wù)器
Access-Control-Allow-Credentials: true 還要給ajax請求設(shè)置withCredentials=true
四、vue框架跨域
本地聯(lián)調(diào)階段使用-在vue.config.js中-devServer進行代理配置 (webpack配置)
