つい先日、ようやく重い腰を上げて「はてなブログのhttps化」をしてみたわけよ。
あまりにも今さらすぎて、まだ常時SSLに移行していないやつがいたのか？ってレベルなんだけど、いたんですよここにｗ
なんだかいわゆる「混在コンテンツ」問題がすごいめんどくさそうでね。別にhttpのままで何かに困っていたわけでもないし。
かといってぶっちゃけ印象問題としてさすがにそろそろよくないかなと思ったわけよ。
でもまぁ事前に調べていた＆準備していたおかげで、わりとさくっと完了出来たなーといった感覚。
ということで今後の誰かための備忘録＆やることリスト一覧。
だいたい数多の先人たちの言う通り
メインとなるMixed Contentsの対策として事前準備的なものに関しては、
もうほとんど先輩SSLはてな民の方々によって、ベストプラクティスは出切ってしまっている感があるんだけれど、私の方でも一応まとめ。
head内にmetaタグ貼ればいい？
公式でもガイダンスされているコレのこと。
<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">
どうしても修正箇所が膨大な場合は、確かにこれ1つで終了でもいいんだろうけどねぇ。
※未対応ブラウザの問題はあるよね
でもこれだけで済ませた場合、混在コンテンツの表示はされない代わりに、
仮にhttpしか提供されていないものがあった場合、その部分が404エラーになって表示されなくなるってことだよね？
まぁそんなもんが今の時代あるのかどうか、そしてそもそもそれを危惧するほどの影響が自サイトにあるのかを考えて判断したほうがいいね。
手動でコード修正してみる
ってことでやっぱり完璧を望むならってことで、ちまちまhttpの部分を修正していくことに。
なお、各所で言われている通り、外部リンクaタグ内のURL修正は放置で構わない。
「記事の管理」内の検索ボックスに該当コードを入力して、ヒットした物を書き換えていく。
はてなだとアフィリエイト系はカエレバ/ヨメレバで貼っている人も多いと思うので要チェック。
・Amazonアフィリエイト
http://ecx.images-amazon.com
→https://images-fe.ssl-images-amazon.comhttp://rcm-fe
→https://rcm-fe
・楽天アフィリエイト
src="http://hbb.afl.rakuten.co.jp
→src="https://hbb.afl.rakuten.co.jp
http://thumbnail.image.rakuten.co.jp
→https://thumbnail.image.rakuten.co.jp
・A8
http://px.a8
→https://px.a8
http://www1
→https://www1
http://www2
→https://www2
・もしもアフィリエイト
http://c.af.moshimo.com
→//af.moshimo.com
src="http://image.moshimo.com
→src="//image.moshimo.com
http://i.af.moshimo.com
→//i.moshimo.com
・バリューコマース
http://ck.jp.ap.valuecommerce.com
→//ck.jp.ap.valuecommerce.com
http://ad.jp.ap.valuecommerce.com
→//ad.jp.ap.valuecommerce.com
、、といった感じで。心配だったらASPサイトに行って、新しいリンクを取得して貼りなおしてもいいかもしれないね。
人によってはブログランキングなども。
・ブログ村
http://www.blogmura.com/
→http://s.blogmura.com/
https://s.blogmura.com/
→https://www.blogmura.com/
・人気ブログランキング
http://blog.with2.net
→https://blog.with2.net/link/?
んで、忘れちゃいけないjquery。
デザインの中で読み込んでいるこういったリンク先を、
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
「https」に変更しておく。
他にもスクリプトを読み込んでいる場合は、きちんとコードのURLをチェックしておこうね。
あとは画像のフォトライフ。
もしhttp://cdn-ak.f.st-hatena.comで埋め込んでいるものがあれば、これもhttpsに。
そしてCSS。
@import urlで読み込んでいるものや、background-imageなどもhttpsに。
というわけで私の場合は、こうやってしばし記事編集していったものを、まずバックアップでエクスポート。
さらに秀丸ちゃんなどのテキストエディタで検索を掛けるというダブルチェック体制でコンプリート。
さくっとHTTPS配信を有効にしてみる
なんだか手動チェックがめんどくさくなってきたので、ダッシュボードの設定から、HTTPS配信の状態を変更をぽちっとな。ってことで不可逆な常時SSL化達成！ｗ
と、言いたいところなんだけど、ここで一抹の不安が。。
果たしてほんとうに混在コンテンツは解消しているのだろうか問題。
これが数十記事程度なら、ブラウザを開いて手動でチェックしていっても構わないけど、ぶっちゃけかなりの労力。
さてさて、どうしたものか。
最初からこのツールで「全部解決」だった
ここでようやく本題が満を持して登場。もうね、結論的には最初からこれを使えばよかったよって話。
そしたら手動の数時間作業なんて要らなかったんや。。
はてなブログ用ツール(HatenaBlogTools)の中の、FixMixedContentを使ってみる。
ちなみに動作環境は、
.NET Frameworkまたは.NET Coreが動作する環境が必要です。 以下のいずれかのランタイムがインストールされている環境で実行してください。
.NET Framework 4.6.1以上
.NET Core Runtime 2.0.7以上
Mono 5.4以上
以下の環境で動作することを確認しています。Windows 10 + .NET Framework/.NET Core
Ubuntu 16.04 + .NET Core/Mono
未検証ですが、.NET CoreランタイムまたはMonoがインストールされていれば、Mac OSでも概ね問題なく動作するものと思われます。
普通にコマンドラインなわけだけど、今更SSL化をもくろむ古参はてな民ならこのくらい楽勝なはず(注：先入観かつイメージです)
まずは事前にはてなブログの設定画面からapiキーを確認しておこうね。
さて、次にダウンロードして解凍したら、コマンドラインにFixMixedContentをドロップ。
そしてスペースの後に、以下のコマンドを入力。
--id hoge --blog-id hogehoge.hatenablog.jp --api-key hoge --fix-mixed-content --dry-run >C:\hogehoge.txt
それぞれ、idの後ろには自分のブログID(ユーザー名)、blog-idの後には自分の(サブ)ドメイン名、そしてapi-keyには先ほど確認したapiキーを。
ちなみにこのコマンドの場合は、dry-runなので記事に混在コンテンツの修正は行わず、修正すべき箇所だけをコマンド画面上で確認することができるよ。
とはいってもずっと画面を眺めているわけにもいかないので、Cドライブ直下にhogehogeでテキストファイルが出力されるようにしてある。後程「変更あり」となっている部分を確認することができるよ。
(※ただし私の場合、数記事はなぜかチェックがされなかった。出力ファイルでの記事数と、総記事数の相違で発覚)
要修正の記事を確認してみて、それを一気に反映させたいならdry-runオプションを付けずにコマンド実行すればよくて、
さらに内部リンクまでも修正したい場合は、
--id hoge --blog-id hogehoge.hatenablog.jp --api-key hoge --fix-mixed-content --fix-blog-url
といった感じでfix-blog-urlを付ければおｋ。(これはSSL移行後にやらないとダメ)
他のツールや、より細かな仕様はぜひ公式ページを参照。混合コンテンツの解消のみならず、一括置換ツールなども非常に便利。
無事修正が終わったら、念のためapiキーは変更しておこうね。
※ブログ管理画面のapiキーの欄、「変更するにはこちら」に飛んで「投稿用メールアドレスを変更する」を押す。
混在コンテンツ修正の後は？
実はそう、HTTPS移行に伴ってまだ若干見直しておくことや、やるべきことがあるんだよね。
例えば、サイドバーやフッターなどのブログパーツの外部リンクURLとか固定ページへの内部リンクとかね。
さらにむしろ一番重要とも言えるのは、GoogleやらbingやらA8やらにhttpsサイトになったことを伝える必要があるわけよ。
・Googleアドセンス
→特別に何かする必要なし
※万が一古いコードを使用している場合は、たぶん前述のツールで引っかかる。
・Googleアナリティクス
ホーム画面の管理から、プロパティ設定、ビュー設定でそれぞれデフォルトのURLとウェブサイトのURLをドロップダウンからhttpsを選択して変更する。
・Googleサーチコンソール
左メニューのプロパティを追加から、httpsから始まるURLを新たに登録。
新しいプロパティ上でサイトマップ(sitemap_index.xmlなど)も送信しておく。
・各ASP
Amazonは変更不要。その他のA8などは登録してあるサイトを管理画面からhttpsのURLに変更する。
・ブログランキングなど
同じく登録情報をhttpsのURLに変更。
・bingウェブマスターツール
左メニューの診断ツールから「サイト移転」をする。単にssl化しただけの場合は「現在のサイト内で別の場所へ～」を選択。
※ドメインまで変わった場合は「別の確認済みサイトへ～」になる。
ソースに旧URL、移動先に新しいhttpsのURLを入力して送信すればおｋ。
アクセス数への影響は？
なんだかんだ深夜に作業したおかげで、当日のPV数には何も影響なし。
んでその後の推移を見てみてるんだけど、一時的に今までの半分くらいに落ち込んだ日もあったんだよねｗ
ただこれ、10連休っていう未曽有のゴールデンウィークとか、あとはGoogleアルゴリズムのアップデート後だったりなどで、正確な影響がわからない。
※っていうかそもそもブログ更新サボってる時期でもあるしｗ
今のところ、移行から2週間近くたった現状で、アクセス数はhttp時代と同等で平常運転に戻った感じ。
Googleやbingでのインデックスにも特に影響無さそうだし、実質的には私のサイトではSSL化はほぼPV減の要素にはならなかった、と言えるんじゃないかなぁ。
まぁ逆にhttpsになったことで少しはアクセス数の底上げになったら嬉しいなー、なんて思ってたんだけど、さすがに常時SSLが当たり前の昨今ではSEO的な価値も無くそんなうまい話はないらしいｗ
しかしなんだかんだ記事が増えれば増えるほどめんどくささが増すし、その後の影響も大きいと思うので、未着手の人はぜひ時間を見つけて早いうちにやっておこうね。
