故障排除2026-08-15•4 分鐘閱讀

混合內容錯誤：HTTPS 頁面載入 HTTP 資源

· CSR.plus 團隊

•瀏覽器會阻止 HTTPS 頁面上的 HTTP 資源，以保護頁面免受降級攻擊。
•使用瀏覽器主控台列出每個被阻止的 URL，然後修復來源：相對 URL、協定相對 URL 或 CSP 升級標頭。
•Content Security Policy 的 upgrade-insecure-requests 可以在不改程式碼的情況下修復許多頁面。

全部主動

被阻止類型

指令碼、iframe、fetch

DevTools

主控台工具

列出每個被阻止的要求

CSP

一行修復

upgrade-insecure-requests

相對 URL

最佳修復

// 或 //host 路徑

混合內容如何運作

透過 HTTPS 提供的頁面繼承安全上下文。任何透過純 HTTP 載入的子資源——圖片、CSS、指令碼、字型、iframe、fetch/XHR——都會破壞該上下文。瀏覽器會完全阻止「主動」混合內容（指令碼、iframe、fetch），並且越來越嚴格地阻止圖片與音訊。瀏覽器主控台會記錄每個被阻止的 URL 並給出清晰訊息。

尋找每個出現位置

開啟 DevTools > 主控台，篩選 "Mixed Content"，複製每個被阻止的 URL。然後在程式碼庫中搜尋指向這些主機的 http:// 引用。最穩健的修復是使用協定相對 URL（//cdn.example.com/x.js）或普通相對路徑，讓瀏覽器自動選擇正確的協定。

CSP 一行修復

新增回應標頭 Content-Security-Policy: upgrade-insecure-requests，告訴瀏覽器把 http:// 子資源重寫為 https:// 而不是阻止。這對大多數靜態頁面有效。對於硬編碼且不提供 HTTPS 的 http:// API 端點，必須修改程式碼——沒有用戶端變通方案。