[[433003]]

文末本文轉(zhuǎn)載自微信公眾號「云的程序世界」，作者云的世界 。轉(zhuǎn)載本文請聯(lián)系云的程序世界公眾號。

前言

網(wǎng)絡(luò)請求，大家肯定熟悉的不能再熟悉，網(wǎng)絡(luò)請求失敗，大家也肯定很熟悉。排查網(wǎng)絡(luò)請求，也是我們必備的技能，對不，兄弟。

我坦言，最怕兩種網(wǎng)絡(luò)請求失敗。

第一種：PC端模擬沒有異常，到手機(jī)上 eruda, vconsole等網(wǎng)絡(luò)請求信息空白。

這種，就比較頭大一點(diǎn)了，可能需要設(shè)置手機(jī)的網(wǎng)絡(luò)代理 + 抓包工具 去排查。

第二種：Provisional headers are shown

這種也是比較頭疼的，雖然網(wǎng)絡(luò)有很多文章講了排查之道，很多時(shí)候不太好使，這一回，也不生效。

今天，出場的嘉賓比較特別：Private Network Access 翻譯成中文，就是私有網(wǎng)絡(luò)請求，開始正文吧。

起因經(jīng)過

看要點(diǎn)：

• 本地(個(gè)人電腦)開發(fā)
• 啟動(dòng)一個(gè)web項(xiàng)目，頁面是http協(xié)議，類似 http://localhost:9093
• webview 打開 CDN(源站阿里OSS)的一個(gè)動(dòng)頁面
• 活動(dòng)頁面請求一個(gè)開啟了cors的局域網(wǎng)接口

類似：http://192.168.19.87:11606/como/flags

瀏覽器信息：chrome x64 95

獲取如下結(jié)果信息，并且爆出異常

網(wǎng)絡(luò)請求列表信息：

網(wǎng)絡(luò)請求詳情信息：

然后，我就一頓操作，最初懷疑 Referrer Policy 和這個(gè)所謂的 Provisional headers are shown, 經(jīng)歷下面得操作。

修改h5活動(dòng)refer策略

https://www.jianshu.com/p/26512475501a 

失敗告終

關(guān)閉 chrome://flags/#site-isolation-trial-opt-out 等等

CAUTION: provisional headers are shown" in Chrome debugger

失敗告終

其他嘗試

• 給本地web項(xiàng)目配置域名(修改localhost)失敗
• 用360瀏覽器打開web項(xiàng)目，網(wǎng)絡(luò)請求成功 成功
• 把請求copy as fetch，放到控制臺執(zhí)行 成功
• 本地啟動(dòng)一個(gè)網(wǎng)站模擬活動(dòng)頁面，執(zhí)行相同的網(wǎng)絡(luò)請求 成功

到這里，我就有點(diǎn)迷糊了，本地啟動(dòng)一個(gè)頁面，調(diào)用相同的接口能成功?CDN上不能成功，難不成和CDN的策略有關(guān)系?

這就難辦了，內(nèi)心另外一個(gè)聲音響起，應(yīng)該還是和這個(gè)cors有關(guān)系, 受到CAUTION: provisional headers are shown" in Chrome debugger 啟發(fā)，應(yīng)該還是和某個(gè)選項(xiàng)有關(guān)?

于是我打開 chrome://flags/ 面板，搜索 cors。

意外的收獲

發(fā)現(xiàn)一個(gè)選項(xiàng)， Block insecure private network requests, 第一句的意思是 防止非安全上下文向更私有的 IP 地址發(fā)出子資源請求, 哦，雖然還不太懂，感覺很有用的樣子。

辦他，重啟??

居然，好了，眼淚都要出來了，因?yàn)榫瓦@個(gè)事，放了好幾天，近來覺得

心里這個(gè)坎過不去!

心里這個(gè)坎過不去!

心里這個(gè)坎過不去!

一個(gè)不小心過去了，沒牽掛了，我要吃飯去了，別攔著我。

之前有提到，360瀏覽器并無此問題，那么chrome又是從哪個(gè)版本開始實(shí)現(xiàn)了這個(gè)特性。經(jīng)過查詢google文獻(xiàn)，最終確認(rèn)是 94，也就是低于此版本的瀏覽器不會(huì)受到影響。

發(fā)布于2021年8月的Private Network Access update: Introducing a deprecation trial

根本原因 Private Network Access(私有網(wǎng)絡(luò)請求)

先完全翻一下這個(gè)特性的描述:

防止非安全上下文向更私有的 IP 地址發(fā)出子資源請求。如果1) ip1是本地主機(jī)，而 ip2不是，或者2) ip1是私有的，而 ip2是公共的，那么 IP 地址 ip1比 ip2更私有。這是全面實(shí)施 cors-rfc1918的第一步: https://wicg.github.io/cors-rfc1918

頓悟， 防止向更私有的ip地址發(fā)出資源請求。

活動(dòng)頁面在CDN，屬于公網(wǎng)

網(wǎng)絡(luò)請求http://192.168.19.87:11606/como/flags， 屬于局域網(wǎng)

公網(wǎng)向局域網(wǎng)請求，就是向私有的網(wǎng)絡(luò)請求， 所以被 ban 了。

打開特性說明中的鏈接， 跳轉(zhuǎn)到協(xié)議地址：https://wicg.github.io/private-network-access/

再補(bǔ)充一些知識 ，網(wǎng)絡(luò)大致上我們分為

• local (本機(jī))
• private(私有網(wǎng)絡(luò))
• public (公網(wǎng))

私有程度 local > private > public

一圖勝千文：

當(dāng)然，更多相關(guān)知識，請參見 Private Network Access

三個(gè)問題

被 Private Network Access 策略攔截導(dǎo)致的請求，有沒有發(fā)送到服務(wù)端

局域網(wǎng)向本地機(jī)器發(fā)送網(wǎng)絡(luò)請求，能不能成功

除了關(guān)閉chrome的Block insecure private network requests特性外，還有沒有別的方式解決此問題

小結(jié)

圖片這個(gè)協(xié)議，是2021年6月份起草的，不得不說chrome你是真的牛X。

這也就能解釋，為什么 360瀏覽器能網(wǎng)絡(luò)求情能夠成功。

私有網(wǎng)絡(luò)請求，確實(shí)從一定程度保護(hù)了安全。