vdeep

*

vdeepはプログラミング、IT、Web技術、ライフハックの事などなどを管理人okutaniがつぶやくブログです。月間13万PV〜。

エックスサーバーで独自SSLを導入してみよう

      2016/09/23

LINEで送る
Pocket

xserver-ssl
こんにちは、okutani(@okutani_t)です。レンタルサーバーのエックスサーバーでは、お手軽に独自SSLを利用することができます。

個人情報やクレジットカード情報などを扱うサイトでは、導入必須なSSL。セキュアなデータを安全にやりとりするサイトでは、まず間違いなくSSLが導入されているかと思います。

SSLをかるーく説明すると、よくURLで見かける「https://」を使って、サイトのセキュリティを高めるといったものです(とってもざっくりな説明ですが)。

エックスサーバーではこのSSLを安価で導入することができます。いくつかプランがあるのですが、今回はサイトシールなしで低価格から使える「CoreSSL + SNI SSL」を利用していきます。

xserver-ssl2

3年間契約で1500円ってめちゃくちゃ安いですね(キャンペーン終了以降は2500円/3年とのこと)。これでサイトのセキュリティを高めることができるなんて。。素敵です。

サイトシールの詳しい説明はここでは割愛しますが、サイトシールは超かんたんにいうと「このサイトSSL導入してるけど、信頼できる機関から発行されてる証明書使ってるで!」というのが分かる画像をサイトに貼れるというものです。まぁ個人レベルではあまり気にしなくてOKです。

本記事では「SNI SSLってなに?」から「CoreSSLの契約」「サイトをHTTPS化する」までを紹介していきます。

※本記事では一般的に通じやすいSSLという言葉を使ってますが、正確にはTLSです。詳しく知りたい方は「SSL TLS 違い」などでぐぐってみてください

参考独自SSLのお申し込み – マニュアル | レンタルサーバー 高速・高機能・高安定性の【エックスサーバー】

スポンサーリンク

SNI SSLってなに?

「SNI SSL」について、先にかるく説明しておきます。

以前まではSSLを利用しようとすると、ひとつのIPアドレスに対してしかひとつのSSL証明書を設定することしかできませんでした。

レンタルサーバーでは他人と同じサーバーを共有して使うことが一般的ですよね。

なので、高いお金を払って専用のIPアドレスを用意するか、SSLを設定した特定のドメイン(エックスサーバーだとhttps://example-com.ssl-xserver.jp/などのことで、共有SSLとも呼ばれる)をみんなで使い回す、といった方法しかありませんでした。

この問題を解決したのが「SNI SSL」です。

xserver-ssl3

参考独自SSLのサービス拡張と改定 │ レンタルサーバー 高速・高機能・高安定性の【エックスサーバー】

SNIでは、「自分の所有している独自ドメインと同じ名前のSSL証明書を利用できる」といった特徴があります。

このしくみを利用することで、IPアドレスごとではなく、独自ドメインに対してSSL証明書を利用することができるため、めんどうな設定や追加料金無しで安価に利用できるってわけです。

ただ、一点問題があるとすると「古いブラウザに対応していない」ということです。

SNI SSLが対応しているブラウザ一覧は以下のとおりです。

  • Internet Explorer 7 以降(Windows Vista以降のみで、Windows XPではInternet Explorer 8でも非対応)
  • Mozilla Firefox 2.0 以降
  • Opera 8.0 (2005年) 以降 (設定でTLS 1.1を有効にする必要がある)
  • Opera Mobile 10.1 β 以降 (Android)
  • Google Chrome (Windows Vista以降。バージョン6でWindows XPに対応。Chrome 5.0.342.1でOS X 10.5.7 以降に対応)
  • Safari 3.0 以降 (Mac OS X 10.5.6 以降、Windows Vista以降、iOS 4.0以降)
  • Konqueror/KDE 4.7 以降
  • Android ブラウザ (Android 3.0 (Honeycomb) 以降)
  • Windows Phone 7
  • MicroB(英語版) (Maemo)

参考Server Name Indication – Wikipedia

個人のサイトレベルであれば「まったくと言っていいほど関係ない話」なので、ほとんどデメリットはないようなものなのですが、仕事なんかで「Windows XPでも見れるようにしろ」なんて言われると、SNI SSLは利用できません。

まぁ、仕事でもそういった心配は2016年1月にIE 8のサポートが切れた時点でほぼ無いようなものなのですが。。一部のレガシーなWebシステムを使ってる会社では「SNI SSLダメ!使えない!」なんてことがあるかもです。

セキュリティを高めるためにSSLを導入しているのに、マイクロソフトがもうサポートしていない(セキュリティ的にやばい)Windows XPや古いIEに対応するとか本末転倒なので、安価で導入しやすいSNI SSLを使わない手はないです。

あと、「うちのおばあちゃんが私のサイト見れないって。。どうしよ。。」なんてことがあったら冷静にWindows10にアップグレードしてあげましょう。そうしましょう。

※2016/09/23追記: 意外とAndroid 2.Xを使っているユーザーはちらほらいるため、仕事などで使う場合は注意が必要でした。実際に、私が仕事で携わったサイトでSNI SSLの利用をやめたケースがあります

ではでは、基本的なSSLの知識がついたところで、実際にエックスサーバーで独自SSLを設定していきましょう。

エックスサーバーで独自SSLを取得しよう

エックスサーバーの独自SSL申込方法を見ていきましょう。

なお、エックスサーバー自体とまだ契約していない方は「エックスサーバー契約手順まとめ | vdeep」を先に参考にして、契約を済ませておきましょう。こちら「ムームードメインの独自ドメインをエックスサーバーで使う | vdeep」も参考にしておくとより良いです。

admin@example.comのような形のメールアドレスが申し込み時に必要なので、まずは「admin付きのメールアドレス」を作成していきます。

独自SSL専用のメールアドレスを取得する

サーバーパネルへアクセス。

LINKサーバーパネル – ログイン | レンタルサーバー 高速・高機能・高安定性の【エックスサーバー】

xserver-ssl4

「メールアカウント設定」を選択。

xserver-ssl5

SSLを導入したいドメインを選択。

xserver-ssl6

「メールアカウント追加タブ」から次のようにメール設定をおこないます。メールアカウントは「admin」で作成し、パスワードを入力。それ以外はデフォルトの設定でOKです。

xserver-ssl7

「メールアカウントの作成(確定)」を押して完了。

これでSSL申し込み用のメールアドレスを作成できました。

独自SSLを申し込む

では、独自SSLを申し込んでいきましょう。インフォパネルへアクセス。

LINKインフォパネル – ログイン | レンタルサーバー 高速・高機能・高安定性の【エックスサーバー】

xserver-ssl8

「追加のお申し込み」をクリック。

xserver-ssl9

利用規約・個人情報の取り扱いを読んで「同意する」をクリック。

xserver-ssl10

「SSLの新規取得」の追加のお申し込みを選択。

xserver-ssl11

SSLブランド、SSLプラン、ご契約期間を選択。今回は「CoreSSL」「SNI SSL」「3年」を選びました。

xserver-ssl12

続いて、対象サーバーID、コモンネーム(ドメイン)を選択。ドメインは「www付き」のものを選択すると、「www付き&www無し」両方がHTTPS化されます。

よく分からない方はとりあえずwww付きを選んでおけばOKです。「お申し込み内容の確認・料金のお支払い」を選択。

xserver-ssl13

支払い方法を選択します。銀行振込、クレジットカード、コンビニエンスストア、ペイジーが選べます。今回は「クレジットカード」を選択して支払いました。

xserver-ssl14

これで独自SSLの申し込みが完了しました。

エックスサーバーに登録してあるアドレスに確認メールが飛ぶので確認しておきましょう。

次に、申し込んだ独自SSLを利用できるように、証明書の設定をおこないます。

インフォパネルトップページから、ご契約一覧内の「SSL証明書」→「取得申請」をクリック。

xserver-ssl15

次のように申請します。対象サーバーID、コモンネームを選択。CSR情報には例にならって入力していきます。

私は自分の住んでる場所&個人の申し込みの情報として、「JP」「Tokyo」「Nerima-ku」「Personal」「None」とそれぞれ入力しました。

xserver-ssl16

「SSL登録者情報入力へ進む」を選択し、次に進みます。

SSLご登録担当者情報を入力していきます。組織名は無ければサイトの名前とかでOKかと思います。住所は私の場合「example, 5-chome 00-0-banchi」みたいな形で入れました。

xserver-ssl17

次に認証方法を決めます。先ほど認証用メールアドレスを作成したので「DNS認証を利用するのチェックを外す」「認証用メールアドレスを選択」をおこなって、「SSL新規取得申請をおこなう(確認)」をクリック。

※下記画像ではwww付きを選択していますが、作成したadmin付きメールはwww無しなので間違えてしまいました。みなさんは間違えないように。訂正はインフォパネルトップページの「承認メール再送」からできましたのでご参考に

xserver-ssl18

「SSL新規取得申請をおこなう(確定)」を押せば登録完了です。

xserver-ssl19

認証用メールアドレス宛に承認メールが届いています。WEBメールからログインしましょう。

LINKWEBメール – ログイン | レンタルサーバー 高速・高機能・高安定性の【エックスサーバー】

xserver-ssl20

ウェブメールを選択し、届いたメールを開きます。

メールの中の「validation code」をコピーし、その上のURLへアクセス。

xserver-ssl21

validation codeを入力、「Next」クリック。

xserver-ssl22

ここまでの作業が完了したら、SSL発行元において審査が始まります。

数日かかることもあるので、まったり気長に待ちましょう。私の場合は数十分で来ました(早っ)。

次のメールが届けばSSLを利用できるようになります。

xserver-ssl23

これでHTTPS化されたサイトを運用できますね!

まとめ

エックスサーバーのSSLを利用して、格安でかつかんたんにサイトをHTTPS化することができました。

また、サイトに埋め込まれた外部のjavascriptプラグインやCSSや画像などは、httpsでないと画面に警告が出てしまうので、リンクをhttpからhttpsに適宜変更する必要があります。もしくは下記のような方法もあります。

LINKいい加減、<script src="http://.. と書くのはやめましょう · DQNEO起業日記

余談ですが、今回HTTPS化したドメインはEC-CUBE3というCMSで利用しています。次のように管理画面で設定しました。

xserver-ssl24

導入したEC-CUBE3のサイトは、僕が運営するデザインTシャツのネットショップ(https://herisson-quatre.com)です。参考にしてくださいm(_ _)m

一般のサイトはもちろん、EC-CUBE、WordPressなどのCMSでもSSLは利用できるので、ぜひHTTPS化してサイトのセキュリティを高めてみてくださいね。お疲れ様でした。

この記事が気に入ったら
いいね ! しよう

Twitter で
LINEで送る
Pocket

okutani (@okutani_t) のヒトコト
ちょっと申請手順がややこしかったですが、申請するだけで勝手にHTTPSが利用できて便利でした。年間500円程度でSSLを利用できるなんて良い世の中になりましたねぇ。

 - エックスサーバー

スポンサーリンク

PC用AdSense

PC用AdSense

Share
  • このエントリーをはてなブックマークに追加

  こちらの関連記事もどうぞ

エックスサーバー契約手順まとめ

こんにちは、okutani(@okutani_t)です。今まで当ブログvdeep …

EC-CUBE3をエックスサーバーに導入する手順まとめ

こんにちは、okutani(@okutani_t)です。本記事では、EC-CUB …

エックスサーバーにSSHで接続してみよう!

こんにちは、okutani(@okutani_t)です。本記事ではエックスサーバ …

エックスサーバーにGitを導入する手順

こんにちは、okutani(@okutani_t)です。本記事ではエックスサーバ …

『ムームードメイン + エックスサーバー』で独自ドメインを利用する方法

こんにちは、okutani(@okutani_t)です。今回はムームードメインで …

vdeepのトップページへ戻る画像です。風船の形をした島を女の子が掴んでいます。