亚洲中字慕日产2020,大陆极品少妇内射AAAAAA,无码av大香线蕉伊人久久,久久精品国产亚洲av麻豆网站

資訊專欄INFORMATION COLUMN

跨域的解決方式

yanwei / 2687人閱讀

摘要：同源政策協(xié)議域名端口均相同。解決方式一原理通過動(dòng)態(tài)添加一個(gè)元素，向服務(wù)器請(qǐng)求數(shù)據(jù)。服務(wù)器接收請(qǐng)求返回到指定具名回調(diào)函數(shù)。注意查詢的中需要指定回調(diào)函數(shù)的名字。缺陷是方式獲取，不支持。五是跨域資源分享。

同源政策：協(xié)議、域名、端口均相同。

非同源限制：

cookie、localStorage、indexDB無法讀取。

DOM無法獲取。

AJAX請(qǐng)求無法發(fā)送。

解決方式：

一、JSONP

原理：通過動(dòng)態(tài)添加一個(gè) 

頁面二："https://www.example.com/page2.html"    //接收頁面

事件接收window.addEventListener("message", function(){});中的message事件對(duì)象event有三個(gè)屬性：
1、event.source：發(fā)送消息的窗口
2、event.origin: 消息發(fā)向的網(wǎng)址
3、event.data: 消息內(nèi)容

三、iframe

iframe載入頁面和src里面的目標(biāo)域是同一個(gè)域，是能夠發(fā)起ajax請(qǐng)求（父子窗口）。 //前提是同源，不同源就不可以發(fā)起ajax請(qǐng)求。

不同窗口同源之間是可以獲取window對(duì)象，但是不能獲取window對(duì)象的屬性和方法。 //不同源會(huì)報(bào)錯(cuò)

1、document.domain + iframe（同源可用 -- 跨子域）

document.domain屬性：一級(jí)域名相同，二級(jí)域名不同可以實(shí)現(xiàn)window對(duì)象獲取。

頁面一："https://segmentfault.com/page1.html"

頁面二："https://segmentfault.com/page2.html"

缺陷：主域名得一致。

2、window.name + iframe（非同源可用）

window.name屬性：在一個(gè)窗口的生命周期內(nèi)，無論是否同源，同一個(gè)窗口的載入頁面window.name屬性是共享的，每個(gè)頁面都可以操作。

頁面一："https://segmentfault.com/page1.html"

頁面二："https://segmentfault.com/page2.html"

缺陷：兼容性不好

3、location.hash + iframe（非同源可用）

片段標(biāo)識(shí)符：片段標(biāo)識(shí)符是指url#號(hào)后面的部分。只是改變片段標(biāo)識(shí)符頁面不刷新。

頁面一："https://www.segmentfault.com/page1.html"

頁面二："https://www.example.com/page2.html#messgae"

頁面三："ttps:/www.segmentfault.com/page3html#somedata"

缺點(diǎn)：數(shù)據(jù)暴露在url，長度也有限制。

四、WebSocket

WebSocket：瀏覽器通過 JavaScript 向服務(wù)器發(fā)出建立 WebSocket 連接的請(qǐng)求，連接建立以后，客戶端和服務(wù)器端就可以通過 TCP 連接直接交換數(shù)據(jù)。

設(shè)置WebSocket請(qǐng)求頭信息，服務(wù)器支持就可以進(jìn)行。

Origin: http://example.com        //根據(jù)域名是否在白名單內(nèi)來判斷是否可以通信

缺點(diǎn)：實(shí)現(xiàn)成本高。

五、CORS

cors是跨域資源分享。現(xiàn)CORS通信的關(guān)鍵是服務(wù)器。只要服務(wù)器實(shí)現(xiàn)了CORS接口，就可以跨源通信。

缺點(diǎn)：服務(wù)器配置，占用主域帶寬。

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://www.ezyhdfw.cn/yun/102985.html

相關(guān)文章

  • 跨域

    摘要：所謂同源是指協(xié)議域名端口三者相同，即便兩個(gè)不同的域名指向同一個(gè)地址，也非同源，看看下面的產(chǎn)生跨域的場景你就會(huì)明白同源策略的含義。 前端跨域問題我想很多同學(xué)遇到過，或者是剛剛請(qǐng)求數(shù)據(jù)成功, 然而轉(zhuǎn)眼之后就會(huì)報(bào)錯(cuò)XMLHttpRequest cannot load http://www.server.com/server.... No Access-Control-Allow-Origin...

    chaos_G 評(píng)論0 收藏0

  • AJAX跨域完全講解

    摘要：跨域完全講解今天在慕課網(wǎng)上學(xué)習(xí)了跨域完全講解我在收集面試題的時(shí)候其實(shí)就已經(jīng)有過跨域的問題的了，當(dāng)時(shí)候知道了為什么會(huì)存在跨域，以及跨域解決的方案有哪些，今天隨著課程的學(xué)習(xí)，又加深了跨域的理解，以此記錄下來。 AJAX跨域完全講解 今天在慕課網(wǎng)上學(xué)習(xí)了AJAX跨域完全講解：https://www.imooc.com/learn/947 我在收集AJAX面試題的時(shí)候其實(shí)就已經(jīng)有過AJAX跨域...

    alexnevsky 評(píng)論0 收藏0

  • AJAX跨域完全講解

    摘要：跨域完全講解今天在慕課網(wǎng)上學(xué)習(xí)了跨域完全講解我在收集面試題的時(shí)候其實(shí)就已經(jīng)有過跨域的問題的了，當(dāng)時(shí)候知道了為什么會(huì)存在跨域，以及跨域解決的方案有哪些，今天隨著課程的學(xué)習(xí)，又加深了跨域的理解，以此記錄下來。 AJAX跨域完全講解 今天在慕課網(wǎng)上學(xué)習(xí)了AJAX跨域完全講解：https://www.imooc.com/learn/947 我在收集AJAX面試題的時(shí)候其實(shí)就已經(jīng)有過AJAX跨域...

    i_garfileo 評(píng)論0 收藏0

  • php后端控制可跨域的域名,允許圖片跨域上傳

    摘要：跨域問題經(jīng)常需要面對(duì)，前端需要做的比較直接要么選擇異步提交，或者，要么表單提交基本可以搞定大部分跨域問題，但問題也比較明顯，只能通過方式提交并且是通過把參數(shù)拼到上提交請(qǐng)求的但是所有瀏覽器有長度限制，不同瀏覽器長度限制不一樣當(dāng)出現(xiàn)要提交大段落 跨域問題經(jīng)常需要面對(duì)，前端需要做的比較直接要么選擇ajax異步提交，XML或者jsonp，要么表單提交 jsonp基本可以搞定大部分跨域問題，但問...

    Dean 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<