解決方案總結：

1、打開新網頁，瀏覽器輸入：??chrome://flags/#block-insecure-private-network-requests，改成Disabled，重啟瀏覽器。（需要客戶手動操作，不采納）

2、給img添加crossOrigin 屬性（此方法不好用，can i use顯示瀏覽器不支持img 標簽的 src跨域問題

3、<meta name="referrer" content="no-referrer-when-downgrade" /> 參考：change referrer-policy in react js（未采用不適合項目）

4、前端設置方法（?參考HTTP請求之referrer與Referrer-Policy）
???????① 通過Referrer-Policy HTTP header設置：Referrer-Policy: origin

????????②通過<meta>元素改變Referrer Policy，直接修改名為referrer的內容

　　<meta name="referrer" content="origin">

????????③ 給 <a>?<area><img><iframe>?或<link>元素設置referrerpolicy屬性

　　<a href="http://example.com" referrerpolicy="origin">

????????④ 如需設置不顯示referrer信息，可以給 <a><area>?<link>元素設置rel的鏈接關系。

　　<a href="http://example.com" rel="noreferrer">

---

react，img標簽src獲取圖片提示跨域，

<img src={originSrc[i]} key={i} />

控制臺提示：

Access to image at 'http://127.0.0.1:15284/C:/Users/28929/camera_0.jpg?1655275037147' from origin 'http://171.5.37.13' has been blocked by CORS policy: The request client is not a secure context and the resource is in more-private address space `local`. Access to image at 'http://127.0.0.1:15284/C:/Users/28929/camera_1.jpg?1655275037147' from origin 'http://171.5.37.13' has been blocked by CORS policy: The request client is not a secure context and the resource is in more-private address space `local`.

分析：

1、谷歌94版本上基本上端口號4位成功，5位失敗，此時誤以為是端口5位數導致（端口隨機生成），但隨著操作次數增多發現，4位端口號也會失敗，如下：

Access to image at 'http://127.0.0.1:1042/C:/Users/28929/camera_0.jpg?1655279684455' from origin 'http://171.5.37.13' has been blocked by CORS policy: The request client is not a secure context and the resource is in more-private address space `local`.

?2、谷歌84版本，4、5位端口號都獲取圖片成功，查看資料得知Chrome 新的默認 Referrer-Policy : strict-origin-when-cross-origin

?3、后來又看到一篇文章：HTTP請求之referrer與Referrer-Policy?，對比成功和失敗發現

? ? 失敗：

GeneralRequest URL: http://127.0.0.1:23246/C:/Users/28929/camera_0.jpg?1655279684455Referrer Policy: strict-origin-when-cross-origin Response HeadersReferer: http://171.5.37.13/...

成功：

GeneralRequest URL: http://127.0.0.1:23382/C:/Users/28929/camera_0.jpg?1655280203114Request Method: GETStatus Code: 200 OKRemote Address: 127.0.0.1:23382Referrer Policy: strict-origin-when-cross-origin Response Headers...Accept: image/avif,image/webp,image/apng,image/svg+xml,image/*,*/*;q=0.8Accept-Encoding: gzip, deflate, brAccept-Language: zh-CN,zh;q=0.9Connection: keep-aliveHost: 127.0.0.1:23382Referer: http://172.27.1.144/...

試了一把，誒？

<img src={originSrc[i]} referrerpolicy='origin' key={i} />

好像靠譜，至此問題終于解決。

總結寫在文章最開頭，方便大家快速找到解決方案。

總結

以上是生活随笔為你收集整理的Chrome高版本浏览器img通过src获取图片失败的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。