サイトのSSL化は今や当たり前となりましたが、無料で独自SSLを使用するならエックスサーバーがおすすめです。本記事では、エックスサーバーを使ったSSL化の手順・流れを簡単にまとめています。
無料独自SSLを設定しよう
まずは、「エックスサーバー
」にアクセスし、ログインから「サーバーパネル」をクリックします。
次にサーバーパネルにログインしてください。
サーバーパネルにログインしたら、「SSL設定」をクリックします。
ドメイン選択画面が表示されるので、SSL設定したいドメイン名を探して「選択する」をクリック。
SSL設定の画面が表示されます。
このとき、SSL設定一覧に既に表示されていたら特に設定をおこなう必要はありません。
今回は、”現在、独自SSL設定はありません。”と表示されているので、SSL設定の追加を行っていきます。
独自SSL設定追加のタブをクリックすると、下図のような画面に切り替わりますので、手順を参考に確認画面へ進むをクリックします。
- 独自SSL設定追加タブをクリック
- サイトのURLを選択or確認
- 確認画面へ進むをクリック
確認画面へ進み、問題なければ「追加する」をクリックします。
追加すると、以下のような文言が少しの間表示されます。
（ネット環境によって表示される時間が異なるかと思います）
SSL新規取得申請中です。しばらくお待ち下さい。
※処理には数分程度かかる場合があります。
しばらくして、独自SSL設定を追加しました、と下図のように表示されれば完了です。
戻るボタンをクリックします。
SSL設定一覧に戻ると、下図のように反映待ちになっているかと思います。
この状態でサイトにアクセスしても、以下のようなメッセージが表示されてしまいます。
無効なURLです。
プログラム設定の反映待ちである可能性があります。
しばらく時間をおいて再度アクセスをお試しください。
無事に反映が終わると、下図のように通常のページが表示されます。
※以下の参考イメージは、エックスサーバーデフォルトのページです。
独自SSL設定後にやること／WordPress編
独自SSL（https）設定をした後は、サイトに手を加える必要があります。
今回は、サイトやブログを作成する際に人気の「WordPress」を使用する場合を例にお話します。
独自SSLを設定したタイミングによって、サイトに手を加える内容が異なります。
以下では、パターンごとに最低限やっておきたいことを解説します。
サイトを運営する前にSSL設定をしたパターン
サイトを作成する前や運営前にSSL（https）設定をした場合、やることはシンプルです。
一般設定のURLを変える
WordPressインストール後、管理画面（ダッシュボード）にログインし、左メニューの設定から「一般」をクリックします。
すると、一般設定の画面が表示されると思うので、「WordPressアドレス」と「サイトアドレス」にあるURLを「http→https」に編集し、変更を保存をクリックします。
- http→httpsにする
- http→httpsにする
- 編集したら「変更を保存」をクリック
再び、ログインし管理画面（ダッシュボード）に入れることを確認しておきましょう。
httpからhttpsへリダイレクト設定
SSL設定すると、サイトのURLは以前の「http」から「https」変更となるわけですが、実は以前のhttpから始まるURLからでもアクセスができてしまいます。
この現象を回避するには、リダイレクトという方法でhttpから始まるURLにアクセスしても、httpsから始まるURLに転送されるように設定をおこないます。
設定をおこなえば、以下のようにhttpから始まるURLにアクセスしても、httpsにリダイレクトされます。
【１】サーバーパネルにログイン
まず、エックスサーバーのサーバーパネルにログインします。
【２】.htaccess編集
「.htaccess編集」をクリックします。
ドメイン一覧が表示されるかと思いますので、該当のドメインの「選択する」をクリックします。
.htaccess編集画面に遷移するので、「.htaccess編集」のタブをクリックします。
下図の赤枠エリア部分の編集をおこなっていきます。
※下図の内容と文字等が異なっていても問題ありません。環境やWordPress等のバージョンによっても表記が変わる可能性があります。
編集内容ですが、先頭に以下のコードをコピーし貼り付けます。
▼追記コード
<IfModule mod_rewrite.c>
RewriteCond %{HTTPS} off
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R,L]
</IfModule>
下図は、貼り付けた後の参考イメージです。
編集できたら、「確認画面へ進む」をクリック。
確認画面が表示されるので、問題なければ「実行する」をクリックして、編集を完了させます。
もしもエラーが出てしまったら
サイトを確認し、もしエラーが出てしまった場合は、以下の手順でもう一度試して見てください。
- バックアップしたデータ（初めから記述されていた.htaccessの内容）に戻す
- 再度、上記の追記コードをコピペする
既にサイトを運営している途中でSSL設定をしたパターン
SSL（https）設定をする前から、サイトを運営している場合（既存のサイトに途中からSSL設定を施した等）、上記で説明した「一般設定のURLを変える」と「httpからhttpsへリダイレクト設定」に加え、既存ページに残っているhttpから始まる画像やリンクのパスを「https」に変更する必要があります。
これを「https～」に変更する作業を行う必要があるんです。
変更する数が少ない場合は一つずつでも構いませんし、数が多い場合は一括置換などで作業しても良いでしょう。
バックアップを取りつつ行えばそれほど難しいことではありません。
保護されている状態か確認しよう
SSL設定を完了後は、サイトを表示した状態でアドレスバーを確認してみましょう。
以下のように、鍵マークが表示されていればOKです。
逆に、以下のように「保護されていない通信」と表示されている場合は、うまく設定できていない場合があるので、上記でお話したパターンを確認しながら改善してみてください。
※ブラウザのバージョンや環境等によっては、アドレスバーの表記が異なる場合がございます。
まとめ
今回は「無料独自SSL（https）を設定するための手順（エックスサーバー編）」をテーマにお話させて頂きました。
SSL設定をすることで、セキュリティやプライバシー保護が高まる一方、注意しなければいけないのが「混在するコンテンツ」の存在です。
混在するコンテンツとは、SSL設定（https）したのにも関わらず、httpという表記がページに残ってしまっている状態を指します。
混在するコンテンツが残っていると、警告が表示されたり、ブラウザのバージョンによっては画像の読み込みに失敗し、表示されない等の可能性もあります。
独自SSL設定をした後は、できる限り早く混在するコンテンツを無くすように対策を施しましょう。
