https網(wǎng)站加載http資源問題
前言：最近項(xiàng)目對接了一個(gè)第三方的平臺、我們需要展示第三方平臺返回來的圖片資源、由于我們的服務(wù)器設(shè)置為了https、但是第三方平臺返回的圖片鏈接是 http 資源。所以就出現(xiàn)了圖片無法加載出來的問題，在此記錄一下問題的解決方案。
原因：
這是瀏覽器的規(guī)則限制了、https:// 頁面只能加載訪問安全的https:// 資源
解決方案：
方案一：在資源服務(wù)器上設(shè)置響應(yīng)頭
"Content-Security-Policy": "upgrade-insecure-requests"
弊端：這種解決方案僅限于需要加載的http資源是在我們自己服務(wù)器上（我們自己可以配置操作）。如果是第三方服務(wù)器上則我們無法操作
方案二：在主頁面（入口html文件）設(shè)置meta頭
以Vue項(xiàng)目為例：在public/index.html 文件內(nèi)加入下面這行代碼
<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests" />
方案三：刪除鏈接中的http:
將需要訪問的資源鏈接中的http: 協(xié)議前綴刪除
不指定具體協(xié)議，使用資源協(xié)議自適配，比如，當(dāng)前為https頁面，那么就是https資源，如果是http頁面，那么就是http資源。文章來源：http://www.zghlxwxcb.cn/news/detail-744933.html
//修改前
<link rel="stylesheet" href="http://at.alicdn.com/t/font_830376_qzecyukz0s.css" />
// 修改后
<link rel="stylesheet" href="http://at.alicdn.com/t/font_830376_qzecyukz0s.css" />
方案四：將第三方資源下載到自己的服務(wù)器上、然后再訪問。
這種方案就需要后端配合、后端將資源上傳到我們自己的文件服務(wù)器上、返回再將自己的文件服務(wù)器的資源鏈接返回給前端。文章來源地址http://www.zghlxwxcb.cn/news/detail-744933.html
到了這里，關(guān)于https網(wǎng)站加載http資源問題的文章就介紹完了。如果您還想了解更多內(nèi)容，請?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
