避免 Chrome 顯示不安全警告

如同 9 月的公告,Chrome 即將在網址列中,將含有「密碼」和「信用卡」輸入欄位的非安全網頁標示為「不安全」

本文件旨在協助網頁開發人員更新網站,避免收到這則警告。

啟用警告

Chrome 56 的所有使用者都預設啟用警告功能,預計在 2017 年 1 月發布。

如要在 2014 年 1 月前測試即將推出的使用者體驗,請安裝最新的 Google Chrome Canary 版本。

如要將 Chrome 設為在 2017 年 1 月顯示警告,請開啟 chrome://flags/#mark-non-secure-as,然後將 Mark non-secure origins as non-secure 選項設為 Display a verbose state when password or credit card fields are detected on an HTTP page。然後重新啟動瀏覽器。

您可以前往這個網頁查看瀏覽器的警告行為示例。

出現不安全狀態時,開發人員工具控制台會顯示 This page includes a password or credit card input in a non-secure context. A warning has been added to the URL bar. 訊息

控制台警告示例。

解決警告

為確保網頁不顯示不安全警告,您必須確保包含 <input type=password> 元素的所有表單,以及系統偵測為信用卡欄位的任何輸入,都「只」在安全來源中顯示。也就是說,頂層網頁必須是 HTTPS,且如果 input 位於 iframe 中,則該 iframe 也必須透過 HTTPS 提供。

如果您的網站在 HTTP 網頁上重疊了 HTTPS 登入頁框...

透過 HTTP 登入 HTTPS 的範例。

您需要將網站變更為對整個網站使用 HTTPS (理想),或是將瀏覽器視窗重新導向至包含登入表單的 HTTPS 頁面:

HTTPS 登入範例。

長期 - 全面使用 HTTPS

最後,無論網頁是否含有敏感輸入欄位,Chrome 都會針對透過 HTTP 提供的「所有」網頁顯示不安全警告。即使採用上述針對性更高的解析度,仍建議您妥善規劃遷移網站,讓所有網頁都使用 HTTPS。