SSL化に伴う混在コンテンツ対策の手順と置換ツールの紹介

SSL化に伴う混在コンテンツ対策の手順と置換ツールの紹介

FC2ブログのあれこれ
2018/11/28
16
vanillaice (Akira)
vanillaice (Akira)
AOSSLSSLトラブル対処サイト紹介Bookmarklet

混在コンテンツ排除のついての総まとめ記事です。
まず最初に、私が制作したテンプレートのみの言及です。FC2ブログテンプレートにはそれぞれの仕様やアップデート状況など環境が常に一定なわけではありませんので、本記事については「Akira制作テンプレート」に限定したいと思います。

追記 2020.4.9

この記事は公開から1年以上経過しています。FC2では「HTTPS置換ツール」が提供されていますのでそちらをご利用になると良いと思います。

FC2ブログ「HTTPS置換ツール(β版)」がひっそりリリース

FC2ブログ「HTTPS置換ツール(β版)」がひっそりリリース

私今気づきました。なのでいつから提供されているのかわかりません(笑)...

追記 ここまで

対策の事前準備

以前に以下のような記事を書きました。

FC2ブログSSL化後の混在コンテンツの見つけ方【簡易版】

FC2ブログSSL化後の混在コンテンツの見つけ方【簡易版】

ぼちぼちとみなさんSSL設定を有効化しているようです。 ただ拝見しますとほとんどの方がこの表示です ↓ ブログは https 化済み、ページ内容に http が紛れ込んでいる状態。 混在コンテンツ ですね。 普段からhtmlソースを扱っているという方以外は、気付いてはいても何から手を付けたら良いのかわからない場合もあります。 テンプレートが原因なのか、プラグインなのか、自分が書いた記事なのか、それさえわからな...

こちらの方法を取る場合にはブラウザは問いません。どのブラウザでも同じように作業できます。が、効率はよろしくない。
作業効率を上げるためには Google Chrome を利用してください。本記事はGoogle Chrome利用を前提に話を進めます。

Google Chromeのインストール

以下はダウンロードページへのリンクです。既に入手済みの方は最新版にアップデートを済ませてください。
あるいはChromeでなくとも類似ブラウザ(Chromiumベースブラウザ)でも同じ作業が可能です。

Google Chrome - Google の高速で安全なブラウザをダウンロード

Google Chrome - Google の高速で安全なブラウザをダウンロード

新しい Google Chrome で毎日をもっと快適に。Google の最先端技術を搭載し、さらにシンプル、安全、高速になった Chrome をダウンロードしてご活用ください。

DevTool(ディベロッパーツール)を活用

滞在ページの画面上で右クリックすると「検証」の項目が出てきますのでクリック。すると開発者用ツールが表示されます。Chrome以外のChromiumブラウザでは「Inspect Element」をいう項目になっている場合もあります。

画面右側がDevTool

初期状態では上記スクリーンショットのようにブラウザ画面内に表示されます。画面領域を占有されたくない場合には右上の のマークを 長押し するとレイアウトの選択肢が出てきますので、切り離しを選択してブラウザ画面から追い出してください(つまり別窓表示)

DevToolの切り離し方

ゴチャゴチャと表示されて尻込みするかもしれませんが、 今回使うのはDevToolの下にあるConsole(コンソール)だけ です。

テンプレート修正について

2017年09月22日を含みそれ以降 にDLされた方については何も修正する必要はありません。
スタイルシートの最上部に更新情報を記してありますので各自ご確認ください。2017.9.22以降の日付がある場合には「SSL対応」の文字が無くとも対応済です。

httpsに書き換えてはいけない部位

テンプレート内には http: のスキームをいくつか発見できると思います。が、それらを https: に変更する必要はありません

  • OGP設定関連(head内 og: http://ogp.me/ns# fb〜)
  • schema org(構造化マークアップ用json)
  • svg(w3.org)
  • トラックバック(location replace用JS)

上記3つは混在コンテンツとは無関係です。OGP, schema org. svgは宣言的に用いられているだけでアクセスを飛ばしているわけではありません。また、それぞれの正規アドレスはあくまでもhttpです。
トラックバックについてはまだFC2ブログ全体のSSL強制移行が始まっていませんので、httpのままにしておかないと非SSLブログへのトラックバックができなくなってしまいます(絶対アドレス記載必須のため)

ともかくテンプレートの2017.9.22の日付を確認されまして、それ以降であれば何もする必要はない・してはいけない、ということです。
ただしテンプレートに任意追加した内容についてはhtml, CSS, JSを問わず必ずご自身でスキームのチェックを行ってください。FC2ブログプラグインも含みます。
個別記事で利用した内容、外部ウィジェットの掲載、アフィリエイトやランキングバナーの設置、CSS装飾など、任意追加した内容及びプラグイン内容についてはテンプレートとは関連がありませんので自己責任になります。
テンプレート修正は無い、を前提としてこの記事を書いていますので、これら任意内容に混在コンテンツが有るか・無いか、有るならばどう見つけてどう修正するのか、というのがこの記事の主旨です。

混在コンテンツ対策手順の大前提

Chromeに限定した説明です。ブラウザの特徴というのはまちまちなので全ての説明をしているわけにもいきません。なので限定します。

手順的には

  1. 混在コンテンツとなっている対象ページを探す --- アドレスバーのインフォメーションマークを確認
  2. 該当ページ内で混在コンテンツの原因になっている要素(画像やスクリプトやiframeなど)を特定する

という段階を踏みます。なので アドレスバー横のマークに注目する というのが大事です。

このマークが混在コンテンツの印ですから、ほとんどのユーザーはこれが出ないページでは特に何もする必要はありません。ただし スクリプトファイル の掲載に心当たりがある方は右側も気にしてください。この左側は主に 画像 が原因となっている場合に表示されます。右側はスクリプト関連です。詳細は以下の記事を参考に。

FC2ブログ SSL対応中にチェックするアドレスバーの警告は鍵マークだけではない

FC2ブログ SSL対応中にチェックするアドレスバーの警告は鍵マークだけではない

地味に始まって地味に拡がっているFC2ブログのSSL化(笑) SSL化「する」「しない」の根本的なところは、せっかくFC2運営が用意してくれたのですから、よほどの事情がない限り対応すべきだと思います。 セキュリティを度外視してまでページ上で守る「何か」が何なのか私にはわかりませんが、個人的な理由でSSL化に待ったのかかっている方もいらっしゃると思いますし、それを考慮しての302リダイレクトでの提供ですけれど。 ...

混在コンテンツの対象

単純に http の文字列を探して https に変更、というわけにはいきません。https に変更してはいけないもの もあります。

httpからhttpsに変更必須

  • img要素のsrc属性 --- html
  • script要素のsrc属性 --- html
  • iframe要素のsrc属性 --- html
  • backgroundプロパティのurl値 --- CSS

httpからhttpsへの 変更不可または変更前確認必須

  • a要素の href属性 --- html

書き換え必須なのは「画像アドレス」「スクリプト(JS)ファイルアドレス」「iframeの相手方サイトアドレス」「背景画像のアドレス」 などです。

httpsへの変更または利用の停止が必須となる要素

画像 --- html

<img src="http://xxxx.jpg" alt="">

スクリプト(JS) --- html

<script src="http://xxx.js"></script>

iframe --- html

<iframe src="https://xxx.html"></iframe>

背景画像 --- CSS

.xxx {
  background: url(http://xxx.png)
}

他にも audio, video, object などがありますがブログ内でよく利用されているものは上記の4種ではないかと思います。これらについては修正必須です。
そのうちの「画像」「スクリプト」に関してFC2ブログサーバーにアップロードしたファイルについてはphp, htacess を用いたバックエンド(サーバーサイド)処理が行われてはいますがどうも上手く機能していません。この件は後述します。
いずれにしてもアドレスバーでインフォマークが出ていない場合には修正の必要はありません。過去に使用した画像全てがhttpスキームだからといって全記事の編集ページを開いて確認するようなことはしなくて大丈夫です。なにはともあれインフォマークに従います。

スクリプトについては外部ウィジェットをプラグインフリーエリアで利用していたり、あるいはを常駐でなく単掲載(個別記事掲載)している場合もあるかと思います。Twitterのウィジェットとかそういうの。
これらについてもhttpsへの書き換えが必要ですが、httpsでアクセスしても表示が行われるかどうか、動くかどうか を事前に調べてください。httpでしか表示できないものをhttpsに勝手に変更して良いわけがありませんので、必ず書き換える前に確認。

これはiframeの掲載も同じです。iframeというのは他のページを自身のページに取り込みますので、相手方(取り込む元のページ)がhttpの場合には即座に混在コンテンツとなります。 httpsではアクセスができない、となった場合には 使用しない。それしかないです。
iframeに該当しそうなのは ブログカード ですね。YouTubeもiframeですがこちらはGoogleによる救済処置があります。

プラグインの場合にはファイルサーバーがFC2ブログの場合はhttpsでアクセスできますので書き換えOKです。外部サービスの場合はFC2の責任でもましてテンプレート製作者の責任でもなく、その外部サービスの問題ですから個々に折り合いをつけるようにしてください。

あと、とかくhtmlの方へ目が行きがちですが、CSS内の画像アドレスにも注意を払ってください。
仮に何かしらのプラグイン(FC2プラグインではなくweb一般のプラグイン・ウィジェットのことです)を追加しており、その装飾用CSSを 外部ファイルとして記載している場合には注意。

<link rel="stylesheet" href="https://xxxx.css" media="all">

こんな風にhead内に追加した覚えがある場合。CSSファイル自体のアドレスがhttpsだとしても、中身のCSSソース内にhttpアドレスの画像などが含まれている場合があります。その場合には当然混在コンテンツですし、非常に気づきにくいんですね。
それでも修正しなければいけません。ファイル修正をし、修正後ファイルをFC2ブログにアップロードして利用する、という形になります。元のファイルがCDNだとしても修正する必要があるならばFC2サーバーに切り替えることになります。

a要素のhref属性は細心の注意を(混在コンテンツ対象外)

いわゆる「リンク」のことです。

<a href="http://xxx.com/">第三者サイトへのリンクです</a>

画像やスクリプトというのはページが表示される際に自動でアクセスが行われます。ページを開くと既に画像なんかは表示された状態で目に入りますよね。そういうのが混在コンテンツの対象要素です。
ページ遷移に利用するa要素ですが、ページ遷移というのはユーザーが任意でクリックするまで何も起こりませんし、移動先ページについては同ブログ内であろうと他サイトであろうと滞在ページとは関係がありません。そのページあるいはそのサイトに管理責任があります。なので混在コンテンツの対象とはなりません。
繰り返しますが、自動アクセス系(画像, スクリプト, iframe など)が対象でリンクは対象外。

混在コンテンツ対策をしているということは自身のブログがSSL化しているわけですから、自身のブログへのリンク(別ページに飛ばすとか)は https に書き換えると良いですね。そうすればリダイレクト処理が発生しません。
ただこの「リダイレクト」が存在する以上、無理に書き換える必要はないですよ。

絶対に書き換えてはいけない、あるいは確認必須なのは 第三者サイトへのリンク です。
相手方が http で運営しているのに勝手に https に変えてしまったらそのサイトにはたどり着けませんので確認必須です。
第三者サイトはhttpのまま残しておいた方が良いかもしれませんね。よほどの事情が無い限りSSL化した際にはリダイレクトを用いるはずです。

第三者サイトへのリンクについては スキーム省略 もダメですよ。スキームを省略すると滞在ページと同じプロゥトコルで通信することになります。つまりSSL化後はhttpsで通信するわけです。
相手方がhttpなのに(ry

混在コンテンツの見つけ方

スクロールを行うようにしてください

テンプレートによっては混在コンテンツに気づきにくい場合があります。
事前に但し書きした通り私のテンプレートの話ですよ (´・ω・`)
表示直後には「混在コンテンツなし(のように見える)」だが、スクロール直後に「混在コンテンツあり」に切り替わるものがあります。 アドレスバーを注意深く見ており、かつスクロールを行った場合には気づけますが、アドレスバーだけ確認してすぐに別ページに移動してしまうと見逃してしまいます。
混在コンテンツ有無の確認時は必ずスクロールを行ってください
一見しただけで離れてしまわないよう注意。スクロール量はほんの少しだけでOKです。

最近のテンプレート制作は「表示スピード」も考慮しなければいけない時代に入っています。個別記事の下に前後ページへのページ送りがあり、サムネイル画像が表示されるものをいくつか制作しております。
ただページ送りのサムネイル画像はabove the fold(ファーストビュー)内に有りませんので、すぐに表示する必要が無いんですね。従ってスピード対策のために情報の取得を遅らせています。前後ページサムネイル取得のJSが発火するのはスクロール直後です。

前後ページのサムネイル画像を取得するFC2ブログ独自変数というのは今のところありませんので、私がそれ用のJSを書いているわけなんですが、簡単に言うと非同期で前後ページの内容を見に行ってるんです。前後ページは閲覧者の目には見えませんが、JSで内容を見に行っているのですから、そのページ内に混在コンテンツ対象が有った場合には滞在ページも連動して混在コンテンツとなります。
滞在ページがクリーンだとしても前後ページの影響が出る、ということです。
この仕様に賛否あるでしょうが、どのみち混在コンテンツは全て潰さなければいけませんので我慢してください ←

滞在ページに混在コンテンツ要因が無いにも関わらずアドレスバーが混在コンテンツを示している という場合には前後ページを疑ってください。 また、スクロール前は正常、スクロール後にインフォマークが出た場合には前後ページに起因していることが確定します。

DevToolを活用

コンソールというのは下部の黄色っぽい背景の部分で、何かしらのエラー内容などがあった場合に教えてくれるようになってます。
混在コンテンツが有る場合には Mexed content と表示され、数が多い場合には折り畳まれていますので数字横の矢印をクリックして展開します。

Mixed Content: The page at '該当ページアドレス' was loaded over HTTPS, but requested an insecure image '該当画像アドレス'. This content should also be served over HTTPS.

〝xxxページはhttps通信でローディングされましたが、yyyという画像が非安全通信でリクエストされました。この画像もhttpsで受け取れるようにしてください。〟

画像アドレスをクリックすると実際の画像も表示してくれます。「どのページの」「どの画像が」というところまですぐにわかります。
混在コンテンツの対象はほとんどが画像だと思いますが、画像の場合は黄色での表記。これは「passive mixed content」です。
対象がスクリプトファイルやiframeであった場合には黄色ではなく赤色で表記されます。これが「active mixed content」です。
activeはpassiveよりも危険度が高いため ブロック されます。画像はpassiveなので表示自体は行われますが、修正すべき内容です。

ついでですが、私のテンプレートに関してはコンソールで赤字のエラーは出ないはずです。コンソール警告のほとんどはJSに関するもので、赤字エラーが出ている場合には任意追加内容(プラグイン含む)にエラーがあるか、あるいはAdblockによって広告がブロックされているかのいずれかです。後者は気にする必要はありません。わざとブロックしているのですから気にしない(笑)
あとこちらもついでに [Deprecation] となっているのはChrome自体のAPIの変更に関するお報せなので気にしなくて大丈夫です。また、YouTube掲載で大量の赤字エラー祭りになるのはもうおなじみですね。つか自社サービスなんだから調整しろよ。

というわけで、混在コンテンツの発見についてはChromeのDevToolを使えば何も悩む必要がありません。

FC2サーバー上ファイルの救済措置について

--- 追記 2018.11.28

本章の内容については修正されたようです。内容だけは記録として残しておきます。
ここが修正されたのでSSL化による混在コンテンツ対策作業はほとんど発生しないのではないかと思います。

過去掲載画像の混在コンテンツが解消されたようです【追記あり】

過去掲載画像の混在コンテンツが解消されたようです【追記あり】

--- 2018.11.30 追記 解消された、という記事内容でしたがどうやら一過性だったようです。現在では再び混在コンテンツとなっています。 いちおう記事は消さずに残しておきますが、以下の内容は 現時点では 誤情報です。すみません。...

--- 追記ここまで

--- 追記 2018.11.30

上記1つ目の追記で「解消済」としましたが再度発生しています。今の所システムが安定していませんので状況に応じて追記していく形になると思います。

--- 追記ここまで

これが上手く行ってないですね (´・ω・`)
先に少し記したように、過去に記事内などではっきりと http とスキームが書書かれている場合にはバックエンドの作業で書き換えを行うというのがどのサービスでも通常の手順です。

raw html(生の・素のhtml, みなさんのテンプレート管理画面に書かれているソースコード + 記事内容)を送信

サーバーへリクエスト(サイトを表示してください)

サーバーからのレスポンス(はいどうぞご覧ください)
・独自変数などのphp処理 --- ここで書き換えが行われる

サイトの表示
・ブラウザに表示される際にはhttpがhttpsに書き換わっている(ただしraw htmlが書き換わることはない, 記事内の画像アドレスも同様)

おおざっぱに説明するとこういう段階を踏んで最終的にブラウザ表示となるわけです。素のhtmlソースに http と記された、例えば「画像」があったとします。それらについてはレスポンスが届く前に https に変更して届けられます。レスポンス後に処理したのでは間に合いません。通信が発生する前にこの書き換え処理を済ませておく必要があります。画像への通信リクエストはレスポンスが届いた「後」に行われます。

で、実際どうなっているかというと、いくつかのパターンがあります。以下はパターン別の状況説明です。raw htmlは書き換わらないよ、というのを念頭に読み進めてください。

正常書き換え, 混在コンテンツの指摘なし

これが本来ですよね。このパターンもあるにはありますが 残念ながら稀

httpsに書き換わらない

書き換わってないものもありますねぇ (´・ω・`)
このパターンは http のままなのですから当然混在コンテンツです。

httpsに書き換わっているものの混在コンテンツ

これが一番ワケワカメ。 ブラウザ表示後にDevToolやソース開示(view page souce)やブラウザ拡張で画像URLを表示するものなど、ツールを利用してアドレスを確認しますと https に書き換わっているのが確認できます。がしかしブラウザの判定は 混在コンテンツ という現象が起こっています。

「お前のテンプレートの仕様のせいじゃね? m9(´・ω・`)」と思われてもいけませんので、検証は公式テンプレートを設定して行っています。
スクリーンショットでご確認頂けるように、画像のスキームは https に書き換えられています。ところがこのページは混在コンテンツです。混在コンテンツの対象はこの画像です。

スクリーンショットはパソコンのMac OS「Google Chrome」ブラウザです。スマートフォンのiPhone XS(iOS)「Safari」でも同様に混在コンテンツと判断されています。
FC2一般ブログ(独自ドメイン以外)SSL化直後は違ったんですね。ところがある日を堺に軒並み「混在コンテンツ」と判定されるようになりました。
「何故?」や「修正方法は?」については何も言えません(ぇ)
バックエンドの処理ですからユーザーにできることは何もありません。
こうなってくると raw htmlを書き換える他に術がありませんので、編集画面を開いてチマチマ修正… (ノД`)シクシク

どうにもできない状況ですよ、というのをお伝えした上で、全画像が同じ症状とも限りません(そこが不思議)ので、今回の手順通り「インフォマークで混在コンテンツを明示されたページのみ対処」という形で良いと思います。もちろんマークが出ないページも含め全部修正する、というのが一番良案ではあります。記事数の多い方は無理ゲーだけど(笑)

書き換えの仕方

対象ページの編集画面を開いたら Ctrl + F キーボードショートカット(Macユーザーは CtrlCommand に置き換え)を利用して http: を探し、https: に直します。テキストエディターをお持ちでない方はこの方法を取ることになるかと思います。

テキストエディターで作業する場合、くれぐれも テキストエディターなどを利用した安易な一括変換を行ってはいけません。a要素なのかimg要素なのかしっかり確認をしてください。
一括置換を用いる場合には http: を対象にするのではなく src="http: を対象にします。a要素のhref属性の置換を避けるためです。
それでもiframeのsrc属性などはアクセスの可否を確かめる必要はあります。

まとめ

  • テンプレートの更新日をチェックすること
  • プラグイン・アフィリ・バナー・ウィジェットなど任意追加内容は自己責任で管理
  • ページチェックの際はスクロールを行ってアドレスバーを確認
  • ブログカードを利用するときはスクリプトファイル(JS取得の場合, はてなブログカードなど)のスキームだけでなく相手先のサイトのスキームもhttpsであることが必須
  • 第三者サイトへのリンクは勝手に書き換えたりスキームを省略しない
  • 画像のアドレスはとにかく辛かろうとも全部httpsに書き換える(OGP画像以外はスキーム省略可)

「ページ送りサムネイル」に気づいていない方もいらっしゃるかもしれません。滞在ページに問題が見当たらない場合には前後ページの確認を。
ページ送りサムネイルの無いテンプレートは関係ないですよ。その場合には滞在ページ中に問題が必ずあるはずです。

なかなか大変な作業ですが、早い段階から画像アドレスのスキームを省略していた方々はずいぶんと楽ですね。
ただGoogleの推奨は「スキームを省略しない」なので、今後は書いた方が良いのかもしれません。個人的には過敏になる必要は無いと思いますが。

追記 置換ツールの紹介

FC2ブロガーの mochiさん が http→httpsの置換ツールブックマークレットを作ってくださってます。

FC2ブログSSL後の過去掲載画像の混在コンテンツ問題を自分なりにまとめてみました。

FC2ブログSSL後の過去掲載画像の混在コンテンツ問題を自分なりにまとめてみました。

なんなの?この現象…ワケが分からなすぎる。 追記:2018/12/6 2018/12/6時点においてFC2ブログ過去掲載画像の混在コンテンツが解消されているもようです。 プリロードされる画像データがhttpsアドレスに変換されたものになっていました。 追記:2018/12/25 記事最後で構想していた連続記事編集を行う置換ツールを作成しました。 FC2ブログの過去記事内のhttp→httpsを自動で連続変換するExcelVBAツール「FC2BlogAutoEdite...

FC2ブログSSL化の混在コンテンツ問題の経緯のまとめと、FC2ブログ画像http→https変換 ブックマークレットの提供もあり。
こちらの置換はFC2画像サーバーのリンクのaタグ以外のhref属性を対象外にしてあり、リンク切れを心配せずにガンガン使うことができますので「書き換えてる時間なんて捻出できない!」という方にとってはかなり強力なツールになると思います。
恐らく使用報告なども不要だと思いますので、そっと手を合わせて感謝しつつ使わせて頂きましょう(笑)

書き換え対象

<img src="http://blog-imgs-xxx.fc2.com/x/x/x/xxx/xxx.jpg">

書き換え対象

<a href="http://blog-imgs-xxx.fc2.com/x/x/x/xxx/xxx.png"><img src="http://blog-imgs-xxx.fc2.com/x/x/x/xxx/xxx.png"></a>

書き換え対象外

<a href="http://xxx.blog.fc2.com/">yyy</a>

私の方でも混在コンテンツの状況をまとめています。

FC2ブログSSL 過去画像全滅の件【12/7 追記あり】

FC2ブログSSL 過去画像全滅の件【12/7 追記あり】

情報が二転三転、というよりもシステムが安定していないといった方が正しいか。 「過去に http を明示して掲載した画像の一部が混在コンテンツのままになる件が解消されました」という記事を書いたのがつい昨日のことなんですが、本日再度混在コンテンツと相成りまして、それどころか現時点では一部のみならず 全滅 といった事態になっております(笑)...

状況が二転三転していますがこれでなんとか落ち着くのではないかと思います。ただ一番良いのは 書き換えること です。そうすればシステムの動向に左右されることはありません。時間が無い方でもmochiさんのツールを利用すれば1ページにつきワンクリックで済むのですから是非。

Related post

Comments  16

M
2018/11/29 (Thu) 03:03

画像アドレスの件

Akira様

いつもお世話になっております。

ゆうらりHappySmile の管理人Mです。

Akira様のこちらの記事を拝見いたしまして、画像アドレスを全部httpsに書き換える必要がある事を知り、とても困惑しています。

私のブログは現在7824記事ほどございまして、そのほとんどに画像が挿入してあります(汗)

しかも、途中から画像のaタグを外してしまっているため、1記事ごとに投稿画面を開いて確認する必要があるのかな?と思いまして...

とりあえず直近の記事から修正してみようとしたところ、どうやら新しい記事から順番にhttp:からhttps:に自動で置き換えられているようです。

この調子で、FC2側で全部修正してくれることを期待しつつ、しばらく様子見しようかと思います(;^ω^)

気になったのでご報告まで。

vanillaice (Akira)
Akira
2018/11/29 (Thu) 05:20

To Mさん

おはようございます (ノ゚ェ゚)

最近の画像はもとからhttpスキームになっているので書き換えられているわけではないですよ。
一般のブログのSSLが始まって以降はアップローダーの全画像はhttpに変更されています。
なので書き換えではなく直書きでhttps
なっているずですからご確認ください。
書き換えというのはhttpとはっきり書いてあるものをどうするか、なんですよね。そしてそれが現状では上手く機能していないもよう。

誤解を招く文章になっていたようなので少し修正しました。
スキーム修正が必要なのはページチェックに引っかかったページです。例えば全2000記事のうち1000記事が混在コンテンツ対象ページであったならば、その1000記事についてはページ内の画像スキームには全部書き換えだよ、という意味です。

全記事で投稿画面を開く必要も無いですね。そのための手順を書いています(笑)
もちろん対象ページだとはっきりわかればその編集ページを開く必要はあります。

今早朝でスマホからなのですぐにはできませんが、温存してあるhttp画像の様子をまた確認してみます。そしてこの記事ももうすこしわかりやすく手を入れようと思います ('ω')

M
2018/11/29 (Thu) 10:18

To Akiraさん

Akira様

おはようございます。

そうですよね(;^ω^)Akira様のおっしゃる通りだと思います。

しかし、記事によっては

①すでに<img src="https://●● となっていたり(最近いじった事のない記事。aタグを消して記事に貼った画像の場合)

②<a href="http://●● <img src="http://●● となっていたり(最近いじった事のない大昔の記事で、かつaタグを消してない画像の場合)

③しかも<a href="http://●● <img src="https://●● とimgの部分だけhttps:に変わっている記事(最近いじった事のないけっこう昔の記事でaタグを消してない画像)も混在していました(;'∀')

一体、何なんでしょうかねぇ…

よく分からなくなりました。とりあえず、imgだけの部分はhttps:になっている記事が多いんですよ…。<a href=の残っている部分は全部http:のままで(汗)

vanillaice (Akira)
Akira
2018/11/29 (Thu) 10:49

To Mさん②

これから時間を見て記事に追記・修正しますね。
先回の記事に書いたように画像のサーバー番号が関係しているのかわかりませんが、救済が全滅というわけではないんです。
参考記事: FC2ブログ独自ドメインのSSL対応開始のアナウンスが届きました
https://vanillaice000.blog.fc2.com/blog-entry-799.html

それに加え、例えばDevToolを利用するとDOMの内容(htmlの内容, サーバーから返ってきた内容)を見られますが、そちらで確認したりブラウザの拡張機能で画像のURLを表示するものなどを使って確認するとhttpsになっているんですが、ブラウザが「混在コンテンツ」と判断しているものもあるんです。
このあたりをもう少し詳細に記そうと思います。といっても対策はできませんので「現状こんな感じになってますよ」というだけですが。

なのであくまでも「アドレスバー」を確認して警告マーク(Chromeの場合は円に i のインフォメーションマーク)が出ているページを「該当」として扱うしかないですね。そのための手順説明がこの記事です。
生のhtml(raw html)は結局管理人にしか見ることができませんし、ブラウザが「混在なし」と判断すればそれは安全に通信できているわけですから、警告の無いページをどうこうする必要は無いですよ。

2018/11/29 (Thu) 12:08

To Akiraさん

Akira様

お世話になっております。

勉強になります。ありがとうございますm(__)m

お手をわずらわしてしまい、ご迷惑をお掛けして申し訳ありません。

今出先ですので、帰宅したらもう一度よく勉強し直します!

-
2018/11/29 (Thu) 13:09

管理人のみ閲覧できます

このコメントは管理人のみ閲覧できます

vanillaice (Akira)
Akira
2018/11/29 (Thu) 16:13

To Mさん

えっと。ご迷惑ってなんのことだろう。いやマジでわからないです(笑)
何も迷惑など被ってませんよ。どうぞお気遣いなく(笑)
画像の書き換えのことですよね。これはもう殆どの方が同じことを思われるでしょうから寧ろMさんのご質問がみなさんの役に立ちます :)

記事内容を修正しました。分かりづらい点がありましたらご指摘くださいね。
よろしくお願いします。

vanillaice (Akira)
Akira
2018/11/29 (Thu) 16:25

To 独自ドメイン 内部リンクの件 内緒さん

そうですね。内部リンクは大事です。
リダイレクトは使わないに越したことはありません。
というかSSL化されたんですね(笑)
お疲れ様でした :)

vanillaice (Akira)
Akira
2018/11/29 (Thu) 21:59

To Mさん②

修正されました(笑)
Mさんもご確認くださいね。よろしくお願いします。

Mさんの場合は外部直リンク画像(seesaaなど)がありますのでそちらは修正必須です。頑張って ^^;

M
2018/11/30 (Fri) 06:51

To Akiraさん

Akira様

おはようございます。

結局のところ、さまざまな混乱が生じている原因はFC2さんが見切り発車でSSL化のサービスを開始したからですよね(-_-;)それとも、我々がもう少しジッと見守らずに先走って動いてしまうからいけないのでしょうか?

あ。ボクがブログを始めたばかりに書いた数行程度のみっともない初期の記事を見られてしまいましたね(;^ω^)

hige
2018/12/01 (Sat) 18:44

No title

 少しでも気づいてくれる方があればと、ブラウザでの症状を自ブログに書いてみました。
 特にスクリプトの非SSLはブラウザがはじいていて、その表示がユーザーには判りにくいです。
 ブラウザの表示上では完璧になったと思っていても実はスクリプトがはじかれている。

 画像の変な症状は以前に確認していました。
 ある記事のエラーで、その記事でない他の記事の画像を混在コンテンツとエラーしてました。ChromeとFirefoxの両方で確認しました。で、それは潰してます。
 が、とりあえずもう一度確認し直そうと。
 FC2には頑張って欲しいです。
 

vanillaice (Akira)
Akira
2018/12/01 (Sat) 22:01

To higeさん

higeさん、こんばんは (●'0'●)/

そうなんですよ。アクティブ混在コンテンツのscriptの方に気づいていない方がホントに多いんです(笑)
ナビの展開が出来ない人とかすっごい多いです。
自分のブログなのだからスマホのハンバーガーをクリックして確認するぐらいのことはできるだろうに (´・ω・`)
でもスマホをお持ちでないのかもしれないしなぁ (´・ェ・`)
見かけたとしても私は他者制作テンプレはおろか、私が制作したものでもお知らせしないんです。意地悪なようだけど ^^;
基本は「用があるなら自分から来るやろ」精神です。おせっかいだと思われたり疎ましがられたりするのは勘弁って感じで。
でもホントは教えてくれる人の方が親切なんですよ?でも私は冷たいもので ←
もちろんお越し頂いた際にはできるだけお力に、とは思ってますけどね。

higeさんの記事はためになると思いますよ。たくさの方の目に留まると良いのですが。
無頓着な人が多いんだ、という事実に啓蒙活動されている方々はジリジリしていることかと思います(笑)

mochi
2018/12/09 (Sun) 21:23

あぁぁぁ…aタグのhref属性も変換しちゃいます (;・∀・)

こんにちは。Akiraさん。

あのブックマークレットですが、単純に「http://blog-imgs-」を「https://blog-imgs-」に置換しているだけなので、aタグのhref属性も変換も置換しちゃいます。
FC2ブログのデータサーバーであればhttps変換でのリンク切れはないだろうというのと、FC2ブログシステムでの自動変換でも同様にaタグのhref属性もhttpsに変換されていましたので問題無いとは思っているんですけど… (;・∀・)

vanillaice (Akira)
Akira
2018/12/10 (Mon) 00:23

To mochiさん

mochiさん、こんばんは ('0')/

私の表現に語弊がありました。修正しましたので確認お願いしますー。

mochi
2018/12/10 (Mon) 18:15

修正ありがとうございます

こんにちは。Akiraさん。
紹介していただいているのにお手を煩わせてしまい恐縮です。
修正内容確認OKです。(≧ω≦)b OK!!

vanillaice (Akira)
Akira
2018/12/10 (Mon) 20:33

To mochiさん

こちらこそお手数おかけしました。
いつもありがとうございます :)

コメントに関する注意事項
  • テンプレートに関するご質問は各テンプレート専用記事でのみ受付致します。また、よくある質問をまとめているページも事前にご参照ください。
  • 専門的なご質問の場合、記事内容と明らかに関連の無い内容はお控えください(雑談の場合はその限りではありません)
  • 第三者が不快と感じる内容や論調でのコメントはお控えください(性的,高圧的,暴力的など)