スポンサーリンク

こんにちはヤーマンです。最近のウェブサイトはほとんどがhttpsで始まるURLで運営されていますが、当サイトはいまだにhttpの状態なので今回はssl化に挑戦しました。

保護されていない通信

ブラウザのアドレスバーの横に保護されていない通信と表示されているサイトはhttpのサイトです。これは精神衛生上よくないので保護された通信の状態にするのが今回のSSL化になります。

保護されていないとどうなるのか

保護されていないというのは暗号化されていないという状態なので悪意のあるユーザーから攻撃を受けやすくなってしまいます。
攻撃というのはクレジットカードの情報や住所や氏名などの個人情報を読み取られることをさします。

保護されていないサイトは今後警告が表示される様になります。

ユーザーは警告が出たサイトにわざわざ訪問したくありませんので、運営者側もアクセス数減少というデメリットを被ることになります。

設定手順

これから私が設定した手順を紹介します。

環境

以上の環境で設定した手順になります。

エックスサーバーは標準機能として独自SSLが無料なので今回かかった費用は0円でした。

エックスサーバーで独自SSLを設定する

設定完了まで1時間程度の時間がかかるため一番最初にやっておきます。

エックスサーバーの管理画面にログインしておきます。

ログインできたらサーバーパネルに入ります。

次にドメイン設定の項目のSSL設定の項目を選びます。設定したいドメインを選びSSL設定画面に入ります。

独自SSLのタブを選びます。

選んだドメインの設定がでているのでこのまま確定を押します。

エックスサーバーの設定は一旦ここで終了です。設定完了まで1時間かかるのでコーヒーブレイクでもして時間を潰しましょう。

ワードプレス側の設定をする

ワードプレスにログインして準備を進めていきます。httpsの方でもアクセスできるかを確認するためにアドレスバーにhttpsでURLを打ち込んでみてください。アクセスできればおそらくエックスサーバー側での設定が完了していると思うのでhttpsにてログインします。

サイトURLを変更する

設定項目から一般を選んで開きます。

URLがhttpで始まっているのでhttpsに変更します。

変更するともう一度ログインさせられます。

この時点ではhttpsなのに保護されていない状態つまり混在コンテンツ状態です。httpとhttpsが混ざっています。

Search Regex

Search Regexをインストールしておきます。ワードプレスのプラグインを新規追加で検索すると出てきます。

インストールして有効化しておきます。

Search Regexとは一括置換ツールです。httpと打ち込まれている部分を検索してhttpsに置き換えるために使います。

スポンサーリンク

Search Regexはツールタブに入っています。

  • Search patternにhttpのURL
  • Replace patternにhttpsのURL

打ち込んでSearchをクリックします。

するとhttpで始まる投稿ページや固定ページの情報が出てきます。

問題なければ「Replace & Save」をクリックします。

サイトを確認してみましょう。

まだ変更されていません。

キャッシュをクリアする

私の場合はキャッシュを有効にしていたので、以前読み込んだ状態を表示しているため古い情報が表示されていました。

キャッシュを無効にして再度読み込みます。

まだ混在している様です。

賢威の設定を確認する

Search Regexでは投稿などのページのURLを変更しましたが、head内のタグを変更した訳では無いのでヘッダー画像のURLがまだhttpのままです。

ロゴ画像がhttpでしたのでhttpsと打ち替えます。

ウィジェットの中も変更されていないのでサイドバーなどに画像をたくさん使っている方などは確認しましょう。コードが見辛い場合はcommand+Fで「http」検索を検索します。

再度確認します。

保護された通信と表示されるようになりました。一応サイトを隅々までチェックしましょう。

htaccessを設定する

httpで訪れた訪問者を安全なhttpsに転送(リダイレクト)する設定をします。

サーバーパネルからホームページという項目の中にhtaccessという項目があります。

<IfModule mod_rewrite.c>
RewriteEngine on
RewriteCond %{HTTPS} !=on [NC]
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]
</IfModule>

上記のコードをhtaccessに追加して更新します。

http://tsurara-sokuho.comでアクセスすると勝手にhttps://tsurara-sokuho.com/に転送される様になりました。

失敗すると500エラーが出てサイト表示されなくなったりします。一回間違えてしまってエラーが発生した時はこの世の終わりかと思いましたが、再編集したところ問題なかったので焦らなくても大丈夫です。

念のためバックアップは取っておきましょう。

以上の手順で終了です。

まとめ

設定と検証に1時間以上はかかるので時間に余裕がある時に設定しましょう。検証をするのであればGoogle Chromeをおすすめします。