ブログをMixed Content対応しつつHTTPS化しました 🎉
今年の4月から、はてなブログのドメインを使用している全ブログが HTTPS 化に対応しました。
(2月の時点ではまだ段階的に提供開始というステータスだった)
対応したいなと思いつつも、
「Mixed Content 対応のためには記事をひとつずつ保存し直してね、てへぺろ(ノ≧ڡ≦)」
という公式アナウンスだったので、「いや、きついっしょ……」と思い、
はてなブログの方で Mixed Content 対応のためのツールを出してくれるのではと期待していたのですが、
まだまだそんなものは出なさそうな気配でした。
しょうがないので、今日は時間もあったのでがんばって対応することにしました。
ブログの詳細設定 から行ける
エクスポートページ で、記事の一覧をテキストファイルでダウンロードできるので、
「http://nekonenene.hatenablog.com」で全文検索したりして、地道にがんばりました。
最後に mcdetect という npm のパッケージを使って、 Mixed Content が残っていないか確認しました。
npm install -g mcdetect
でインストールした後、例えば Mixed Content を含むサンプルページ
https://googlesamples.github.io/web-fundamentals/fundamentals/security/prevent-mixed-content/passive-mixed-content.html を調べてみると、以下のようにWarningsが表示されます。
mcdetect https://googlesamples.github.io/web-fundamentals/fundamentals/security/prevent-mixed-content/passive-mixed-content.html Checking https://googlesamples.github.io/web-fundamentals/fundamentals/security/prevent-mixed-content/passive-mixed-content.html ... Optionally Blockable: http://googlesamples.github.io/web-fundamentals/samples/discovery-and-distribution/avoid-mixed-content/puppy.jpg Optionally Blockable: http://googlesamples.github.io/web-fundamentals/samples/discovery-and-distribution/avoid-mixed-content/sleep.mp3 Optionally Blockable: http://storage.googleapis.com/webfundamentals-assets/videos/chrome.webm Optionally Blockable: http://storage.googleapis.com/webfundamentals-assets/videos/chrome.webm Targets checked: 1 Errors (blockable content): 0 Warnings (optionally blockable content): 4
ブログのURL一覧を、先ほどのエクスポートしたテキストファイルの
「BASENAME: 2018/09/09/160814」のように BASENAME: の右側に書かれている部分を用い、
正規表現の置換でいい感じにURLの一覧にします。
で、以下のようなブログURL一覧のjsonファイル blog_urls.json を作って
{ "targets": [ "https://nekonenene.hatenablog.com/2018/09/09/184352", "https://nekonenene.hatenablog.com/2018/09/09/160814", "https://nekonenene.hatenablog.com/2018/09/07/090818", "https://nekonenene.hatenablog.com/2018/09/02/215152", "https://nekonenene.hatenablog.com/2018/09/02/202115", 〜中略〜 "https://nekonenene.hatenablog.com/2015/03/30/131915", "https://nekonenene.hatenablog.com/2015/03/30/125724", "https://nekonenene.hatenablog.com/" ] }
mcdetect で全件チェックしました。
mcdetect --config ~/Documents/backup/blog_urls.json Checking https://nekonenene.hatenablog.com/2018/09/09/184352 ... Checking https://nekonenene.hatenablog.com/2018/09/09/160814 ... Checking https://nekonenene.hatenablog.com/2018/09/07/090818 ... Checking https://nekonenene.hatenablog.com/2018/09/02/215152 ... Checking https://nekonenene.hatenablog.com/2018/09/02/202115 ... 〜中略〜 Checking https://nekonenene.hatenablog.com/2015/03/30/131915 ... Checking https://nekonenene.hatenablog.com/2015/03/30/125724 ... Checking https://nekonenene.hatenablog.com/ ... Targets checked: 134 Errors (blockable content): 0 Warnings (optionally blockable content): 0
全件大丈夫そうですね。よかったよかった。
というわけで 今日から HTTPS でお届けいたします。最高ですね!