什么是跨域
網(wǎng)絡(luò)間的通信有同源策略,從一個(gè)源加載的腳本或文件如何和另外一個(gè)源的腳本進(jìn)行交互。這是用于隔離潛在惡意文件的的關(guān)鍵安全機(jī)制
同源:是指主機(jī)名,協(xié)議，端口組成組合必須相同，不同源的話會(huì)Cookie,localStorage,IndexDB無法讀取，DOM無法獲得,AJAX不能發(fā)送請(qǐng)求
前后端通信
1:ajax 2:webSocket(不受同源策略限制) 3:CORS(新的通信標(biāo)準(zhǔn))
跨域的幾種方式:
1: JSONP 2:Hash 3:postMessage（HTML5） 4:webSocket 5;CORS
- JSONP 利用script的標(biāo)簽的異步加載特性特性實(shí)現(xiàn),給服務(wù)器傳一個(gè)回調(diào)函數(shù),服務(wù)器執(zhí)行完后返回一個(gè)傳遞過去的回調(diào)函數(shù)的js代碼
- Hash 是頁面嵌套 在目標(biāo)頁面進(jìn)行onhashchange 監(jiān)控
- postMessage(),窗口A(http:A.com)向跨域的窗口B(http:B.com)發(fā)送信息 例如 3.3
- websocket var ws = new WebSocket("wss://self.org") 監(jiān)聽 onOpen onMessage onClose事件
- HTML5的fechtch API
- 后臺(tái)配置
- form 直接進(jìn)行表單提交
- cors http://www.ruanyifeng.com/blog/2016/04/cors.html
例子3.3 窗口A(http:A.com)向跨域的窗口B(http:B.com)發(fā)送信息
BWindow.postMessage('data','http://B.com')
Awindow.addEventListener('message',funciton(event){
?console.log(event.origin)
console.log(event.source)
?console.log(event.data)
})
