本文へ移動
  1. トップ
  2. コラム
  3. https のページに残った http の画像やファイルを探して直す
コラム

https のページに残った http の画像やファイルを探して直す

この記事の要点

https のページで画像やファイルを http のアドレスから読み込むと、ブラウザが https に直して読みにいくか、読み込みを止めます。止められた分は表示が欠け、鍵の印も付かないことがあります。開発者ツールで http の読み込みを探し、https のアドレスか、サイトの中を指す書き方に直します。

サイトを https にしても、ページの中の画像やファイルを http のアドレスで読み込んでいると、ブラウザは https に直して読みにいくか、読み込みを止めます。止められた分は表示が欠け、ブラウザによっては鍵の印が付かなかったり、警告が出たりします。混在コンテンツ(mixed content)と呼ばれる状態です。開発者ツールで http の読み込みを探し、https のアドレスか、サイトの中を指す書き方に直します。

ブラウザは、読み込むものの種類によって、直して読むか止めるかを分けます

Google は 2018 年 2 月、同じ年の 7 月の Chrome 68 から、http のサイトをすべて「保護されていない」と表示すると発表しました。2019 年 10 月には、https のページの中の http の読み込み(混在コンテンツ)を、段階を踏んで止めていく方針を出しています。

今の扱いは、MDN の「混在コンテンツ」のページにまとまっています。

読み込むもの ブラウザの扱い(MDN の説明)
画像(img の src で指定したもの)、音声、動画 アドレスを https に直して読みにいく。https で無ければ読めない
スクリプト、スタイルシート、iframe で埋め込んだページ 止める
srcset や picture で指定した画像、Web フォント 止める
ドメイン名ではなく IP アドレスで指定したもの 直さずに止める
http のアドレスからのファイルのダウンロード 止める

画像なら直して読んでくれる、とは言い切れません。同じ画像でも、指定のしかたで止められる側に入ります。読み込む先が https に対応していなければ、直して読みにいっても表示されません。だから、ブラウザの自動の手直しを当てにせず、http のアドレスをページから無くします。

探すのは、ブラウザの開発者ツールのコンソールとセキュリティの画面です

JPRS の用語の解説も、混在コンテンツの原因になっている箇所は、ブラウザの開発者向けのツールで特定できると書いています。Chrome なら、開発者ツール(デベロッパー ツール)を開いて、次の 2 か所を見ます。

http の読み込みを探す順番(Chrome)
  1. ページを開くhttps のアドレスで、気になるページを開く
  2. コンソールを見る開発者ツールのコンソールに、混在コンテンツの警告が出ていないかを見る
  3. セキュリティの画面安全でない読み込み先(オリジン)の一覧を開く
  4. ネットワークで絞る一覧から、ネットワークの画面で、どのファイルを読んでいるかを見る
  5. 書き出すページの URL と、http のまま読んでいるアドレスを、表に書き出す

1 ページずつ見るので、主なページから始めます。トップページ、お問い合わせのページ、記事の多いブログの一覧、古い記事のいくつか。ページのソースを表示して「http://」で検索する方法でも、見つかります。

直し方は、https のアドレスに書き換えるか、サイトの中を指す書き方にします

見つかった http の読み込みの直し方

自分のサイトの中のもの

  • https から始まるアドレスに書き換える
  • または、サイトの中を指す書き方(相対パス・ルート相対パス)にする
  • サイトマップに載せた URL も https にする

ほかのサイトから読み込むもの

  • 読み込む先が https に対応していれば、https に書き換える
  • 対応していなければ、外から読み込むのをやめる
  • とくに動画と広告のバナーを見る

JPRS の解説は、サイトの中のリンクを、すべて https から始まる書き方に直すか、相対パスで書くかのどちらかを挙げています。外から読み込むものは、読み込む先が https に対応していれば書き換え、対応していなければ、外から読み込むのをやめます。

WordPress のサイトなら、記事の中に書き込まれた http のアドレスも探します。WordPress は 2021 年 3 月の 5.7 から、http から https への切り替えを 1 回の操作でできるようにし、そのときにデータベースの中の URL も自動で書き換える、と案内しています。それより前に https にしたサイトや、テーマのファイルに直接書かれたアドレスは、別に見ます。

http で開いた人を https へ送る設定と、HSTS を分けて考えます

ページの中の読み込みを直しても、http のアドレスで開いた人には、http のページが出ることがあります。サーバーで、http で来た人を https へ 301 で送ります。転送の決め方は 301 の転送の記事 に書いています。

その先にあるのが HSTS です。サイトからブラウザに、「この期間は https でだけつなぐように」と伝える仕組みで、期間は秒で指定します。JPRS の解説によると、サブドメインまで含める指定もでき、初めて訪れたときや期間が切れたあとは、http でつながります。サブドメインまで含めるなら、すべてのサブドメインが https で開けることを先に確かめます。

2026 年 7 月に当社が e ラーニングの仕組みを公開した日には、https のアドレスで開くと 200 が返ること、http のアドレスで開くと 301 で https に移ることを確かめました。その日の手順は 業務の仕組みを公開する日の記事 に書いています。

直したのに表示が変わらないときは、キャッシュを疑います

2026 年 8 月に当社が別の仕組みを公開した日には、直したはずの表示が変わらず、古いページが返り続けました。レンタルサーバーの側のキャッシュ(作ったページを一時的に取っておく仕組み)が、直す前のページを持っていたためです。キャッシュを消すと、直したページが返るようになりました。それ以来、公開の直後に表示が変わらないときは、まずキャッシュを疑うことにしています。

http の読み込みを直したあとにも、同じことが起きることがあります。サーバーのキャッシュと、ブラウザのキャッシュの両方を消してから、もう一度コンソールで警告を見ます。

SSL 証明書の期限で https が止まらないようにする方法は、SSL 証明書の自動の更新の記事 に、WordPress の毎月の保守で見ていることは 毎月の保守の記事 に書いています。

よくあるご質問

鍵の印が付いているページにも、http の読み込みが残っていることはありますか?
あります。止められた読み込みがあっても、ページそのものは安全な扱いのままで、鍵の印が付くことがあります。その場合は、止められたスクリプトや画像の分だけ、ページの一部が動かなかったり、表示されなかったりします。開発者ツールのコンソールで、警告が出ていないかを見ます。
ほかのサイトの画像や動画を、http のアドレスで埋め込んでいます。どうすればよいですか?
JPRS の用語の解説は、読み込む先が https に対応していれば https に書き換え、対応していなければ、外から読み込むのをやめるよう書いています。とくに動画や広告のバナーが http のまま残っていないかを見ます。
サイトの中のリンクは、https から始まる書き方と、サイトの中を指す書き方のどちらにすればよいですか?
どちらでも混在は避けられます。JPRS の用語の解説も、すべて https から始まる書き方に直すか、相対パス(ルート相対パス)で書くかのどちらかを挙げています。ドメインを移すことがあるなら、サイトの中を指す書き方のほうが、移したあとに書き換える所が少なくて済みます。
直したのに、まだ警告が出ます。
ブラウザやサーバーに、直す前のページが残っていることがあります。2026 年 8 月に当社が仕組みを公開した日も、直したはずの表示が変わらず、サーバーの側のキャッシュを消して解消しました。キャッシュを消してから、もう一度コンソールで警告を見ます。

出典・参考にした資料

  1. JPRS 用語辞典「mixed content」
  2. JPRS 用語辞典「HSTS」
  3. MDN「混在コンテンツ」
  4. Chromium Blog「A secure web is here to stay」(2018 年 2 月 8 日)
  5. Chromium Blog「No More Mixed Messages About HTTPS」(2019 年 10 月 3 日)
  6. Chrome for Developers「プライバシーとセキュリティ パネル」
  7. WordPress.org「WordPress 5.7 “Esperanza”」

この記事を書いた人

小野 隆士ドットシンク株式会社 代表取締役

システム開発会社の会社員、Web 制作の個人事業主、不動産営業、Web 制作会社の役員を経て、CRM 事業を軸にドットシンク株式会社を起業。自社の営業と事務の仕事に AI を使い、そのやり方を AI研修と AI伴走支援でお客様の会社に持ち込んでいます。デジタル庁 デジタル推進委員(2024 年 7 月任命)。

代表のプロフィールを読む