Xserver（エックスサーバー）でサイトをhttps化（常時SSL化）する方法です。
国内で大人気のXserverは「無料独自SSL」というサービスを提供しており、これを使うことで、誰でも“無料・無期限”でサイトをhttps化することが出来ます。
https化は今や個人ブログでも当たり前の時代となってきており、SEOにも影響を与える重要な内容ですのでしっかりと対応しておきましょう！
更新作業もXserverが行ってくれるので１度設定しておけばずっと使えます！
この記事の目次
Xserverでサイトをhttps（常時SSL化）する
先日、XserverにWordpressを手動インストールしたのですが、初期状態だとサイトのURLがhttpsになっておらず、ブラウザに「保護されていない通信」という警告が出ていましたので対応しました。
Chromeでhttp://～にアクセスした様子
httpsやSSLについて解説すると長くなるので、この記事では詳しくは触れませんが、今や個人情報の入力欄が存在しない個人ブログであってもhttps化は推奨されており、SEOを考えれば必須の作業となります。
ひと昔前まではSSL証明書の発行、更新にお金がかかりましたが、今は無料でSSL通信に対応してくれるサーバー会社が増えてきているため、初心者でも簡単にhttps化することが可能な時代となりました。
Xserverでは、サーバー管理画面からドメインごとに「無料独自SSL」というサービスを申し込むことで簡単にサイトをSSL通信に対応させることが出来ます。
ポイント
SSLには認証レベルがあり、今回使用する「無料独自SSL」の認証レベルは一番低いものとなりますが、個人ブログの場合はこのSSLで十分です。
外部リンク
【参考：Xserverで使用できる独自SSLについて】
独自SSLについて | レンタルサーバーならエックスサーバー
「http://」→「https://」に向けて、必要な作業の流れは以下です。
- 該当ドメインの無料独自SSLを申し込む
- SSL設定が反映されるまで待つ（数分～１時間）
- CMS（Wordpress等）で設定を変更する
- .htaccessでhttpsのリダイレクト設定を行う
- 必要ならサイトの内部リンクURLをhttpsに書き換える
詳しい手順は画像付きで公式サイト（↓）にもあります。
この記事では、より簡単にポイントだけ解説したいと思います。
では早速やってみましょう！
手順１．Xserverで無料独自SSLを申し込む
サイトのhttps化はサーバーの契約後、ネームサーバーの設定が済んで無事にサイトが表示されるようになったところで始めます。
上記リンク（どちらでもOK）からXserverにログインします。
契約サーバーのサーバー管理を開く
無料独自SSLを申し込みたいサーバーの「サーバー管理」に進みます。
サーバーパネルからSSL設定に進む
サーバーパネルが開いたらドメインの所にある「SSL設定」に進みます。
ドメイン名を選択する
続いてドメイン名を選択します。
ポイント
xxx.xsrv.jpではなく、自分のドメイン名の方の「選択する」に進みましょう。
独自SSL設定追加タブから確認画面へ進む
SSL設定画面が開くと「SSL設定一覧」というタブにいるはずです。
既存の設定は無いはずなので、タブを「独自SSL設定追加」に切り替えます。
ドメインとサイトURLを確認したら「確認画面へ進む」をクリックします。
ポイント
ここで「CSR情報(SSL証明書申請情報)を入力する」という項目にチェックを入れると、SSL証明書の内容を入力できますが、ここは特に入力しなくてOK！
そのまま次の画面に進みましょう。
サイトを確認して「追加する」を押す
設定対象ドメインが自分のサイトのドメイン名になっているか確認したら、そのまま「追加する」をクリックしましょう。
Xserver側での無料独自SSLの申し込みはこれで完了です。
ただし、SSLの設定が完了するまでには少し時間がかかるので待ちましょう。
-
- 反映待ち時の画面
-
- 反映完了後の画面
設定が済むまでは「SSL設定一覧」タブにて「反映待ち」と表示されます。
この「反映待ち」が消えれば設定完了です。
ポイント
「反映待ち」はだいたい10分も待てば消えると思いますが、最大で１時間ほどかかることもあるようです。
数分ごとにページを更新して確認しましょう。
Xserverで行う作業は以上です。
これでhttps化に必要なSSL証明書等の準備が整いました。
サイトの常時SSL化に必要な作業について
Xserverで独自SSLの設定を済ませただけでは、httpsを使用する準備ができただけですので、サイトをhttps化（常時SSL化）するためには、続いてCMSやサーバー側での設定変更が必要になります。
具体的にはサーバー上の「.htaccess」というファイルでhttpsへのリダイレクト設定を行い、WordpressなどのCMSのURL設定をhttpsに変更するといった形です。
- .htaccess：http:へのアクセスを自動的にhttps:にリダイレクトする設定。
- CMS：今後サイト内で使用するURLをhttpsにするための設定。
今までhttp://で運営していた（記事を何個か書いている）場合は、内部リンクのURLがhttp://のままになっているのでこれをhttps://に変更する作業も必要となります。
なお、.htaccessとCSMの設定変更については公式サイトにも案内があります。
外部リンク
【参考：Xserverでの常時SSL化について】
Webサイトの常時SSL化 | レンタルサーバーならエックスサーバー
それでは順番にやり方を見ていきましょう！
手順２．CMSのURL設定をhttpsに変更する
では早速CMSのURL設定を「http://」から「https://」に変更しましょう！
この記事では人気CSMであるWordpressを使って解説します。
やり方は簡単でURL設定欄のhttp://に"s"を追加するだけです。
WP管理画面左メニュー＞設定＞一般
Wordpressの管理画面にログイン後、メニューから設定＞一般に進みます。
-
- URL変更前（http://）
-
- URL変更後（https://）
あとは「Wordpressアドレス(URL)」と「サイトアドレス(URL)」の欄にあるURLを「http://~」から「https://~」に変更するだけでOK！
ポイント
ここでURLを間違えると結構ややこしくなってしましますので、最終確認は慎重に行いましょう！
Wordpressの場合は変更を保存すると一度ログアウトします。
ログアウトしたらサイトにhttps://でアクセスしてみましょう！
httpsの場合はChromeで鍵マークが出る
Xserver側のSSL設定が無事に済んでいればhttps化できているはずです。
CMS側の設定をhttp→httpsに変更したら、続いて.htaccessを編集してリダイレクトの設定を行います。
手順３．.htaccessでhttpsに自動リダイレクトを設定する
以上の設定で一応https化は完了しているのですが、このままの状態だと「http://」でも「https://」でもアクセスできる状態になっています。
そこで、サーバー上の「.htaccess」というファイルにコードを追記することで、http://にアクセスがあった場合に自動的にhttps://にリダイレクト（転送）する設定を行います。
ポイント
一応WordPressやブラウザの機能で、httpsが使えるならhttp接続をhttps接続に切り替えて接続する...という仕組みもあるのですが.htaccessにもリダイレクトの記述をしておくのが定石です。
今までhttpで運営していたサイトを途中でhttpsに変更した場合は、特にリダイレクトの設定が大切になってきます。
.htaccessにコードを追記する
では早速コードを追記しましょう。
編集する「.htaccess」の場所はXserverだと以下です。（共有サーバーで確認）
サーバールート/ドメイン名/public_html/.htaccess
Xserverではサーバーパネル内に「.htaccess編集」という専用のツールがあります。
サーバーパネルから.htaccessを編集可能
サーバーパネルから「.htaccess編集」を使っても良いですし、「ファイル管理」からファイルマネージャーを使っても編集できます。
/public_html内の.htaccessを編集する
FTPを使う場合は上の画像を参考にどうぞ。
以下のコードを「.htaccess」の先頭に追記（コピペでOK）しましょう。
RewriteEngine On
RewriteCond %{HTTPS} !on
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]これでhttp://へのアクセスがhttps://に自動転送されるようになります。
参考
Xserverは「mod_rewrite」が使えるという前提なので、上記のコード内に<IfModule mod_rewrite.c>と</IfModule>は書いていません。（あってもOK）
コードは先頭に書くのが無難
一応コードを書く場所はどこでも機能するはずですが、「# BEGIN WordPress」から「# END WordPress」の間には書かないように注意しましょう。間に書いた場合、後からWordPressに勝手に書き換えられてコードが消えてしまう可能性があります。
新規サイトの場合はこれにてhttps化（常時SSL化）作業は終了です。
サイトの運用途中でhttps化に挑んでいる方はもう少し頑張りましょう！
(手順４．)内部のリンクURLをhttpsに書換える
手順４はサイトの一部でhttp://での読み込みが残っている場合に必要な作業です。
httpの状態でサイトを運営していた（記事を書いていた）人は、記事内に使用している画像などの内部URLがhttp://のままになっていることがほとんどです。
このような場合はhttps://であってもWebページのリソースの中にhttp://で読み込んでいるファイルがある為、完全なSSL通信にはならないので対処が必要になります。
http://の部分に手動でsを追加していっても良いのですが、Wordpressの場合は文字列の置換プラグインを使うと楽です。
プラグインでhttp部分をhttpsに一括置換するのが楽
「Better Search Replace」というプラグインを使えば簡単にサイト内のhttp部分をhttpsに一括置換することができ、オススメです。
関連記事
【プラグインについてはコチラ】
置換プラグイン「Better Search Replace」の使い方。Search Regexの代替にもお勧め！
以前まではこの置換作業と言えば「Search Regex」というプラグインが有名でしたが、現在の環境では使えない事があります。
ポイント
最終的にはブラウザのデベロッパーツール（開発者ツール）などを使ってhttp://で読み込まれているファイルがないか確認しましょう。
場合によってはヘッダー部分の読み込みURLも変更する必要があります。
まとめ
以上、Xserverでサイトをhttps化（常時SSL化）する方法でした。
既に公式サイトに丁寧な案内があるので、この記事は備忘録でもあります…
確認していないのですが、Xserverの「Wordpress簡単インストール」を使用した場合は始めからhttps化できているかもしれません…
現在は人気のサーバー会社ならほとんどのサーバー会社で誰でも簡単にhttps化することが出来るので良い時代になりました！
僕はまだ独自SSLの無料化が浸透していない時代にSSL証明書を自分で発行したことがあるのですが、発行・更新・持ち込み移管などなど…大変だった記憶しかないですｗ
ではではこのへんで・ｗ・
