https ≠ SSL対応済み
Chrome62からHTTPでフォーム送信するサイトにGoogleが警告を表示するようになるとIT界隈では話題になっている。
Web担当者などに話を聞くと「うちはURLがhttpsでSSL対応済みだから問題ない！」という回答が多いのだが、企業のお問い合わせフォームを見てみると正しく対応されていないことが非常に多い。
保護された通信の表示がない
URLがhttpsで正しくSSL対応がされているWebページの場合、URLの左部分に緑色で「保護された通信」と表示される。
逆に言うと、httpsでも正しくSSL対応がされていなければ「保護された通信」と表示されないのだ。
例えば森永製菓の場合、URLはhttpsだが「保護された通信」とは表示されておらず、iボタンをクリックすると「このサイトへの接続は完全には保護されていません」と表示される。※
https://www.morinaga.co.jp/cgi-bin/soudan_form/mrg_sou_inquire.cgi
※追記:現在は修正済み。記事投稿からわずか数時間で修正された。
森永製菓の代わりにカルビーのお問い合わせフォームを添付。
https://faq.calbee.co.jp/form/contactus.html
追記: カルビーのページも修正された。
本来であればこのように表示されるのが正しい。
https://www.meiji.co.jp/support/inquiry/
保護された通信と表示されない理由
なぜ同じhttpsのURLでも「保護されていません」と「保護された通信」の表示の違いが出るのか。
答えは混合コンテンツが原因だ。
混合コンテンツとは
前述の森永製菓をChromeのDeveloper ToolsのConsoleで確認するとMixed Content(混合コンテンツ)と表示される。
混合コンテンツとはHTTPSのページで画像、動画、CSS、スクリプトなどが安全ではないHTTP接続で読み込まれると発生する。
ChromeはHTTPSのページでも安全でないHTTPプロトコルを使用してサブリソースをリクエストするとページのセキュリティが低下するため「このサイトへの接続は完全には保護されていません」と表示される仕様になっている。
そのため「保護された通信」と表示させるにはそのページだけSSL対応にするのではなく、リクエストもすべてHTTPSで行う必要があるのだ。
コンプライアンス違反の可能性も
ほとんどの企業サイトにはプライバシーポリシーがあり、森永製菓の場合は以下のように書かれている。
森永製菓は、お客様からお預かりした個人情報を厳重に管理いたします。森永製菓は、お預かりした個人情報を紛失、破壊、社外への不正流出、改ざん、不正アクセスから保護するために、合理的な安全対策を講じます。
SSL対応が正しく行われていない以上、「合理的な安全対策を講じている」とは言えないためコンプライアンス違反の可能性がある。
http://www.morinaga.co.jp/privacy/
今回は森永製菓を例に出したが、日本の多くの大手企業のお問い合わせフォームはSSL対応が正しく行われていないため森永製菓に限った話ではない。
混合コンテンツのサンプル
以上のことを踏まえて簡単なサンプルを作成した。
問題：以下の2つのうち混合コンテンツはどちらか？
答えは「保護された通信」とConsoleのMixed Content表示の有無で判断できる。
一方は「保護された通信」と表示されずConsoleにMixed Contentと表示される。
HTMLをこのように記述してHTTPでリクエストしているため、上記のような結果になるのだ。
<form method="get" action="http://iwb.jp/">
<p>サイト内検索</p>
<input type="search" placeholder="検索 …" value="" name="s">
</form>
<script src="http://code.jquery.com/jquery-3.2.1.min.js"></script>
ちなみにHTTPSではなくHTTPでリクエストしているファイルはConsoleではなくNetworkタブでmixed-content:allのフィルターをかけると確認しやすい。
さらにSecurityタブを見ればNon-secure form / The page includes a form with a non-secure "action" attribute. と「保護された通信」と表示されていない原因が表示されるため便利である。
