JS跨域請(qǐng)求的問(wèn)題解析
同源策略
在運(yùn)行中我們有時(shí)會(huì)出錯(cuò)是因?yàn)槲覀冞`反了同源策略,這是一種瀏覽器所實(shí)施的安全措施,用于限制具有不同來(lái)源的文檔之間的交互。頁(yè)面的來(lái)源由其協(xié)議,主機(jī)和端口號(hào)定義。具有相同來(lái)源的資源可以相互完全訪(fǎng)問(wèn)。但是如果具有不相同的源將會(huì)拒絕訪(fǎng)問(wèn)。
http://www.a.com/a.js http://www.b.com/a.js 這兩個(gè)之間就不可以互相訪(fǎng)問(wèn),因?yàn)橛蛎牟幌嗤?/pre>
域名組成
如果上面兩個(gè)域名想互相訪(fǎng)問(wèn)就需要跨域請(qǐng)求,一般情況下同源政策規(guī)定:允許跨源 寫(xiě)入,而不允許跨源 讀取這意味著同源政策不會(huì)阻止將數(shù)據(jù)寫(xiě)入,只會(huì)禁止他們從域中讀取數(shù)據(jù), 或者對(duì)從其域收到的響應(yīng)做任何事情。
跨域請(qǐng)求的方法
JSONP
JSONP 稱(chēng)為帶有填充的JavaScript對(duì)象表示,是一種通過(guò)利用HTML頁(yè)面中的腳本標(biāo)記可以來(lái)加載來(lái)自不同來(lái)源的代碼來(lái)執(zhí)實(shí)現(xiàn)跨域請(qǐng)求的方法。JSONP依賴(lài)于<script>標(biāo)簽可以來(lái)自不同來(lái)源的事實(shí)。當(dāng)瀏覽器解析<script>標(biāo)記時(shí),它將獲取腳本內(nèi)容,并在當(dāng)前頁(yè)面的上下文中執(zhí)行它。通常,服務(wù)將返回HTML或以XML或JSON等數(shù)據(jù)格式表示的某些數(shù)據(jù)。但是,當(dāng)向啟用JSONP的服務(wù)器發(fā)出請(qǐng)求時(shí),它會(huì)返回一個(gè)腳本塊,該腳本塊在執(zhí)行時(shí)會(huì)調(diào)用頁(yè)面指定的回調(diào)函數(shù),并將實(shí)際數(shù)據(jù)作為參數(shù)提供
注意:它沒(méi)有相同的源點(diǎn)限制,即使在舊瀏覽器中也具有良好的兼容性但是JSONP只能用于執(zhí)行跨域GET請(qǐng)求,服務(wù)器必須顯式支持JSONP請(qǐng)求。
CORS方法
為服務(wù)器提供了一種機(jī)制,告訴瀏覽器可以請(qǐng)求域A讀取來(lái)自域B的數(shù)據(jù)。通過(guò)在響應(yīng)中包含一個(gè)新的 Access-Control-Allow-OriginHTTP頭來(lái)完成的,當(dāng)瀏覽器收到來(lái)自跨源源的響應(yīng)時(shí),它將檢查CORS頭。如果響應(yīng)頭中指定的源點(diǎn)與當(dāng)前源點(diǎn)相匹配,則允許對(duì)響應(yīng)進(jìn)行讀訪(fǎng)問(wèn),否則就會(huì)報(bào)錯(cuò)。
與jsonp相比,CORS具有以下優(yōu)勢(shì):
它不僅支持GET請(qǐng)求,還支持POST等其他請(qǐng)求
它可以使用XMLHttpRequest發(fā)送和接收數(shù)據(jù),并具有更好的錯(cuò)誤處理機(jī)制
總結(jié):以上就是本篇文章的全部?jī)?nèi)容了,希望對(duì)大家學(xué)習(xí)有所幫助,感謝大家對(duì)腳本之家的支持。
相關(guān)文章
js代碼驗(yàn)證手機(jī)號(hào)碼和電話(huà)號(hào)碼是否合法
這篇文章主要介紹了js代碼驗(yàn)證手機(jī)號(hào)碼和電話(huà)號(hào)碼是否合法,手機(jī)號(hào)碼和電話(huà)號(hào)碼在某些網(wǎng)站都是必填項(xiàng),為了提高用戶(hù)體驗(yàn)度,一般要進(jìn)行合法性校驗(yàn)的,需要的朋友可以參考下2015-07-07javascript下with 的簡(jiǎn)化代碼寫(xiě)法
with 語(yǔ)句通常用來(lái)縮短特定情形下必須寫(xiě)的代碼量。在下面的例子中,請(qǐng)注意 Math 的重復(fù)使用2008-02-02微信小程序?qū)崿F(xiàn)拍照畫(huà)布指定區(qū)域生成圖片
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)拍照畫(huà)布指定區(qū)域生成圖片,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2019-07-07微信小程序--獲取用戶(hù)地理位置名稱(chēng)(無(wú)須用戶(hù)授權(quán))的方法
這篇文章主要介紹了微信小程序-獲取用戶(hù)地理位置名稱(chēng)(無(wú)須用戶(hù)授權(quán))的方法,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2019-04-04讓瀏覽器非阻塞加載javascript的幾種方法小結(jié)
通常大多數(shù)瀏覽器是并行下載資源的,但由于外部腳本的特殊性例如通過(guò)腳本改變文檔的DOM結(jié)構(gòu)、腳本之間的存在依賴(lài)關(guān)系、使用document.write 向頁(yè)面輸出HTML等。2011-04-04firefox下對(duì)ajax的onreadystatechange的支持情況分析
firefox下對(duì)ajax的onreadystatechange的支持分析。用的到的朋友可以參考下。2009-12-12Bootstrap table分頁(yè)問(wèn)題匯總
這篇文章主要為大家匯總了Bootstrap table分頁(yè)的典型問(wèn)題,以及對(duì)應(yīng)每個(gè)bootstrap table分頁(yè)問(wèn)題的解決方法,感興趣的小伙伴們可以參考一下2016-05-05