修正複合型內容

Jo-el van Bergen
Jo-el van Bergen
X
Rachel Andrew

如要保護網站和使用者不受攻擊，請務必支援網站的 HTTPS。 但混合內容卻能帶來無用的保護 瀏覽器會封鎖越來越多不安全複合型內容，詳情請參閱「什麼是複合型內容？」一文。

本指南將說明修正現有複合型內容問題的技巧和工具 並防止新的目標對像出現

造訪您的網站尋找複合型內容

透過 Google Chrome 造訪 HTTPS 網頁時 瀏覽器會在 JavaScript 控制台中顯示混合內容為錯誤和警告。

在「複合型內容」部分， ，您可以在 Chrome 開發人員工具中查看某些範例，並瞭解如何回報問題。

在使用被動式複合型內容的示例中，系統會發出警告。 如果瀏覽器可透過 https 網址找到內容，系統會自動升級，並顯示訊息。

Chrome 開發人員工具顯示偵測到複合型內容並升級時顯示的警告

主動式複合型內容遭到封鎖，且會顯示警告。

Chrome 開發人員工具顯示使用中複合型內容遭封鎖時顯示的警告

如果發現網站上有 http:// 個網址的相關警告， 您需要在網站原始碼中修正這些錯誤。 建議您列出這些網址及找到這些網址的網頁，以供修正時使用。

尋找您網站上的複合型內容

您可以直接在原始碼中搜尋複合型內容。 在來源中搜尋 http://，並尋找含有 HTTP 網址屬性的標記。 請注意，錨定標記 (<a>) 的 href 屬性包含 http:// 通常不是混合內容問題，有一些值得注意的例外情況 (稍後將討論)。

如果網站是透過內容管理系統發布， 網站發布時，可能插入不安全網址的連結。 舉例來說，圖片有可能附上完整網址，而非相對路徑。 您需要在 CMS 內容中找出並修正這些問題。

修正複合型內容

在網站原始碼中找到混合內容後， 您可以按照這些步驟來修正問題

如果控制台顯示訊息，指出資源要求已從 HTTP 自動升級為 HTTPS， 但您可以放心將程式碼中資源的 http:// 網址變更為 https://。 你也可以在瀏覽器網址列中將 http:// 變更為 https://，檢查資源是否可安全存取。 並嘗試在瀏覽器分頁中開啟網址

如果無法透過 https:// 取得資源，您應考慮下列其中一種選項：

  • 如有其他主機提供的資源，請加入該主機。
  • 如果您獲得法律許可，請直接下載並代管您網站上的內容。
  • 從網站上完全排除該資源。

修正問題後 查看最初找到錯誤的網頁，確認該錯誤已消失。

注意非標準代碼的使用行為

留意網站上的非標準代碼使用方式。 舉例來說，錨定 (<a>) 標記網址不會導致複合型內容錯誤。 避免瀏覽器前往新網頁 也就是說，這些錯誤通常不需要修正。 但部分圖片庫指令碼會覆寫 <a> 的功能 標記，並將 href 屬性指定的 HTTP 資源載入網頁上的燈箱 造成混合內容的問題

大規模處理複合型內容

上述手動步驟適用於小型網站； 但對於大型網站或擁有多個獨立開發團隊的網站 要追蹤所有載入的內容並不容易 如要協助完成這項工作，可以使用內容安全性政策 ，指示瀏覽器通知您複合型內容，並確保網頁絕不會意外載入不安全的資源。

內容安全政策

內容安全政策 (CSP) 是一項多用途的瀏覽器功能，可用於管理大規模的混合內容。 CSP 報告機制可用來追蹤網站上的複合型內容。 ，並提供強制執行政策，以升級或封鎖複合型內容，保護使用者安全。

您可以為網頁啟用這些功能，方法是加入 伺服器傳送回應中的 Content-Security-Policy 或 Content-Security-Policy-Report-Only 標頭。 此外，您還可以設定 Content-Security-Policy (但「不是」Content-Security-Policy-Report-Only) 在網頁的 <head> 部分使用 <meta> 標記。

找出含有內容安全政策的複合型內容

您可以運用內容安全政策，收集網站上複合型內容的報告。 如要啟用這項功能，請將 Content-Security-Policy-Report-Only 指令新增為網站回應標頭，藉此設定指令。

回應標頭：

Content-Security-Policy-Report-Only: default-src https: 'unsafe-inline' 'unsafe-eval'; report-uri https://example.com/reportingEndpoint

每當使用者造訪網站上的網頁時 瀏覽器會將任何違反內容安全政策的內容以 JSON 格式回報， https://example.com/reportingEndpoint。 在此情況下，每當透過 HTTP 載入子資源時，系統就會傳送報表。 包括違反政策的網頁網址，以及違反政策的子資源網址。 如果您設定報表端點來記錄這些報表， 即可追蹤網站上的混合內容，而無需親自造訪每個網頁。

但請注意：

  • 使用者必須透過解讀出 CSP 標頭的瀏覽器，造訪您的網頁。大部分的新式瀏覽器都是如此。
  • 系統只會針對使用者造訪過的網頁提供相關報表。 因此，如果你有網頁的流量不多 但可能需要一些時間，才能取得整個網站的報表。

內容安全政策 指南擁有更多資訊和端點範例。

透過 CSP 回報內容的替代方案

如果您的網站是由 Blogger 等平台代管 您可能沒有修改標頭及新增 CSP 的權限。 另一個可行的辦法是利用網站檢索器來找出網站上的問題，例如 HTTPSChecker 或 混合內容掃描。

升級不安全的要求

瀏覽器支援

  • Chrome：44.
  • Edge：17。
  • Firefox：48。
  • Safari：10.1.

資料來源

瀏覽器已開始升級並封鎖不安全的要求。 您可以使用 CSP 指令，強制升級或封鎖這些資產。

upgrade-insecure-requests CSP 指令會指示瀏覽器先升級不安全網址，再發出網路要求。

舉例來說，如果網頁包含的圖片代碼含有 HTTP 網址，例如 <img src="http://example.com/image.jpg">

瀏覽器會針對 https://example.com/image.jpg，因此從複合型內容儲存使用者。

如要啟用這項行為，您可以傳送 Content-Security-Policy 標頭並加入這個指令：

Content-Security-Policy: upgrade-insecure-requests

或者，在文件的 <head> 中嵌入相同的指令 使用 <meta> 元素建立區段：

<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">

與瀏覽器自動升級相同，如果無法透過 HTTPS 取得資源 升級要求失敗，且系統未載入這項資源。 這可維護網頁的安全性。upgrade-insecure-requests 指令會比自動升級瀏覽器更進一步 瀏覽器目前並沒有的嘗試升級要求。

upgrade-insecure-requests 指令會歸入 <iframe> 文件。 就能確保整個網頁受到保護