ブログ「小粋空間」をSSL化しました: 小粋空間

ナビゲーションをスキップする

Top ＞お知らせ＞ blog ＞ブログ「小粋空間」をSSL化しました

ブログ「小粋空間」をSSL化しました

Posted at May 1,2021 3:55 PM
Tag：[SSL]

遅ればせながら、ブログ「小粋空間」をSSL化（http→https）しました。

当ブログはMTを利用しているので、以下、SSL化で作業した内容を残しておきます。

SSL証明書の取得・設定方法は別エントリーします。

１．方針

SSL化でどの部分からhttpをhttpsに変更すればいいか？という問題ですが、基本的な動作として、

httpでアクセスして、中にあるhttpsの画像はOK
httpsでアクセスして、中にあるhttpの画像はNG

ということで、最初にページ内のhttpをhttpsに変更し、一番最後に.htaccessでのリダイレクトをすることにしました。

２．サイトURLの変更

MT管理画面の「設定」→「全般」の「サイトURL」を「http://」から「https://」に変更。これでサイト内記事へのリンクはすべて変更。

サイトURL

MT6までの場合は、ウェブサイトの「設定」→「全般」→「ウェブサイトURL」で変更（ブログの「ブログURL」ではプロトコルを変更できないので注意）。

３．記事内のimg要素・a要素の変更

記事に含まれる、a要素およびimg要素等に含まれるサイト内のURL、

https://www.koikikukan.com/

を

https://www.koikikukan.com/

に変更。

プロトコルを表記しない、

//www.koikikukan.com/

に変更する案も考えましたが、調べたところ、Googleで非推奨ということを知り、httpsを明記。

参考：Google HTML/CSS Style Guide（）

Always use HTTPS (https:) for images and other media files, style sheets, and scripts, unless the respective files are not available over HTTPS.
 
<!-- Not recommended: omits the protocol -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
 
<!-- Not recommended: uses HTTP -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
<!-- Recommended -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>

４．canonicalの変更

link要素の"rel=canonical"は、インデックスして欲しいURLを検索エンジンに伝える役割があるようです。

変更前

<link rel="canonical" href="https://www.koikikukan.com/" />

変更後

<link rel="canonical" href="https://www.koikikukan.com/" />

実際はMTタグで表現しているので自然体で変更。

５．jsファイルのURL変更

ここまでの変更でhttpsでアクセスすると、jQueryで埋め込んでいた折りたたみが動作しなくなったので、Chromeのコンソール機能でエラーを確認し、該当のjsファイルに直書きしているURLのhttp://をhttps://に変更。

例えば、

変更前

var calendar_url = "https://www.koikikukan.com/";

変更後

var calendar_url = "https://www.koikikukan.com/";

６．その他のURL

テンプレートファイルのアドセンスに含まれる"http://"を"https://"に変更。

Amazonアソシエイトのリンクはhttpsに変更するとエラーになるため放置。

７．サイトマップの追加

Google Search Consoleに読み込ませるサイトマップ（sitemap.xml）を出力。

厳密には、"http://"で出力されているサイトマップはそのままにして、インデックステンプレートで生成するサイトマップのファイル名を、別のファイル名（sitemap2.xml等）に変更して再構築。

Google Search Consoleは、"http//www.koikikukan.com/"で登録していプロパティは、https用に移行できないため、"https//www.koikikukan.com/"のプロパティを新たに追加し、そこに前述のサイトマップを指定します。

８．再構築

ここまでの作業で個別に"https://"指定でブログのトップページや記事ページが概ね正常に表示されることを確認し。すべてのページを再構築。

この時点では、外部から"http://"でアクセスされても表示が崩れることはありません。

ただし、アクセスされたページから、さらに他のサイト内ページに遷移すると、"https"//でのアクセスになります。

９．.htaccessでのリダイレクト

最後にHTTPからHTTPSにリダイレクトするために、.htaccessに下記のディレクティブを追加。

RewriteEngine on
RewriteCond %{HTTPS} off
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]

追加したあと、ブラウザから"http://"でアクセスして、"https://"にリダイレクトされることを確認。

１０．おまけ

HTML要素のxmlnsをprefixに変更しました。

変更前

<html lang="ja"
      xmlns:og="http://ogp.me/ns#"
      xmlns:fb="http://www.facebook.com/2008/fbml">

変更後

<html lang="ja"
      prefix="og: http://ogp.me/ns#"
      prefix="fb: https://ogp.me/ns/fb#"">

１１．参考サイト

参考サイトは下記です。ありがとうございました。

Posted by yujiro このページの先頭に戻る

小粋空間 - a cheap joke and a play on words site