エックスサーバーで独自SSLを導入してみよう
2016/09/23
おすすめ記事個人開発のWebアプリがツイッター世界トレンド1位になったけどいろいろ辛かった話 #チョコボックス裏話 | vdeep
こんにちは、okutani(@okutani_t)です。レンタルサーバーのエックスサーバーでは、お手軽に独自SSLを利用することができます。
個人情報やクレジットカード情報などを扱うサイトでは、導入必須なSSL。セキュアなデータを安全にやりとりするサイトでは、まず間違いなくSSLが導入されているかと思います。
SSLをかるーく説明すると、よくURLで見かける「https://」を使って、サイトのセキュリティを高めるといったものです（とってもざっくりな説明ですが）。
エックスサーバーではこのSSLを安価で導入することができます。いくつかプランがあるのですが、今回はサイトシールなしで低価格から使える「CoreSSL + SNI SSL」を利用していきます。
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」です。
参考独自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サーバーパネル – ログイン | レンタルサーバー 高速・高機能・高安定性の【エックスサーバー】
「メールアカウント設定」を選択。
SSLを導入したいドメインを選択。
「メールアカウント追加タブ」から次のようにメール設定をおこないます。メールアカウントは「admin」で作成し、パスワードを入力。それ以外はデフォルトの設定でOKです。
「メールアカウントの作成（確定）」を押して完了。
これでSSL申し込み用のメールアドレスを作成できました。
独自SSLを申し込む
では、独自SSLを申し込んでいきましょう。インフォパネルへアクセス。
LINKインフォパネル – ログイン | レンタルサーバー 高速・高機能・高安定性の【エックスサーバー】
「追加のお申し込み」をクリック。
利用規約・個人情報の取り扱いを読んで「同意する」をクリック。
「SSLの新規取得」の追加のお申し込みを選択。
SSLブランド、SSLプラン、ご契約期間を選択。今回は「CoreSSL」「SNI SSL」「3年」を選びました。
続いて、対象サーバーID、コモンネーム（ドメイン）を選択。ドメインは「www付き」のものを選択すると、「www付き＆www無し」両方がHTTPS化されます。
よく分からない方はとりあえずwww付きを選んでおけばOKです。「お申し込み内容の確認・料金のお支払い」を選択。
支払い方法を選択します。銀行振込、クレジットカード、コンビニエンスストア、ペイジーが選べます。今回は「クレジットカード」を選択して支払いました。
これで独自SSLの申し込みが完了しました。
エックスサーバーに登録してあるアドレスに確認メールが飛ぶので確認しておきましょう。
次に、申し込んだ独自SSLを利用できるように、証明書の設定をおこないます。
インフォパネルトップページから、ご契約一覧内の「SSL証明書」→「取得申請」をクリック。
次のように申請します。対象サーバーID、コモンネームを選択。CSR情報には例にならって入力していきます。
私は自分の住んでる場所＆個人の申し込みの情報として、「JP」「Tokyo」「Nerima-ku」「Personal」「None」とそれぞれ入力しました。
「SSL登録者情報入力へ進む」を選択し、次に進みます。
SSLご登録担当者情報を入力していきます。組織名は無ければサイトの名前とかでOKかと思います。住所は私の場合「example, 5-chome 00-0-banchi」みたいな形で入れました。
次に認証方法を決めます。先ほど認証用メールアドレスを作成したので「DNS認証を利用するのチェックを外す」「認証用メールアドレスを選択」をおこなって、「SSL新規取得申請をおこなう（確認）」をクリック。
※下記画像ではwww付きを選択していますが、作成したadmin付きメールはwww無しなので間違えてしまいました。みなさんは間違えないように。訂正はインフォパネルトップページの「承認メール再送」からできましたのでご参考に
「SSL新規取得申請をおこなう（確定）」を押せば登録完了です。
認証用メールアドレス宛に承認メールが届いています。WEBメールからログインしましょう。
LINKWEBメール – ログイン | レンタルサーバー 高速・高機能・高安定性の【エックスサーバー】
ウェブメールを選択し、届いたメールを開きます。
メールの中の「validation code」をコピーし、その上のURLへアクセス。
validation codeを入力、「Next」クリック。
ここまでの作業が完了したら、SSL発行元において審査が始まります。
数日かかることもあるので、まったり気長に待ちましょう。私の場合は数十分で来ました（早っ）。
次のメールが届けばSSLを利用できるようになります。
これでHTTPS化されたサイトを運用できますね！
まとめ
エックスサーバーのSSLを利用して、格安でかつかんたんにサイトをHTTPS化することができました。
また、サイトに埋め込まれた外部のjavascriptプラグインやCSSや画像などは、httpsでないと画面に警告が出てしまうので、リンクをhttpからhttpsに適宜変更する必要があります。もしくは下記のような方法もあります。
LINKいい加減、<script src="http://.. と書くのはやめましょう · DQNEO起業日記
余談ですが、今回HTTPS化したドメインはEC-CUBE3というCMSで利用しています。次のように管理画面で設定しました。
導入したEC-CUBE3のサイトは、僕が運営するデザインTシャツのネットショップ（https://herisson-quatre.com）です。参考にしてくださいm(_ _)m
一般のサイトはもちろん、EC-CUBE、WordPressなどのCMSでもSSLは利用できるので、ぜひHTTPS化してサイトのセキュリティを高めてみてくださいね。お疲れ様でした。
Web開発のお仕事を募集しています
フリーランスのエンジニアとして、Webシステム開発のお仕事依頼を随時募集しています（現在の業務量によってお受けできない場合もあります）。
「Ruby on Rails」「JavaScript（jQuery, Reactなど）」「HTML + CSS」を用いたシステム開発、「Heroku」等を用いたサーバー構築・運用、「Git」や「GitHub」を利用したソーシャルコーディングなどに対応しています。
ご依頼を検討している方は、下記リンク本ブログからのお問い合わせ、もしくはokutaniのポートフォリオからご連絡ください。
LINKお問い合わせ
スポンサーリンク
