コバろぐ

社会人ブロガー頑張る

トップ > はてな > 【https】『コバろぐ』SSL化！その手順を書いておきます。【SSL】

【https】『コバろぐ』SSL化！その手順を書いておきます。【SSL】

はてな ブログ

当ブログではアフィリエイト広告を利用しています

★Kindle本は安く買おう→【お買い得】現在進行形のKindleセール情報！【随時更新】


はてなブログの独自ドメインもSSL化が可能となったとアナウンスされてどれくらい経ったでしょうか。

良く分からんし、めんどくさいしでずっとほっぽってましたけど、ついにやりましたよ。見ましたか？

f:id:gaou2:20180629004258j:plain

おらあ！「保護された通信」やでコノヤロウ！

というわけで、『コバろぐ』SSL化の手順と、めんどくさいのに対応したワケをここに残しておきます。あと、オマケとして恐ろしいハナシも。

目次

『コバろぐ』SSL化（http化）の手順

まず最初にご注意を。

これから記すSSL化の手順は、あくまでもぼくが何も知らないまま、他のブロガーさんの記事などを参考にしてやった手順になります。

もっと効率的に出来たり、もしかしたら間違ってたりする場合もなきにしもあらずです。しかし、ぼくのように「マッタクワカリマセン」という人でも真似してくれたらきっと成功するやり方です。「マッタクワカリマセン」という方のみ、参考にしてください。

一括置換ツールで置換！

『コバろぐ』をSSL化するにあたってまず読んだのはこの記事。

www.notitle-weblog.com

この記事をかいたシロマ (id:shiromatakumi)さんは、この『コバろぐ』で使っているデザインテーマ『Brooklyn』の作者としても知られています。もうシロマさんサマサマです。ありがとうございます。

で、この記事にはSSL化する前に差し換えておくべきコードが書かれています。しかも、それらを一括で変換できるツールも作って公開してくれています。

spiderwebs.tokyo

このツールを使えば全部の記事のコードの変換を1発でしてくれるのです！これはありがたい！

しかしサーバーの負荷を考えて100記事ずつの変換になり、シロマさんが紹介してくれている変換するコードは12種類。

この『コバろぐ』の記事は1450ほどなので、全部で15回×12種類の計180回の変換が必要になります。やりましたよ。シロマさんの記事から変換するコードをツールにコピペ。180回！

今回の作業では結局これが一番時間がかかり、3時間でした。3時間ずっとコピペ。クソ記事ばっかり書いてるからや…。

しかし、これで各記事の中身は問題がなくなるハズです。ヘンなのを挿入していなければ。

カスタマイズ部分の修正

記事の中身が完璧になっても、ヘッダーやフッター、サイドバーの中にヘンなのが入ってたらダメです混在コンテンツです。

というわけではてなでカスタマイズしてる部分を修正していきます。

ヘッダーやフッター、記事上や記事下に埋め込んでいるコードをチェックしてhttpがあったらhttpsに書き換えます。

いうても『コバろぐ』の場合はそんなに入れてないので、これはすぐに終わりました。

headに魔法の呪文を挿入

ここまでやっても、もしかしたら変換し忘れてるものがあるかも知れないし、見つけられないものがあるかも知れません。

そんなときに役にたつ“呪文”があるのです。とまじぃ (id:tomag) さんが以下の記事で惜しみなく書いてくれています。

www.toma-g.net

ちなみに、Twitterでケー(id:photoblg)さんにも教えてもらいました。

<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">

これをheadに入れておくと、ブラウザ側でhttpを無理矢理httpsとして読み込んでくれるそうです。ナニソレステキ。

２０１６年以前のはてなにアップした写真や楽天アフィの画像 他にももしもやA8などのスクリプトはhttpで配信されてる場合がありますが、現在は基本的にhttp→httpsにアドレスが変更されているだけなので、このおまじないを追記することで、画像が表示されたりスクリプトが動いたりする可能性が高いです。

引用元：はてなブログのSSL化を大きく３項目で説明します。 - とまじぃさんち

完了！

ここまでやって一応この『コバろぐ』のSSL化は完了しました。

あとはアクセスが多い記事からチェックしていって何かあれば修正、ということになると思います。

そしてSSL化に伴いサーチコンソールやアナリティクスの設定、アフィリエイトをしている場合は各ASPへの対応をしなければならないでしょう（Amazonは無用らしい）。

なんだまだやることあるな。

めんどくさいのにSSL化したわけ

めんどくさいめんどくさい言いながらやっと対応したSSL化。めんどくさいのに何でやったのか。

これについては、前に書いたんですけどね。

www.cobalog.com

おそらく、今後Googleはhttps通信を検索順位を決める条件に入れてきます。間違いないでしょう。つまり、そうなるとhttpのままだとサイトやページの検索順位は落ちる。そうなると、当然読まれなくなります。そして当然、収益が減ります。

さらに言うと、いずれ近い将来https以外は検索からはじかれることになると思います。

本当に検索から弾かれることになるのかは知りませんが。Googleの動きを見ていると、ぼくはそうなると思ってます。

そうなると承認欲求と収益に支障をきたすのです。

ブログ書くからには読まれたいし、お小遣い稼ぎもしたい。ていうか、そのためにブログやってますし。

じゃあもうGoogle神の言うことを聞くしかないでしょう。

オマケ：作業の途中で垣間見たSSL未対応の恐ろしさ

これから書くことは、本当のことです。

実は、この一連の作業中、具体的にはheadに呪文を入れる前、はてなの管理画面でhttps配信を許可するボタンを押しました。

そしたら、画面いっぱいに「このサイトは保護されていません」みたいな文字が出たんです（マジ）。そして、『コバろぐ』を開くことができなかったんです（マジ）。

え！？混在コンテンツとか、保護されていませんとか、アドレスバーに表示されるだけちゃうん！？こんなになるなら話は別やで！？やらなあかんやん！！！

ぼくのPC環境で今の段階で何でそうなったのかはハッキリわかりませんが、今後、読もうと思ったら画面いっぱいに「危険な可能性が！」って書かれたりポップアップで「保護されてないけどマジで行くの？」とか出たら、それでもドキドキしながら読みに行くようなやつはいないでしょう。

つまり、SSL化（https化）してなかったらPV激減したりするのかも知れません…。

信じるか信じないかはあなた次第ですが！

最後に

まぁ、はてなブログで長くやってればやってるほど大変なのは間違いないでしょう。でも、作業自体はめんどくさくてもそんなに複雑ではないので、ひとつひとつ丁寧に潰していけば大丈夫だと思います。

それではまだ対応してないみなさん、頑張ってください。

WEB+DB PRESS Vol.100
posted with ヨメレバ
河原 一哉,白土 慧,菊田 洸,西鳥羽 二郎,柄沢 聡太郎,大谷 勇毅,新井 啓太,HANADA Yoshihito,増田 謙一,池上 達也,木下 祐実,藤原 大,長野 雅広,樫田 光,縣 俊貴,大川 徳之,栗林 健太郎,小飼 弾,庄司 嘉織,鈴木 勇介,高橋 征義,田中 哲,徳永 拓之,中嶋 謙互,中島 拓,西尾 泰和,西田 圭介,羽生 章洋,藤本 真樹,外村 和仁,まつもとゆきひろ,松本 亮介,ミック,三宅 陽一郎,森田 創,山本 陽平,吉羽 龍太郎,牧 大輔,石垣 憲一,平原 正裕,ひげぽん 技術評論社 2017-08-24
Amazonで探す
楽天ブックスで探す
Â