Chrome で安全でないという警告を回避する

9 月に発表されたとおり、Chrome ではまもなく、パスワードクレジット カードの入力フィールドを含む安全でないページが、URL バーで保護されていませんとマークされるようになります。

このドキュメントは、ウェブ デベロッパーがこの警告を回避するためにサイトを更新する際に役立つことを目的としています。

警告を有効にする

警告は、2017 年 1 月にリリース予定の Chrome 56 ですべてのユーザーに対してデフォルトで有効になります。

リリース前に新しいユーザー エクスペリエンスをテストするには、最新の Google Chrome Canary ビルドをインストールしてください。

2017 年 1 月に表示される警告を Chrome に表示するように設定するには、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 に設定します。その後、ブラウザを再起動します。

ブラウザの警告動作の例については、こちらのページをご覧ください。

「安全でない」ステータスが表示されると、DevTools コンソールに 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 ログの例。

長期 - すべての場所で HTTPS を使用する

最終的に Chrome では、HTTP 経由で配信されるすべてのページに、機密性の高い入力フィールドが含まれているかどうかにかかわらず、安全でない警告が表示されるようになります。上記のよりターゲットを絞った解決策のいずれかを選択した場合でも、すべてのページで HTTPS を使用するようにサイトを移行することを計画する必要があります。