如何去解決JS跨域問(wèn)題?怎么能學(xué)好Web前端開(kāi)發(fā)?JavaScript跨域是指通過(guò)JS在不同的域之間進(jìn)行數(shù)據(jù)傳輸或通信,比如用ajax向一個(gè)不同的域請(qǐng)求數(shù)據(jù),或者通過(guò)JS獲取頁(yè)面中不同域的框架中(iframe)的數(shù)據(jù)。只要協(xié)議、域名、端口有任何一個(gè)不同,都被當(dāng)作是不同的域。那么如何解決跨域問(wèn)題呢?下面來(lái)看看吧。
在此之前,我們首先要了解為什么需要跨域??缬?,指的是瀏覽器不能執(zhí)行其他網(wǎng)站的腳本。它是由瀏覽器的同源策略造成的,是瀏覽器對(duì)JavaScript施加的安全限制。簡(jiǎn)單來(lái)說(shuō),跨域的作用就是讓你能訪問(wèn)不是一個(gè)域的文件。
要解決跨域問(wèn)題,我們可以使用以下幾種方法:
一、通過(guò)jsonp跨域(實(shí)際上是動(dòng)態(tài)創(chuàng)建script標(biāo)簽)
jsonp(json with Padding)是資料格式j(luò)son的一種“使用模式”,可以讓網(wǎng)頁(yè)從別的網(wǎng)域要資料。jsonp也叫填充式j(luò)son,是應(yīng)用json的一種新方法,只不過(guò)是被包含在函數(shù)調(diào)用中的json。jsonp由兩部分組成:回調(diào)函數(shù)和數(shù)據(jù)?;卣{(diào)函數(shù)是當(dāng)響應(yīng)到來(lái)時(shí)應(yīng)該在頁(yè)面中調(diào)用的函數(shù),而數(shù)據(jù)就是傳入回調(diào)函數(shù)中的json數(shù)據(jù)。
二、通過(guò)document.domain+ iframe (只有在主域相同的時(shí)候才能使用該方法)
兩個(gè)不同域的a.html和b.html
解決辦法:在兩個(gè)頁(yè)面都插入document.domain,這樣就能訪問(wèn)iframe里window對(duì)象的各種屬性。
三、使用window.name來(lái)進(jìn)行跨域
原理:在一個(gè)窗口(window)的生命周期內(nèi),窗口載入的所有的頁(yè)面都是共享一個(gè)window.name的,每個(gè)頁(yè)面對(duì)window.name都有讀寫(xiě)的權(quán)限
四、使用HTML5的window.postMessage方法來(lái)跨域傳送數(shù)據(jù)
五、利用CORS
CORS是自定義HTTP頭部,使瀏覽器和服務(wù)器對(duì)比,從而決定請(qǐng)求和響應(yīng)是否應(yīng)該進(jìn)行。
IE8使用XDR對(duì)象實(shí)現(xiàn)CORS,和XHR類似用法
現(xiàn)代瀏覽器使用普通的XMLHttpRequest對(duì)象請(qǐng)求就行。

小編推薦一個(gè)學(xué)Web前端的學(xué)習(xí)裙【 547,302,383 】,無(wú)論你是大牛還是小白,是想轉(zhuǎn)行還是想入行都可以來(lái)了解一起進(jìn)步一起學(xué)習(xí)!裙內(nèi)有開(kāi)發(fā)工具,很多干貨和技術(shù)資料分享!
當(dāng)然,實(shí)現(xiàn)JavaScript跨域的方法還有圖片Ping、利用flash等。跨域是前端最重要的面試題之一,掌握它你就比別人多了一個(gè)優(yōu)勢(shì)。