分享 4個(gè)解決 https頁(yè)面加載http資源報(bào)錯(cuò)的方法
點(diǎn)擊上方?前端Q，關(guān)注公眾號(hào)
回復(fù)加群，加入前端Q技術(shù)交流群
module.exports = Config[Fix];Mixed Content: The page at 'https://www.fly63.com/***/' was loaded over HTTPS,but requested an insecure image 'http://www.fly63.co/***/img.jpg'.This content should also be served over HTTPS.
這是由于HTTPS 是 HTTP over Secure Socket Layer，以安全為目標(biāo)的 HTTP 通道，所以在 HTTPS 承載的頁(yè)面上不允許出現(xiàn) http 請(qǐng)求，一旦出現(xiàn)就是提示或報(bào)錯(cuò)。
下面總匯幾種解決方案，供大家參考。
方法1：服務(wù)端設(shè)置header
好在 W3C 工作組考慮到了我們升級(jí) HTTPS 的艱難，在 2015 年 4 月份就出了一個(gè) Upgrade Insecure Requests 的草案，他的作用就是讓瀏覽器自動(dòng)升級(jí)請(qǐng)求。
在我們服務(wù)器的響應(yīng)頭中加入：（當(dāng)然如果操作不了服務(wù)器，下面還會(huì)介紹另一種解決辦法）。
header("Content-Security-Policy: upgrade-insecure-requests");
方法2：頁(yè)面設(shè)置meta頭
在頁(yè)面中加入 meta 頭：（我使用這個(gè)方法）
<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests" />
如果頁(yè)面比較多，需要統(tǒng)一改變的話(huà)，我們可以將這條語(yǔ)句添加到全局JS文件里，全局調(diào)用。
方法三：刪除鏈接中的http:
推薦方法，不指定具體協(xié)議，使用資源協(xié)議自適配，比如，當(dāng)前為https頁(yè)面，那么就是https資源，如果是http頁(yè)面，那么就是http資源。具體方法超簡(jiǎn)單：
<script src='//cdn.bootcss.com/jquery/3.3.1/jquery.min.js'>script>
方式四：
最笨的方法，直接復(fù)制原有代碼，寫(xiě)成兩套代碼，一套為http使用，一套為https使用，http和https各自指向各自服務(wù)。
往期推薦
最后
歡迎加我微信，拉你進(jìn)技術(shù)群，長(zhǎng)期交流學(xué)習(xí)...
歡迎關(guān)注「前端Q」,認(rèn)真學(xué)前端，做個(gè)專(zhuān)業(yè)的技術(shù)人...
