まずはお気軽にご相談ください

Web制作・SEO・MEO・写真撮影まで、目的やご予算に合わせて無理のない形をご 提案します。

090-2395-7145 お問い合わせする

福井県を中心に対応しています

  1. ホーム
  2. コラム
  3. HOOKラボ
  4. 【HOOKラボ #04】Xserver × Cloudflareでサブドメインの無料SSL設定に失敗した話。原因と解決方法をまとめます
【HOOKラボ #04】Xserver × Cloudflareでサブドメインの無料SSL設定に失敗した話。原因と解決方法をまとめます

【HOOKラボ #04】Xserver × Cloudflareでサブドメインの無料SSL設定に失敗した話。原因と解決方法をまとめます

HOOKサイトでは、ドメインをXserverで管理し、DNSはCloudflareを利用しています。

今回、hook-web.com に新しくサブドメインを作成し、別サービスサイトを立ち上げる作業を行いました。

作業内容としては、Xserverでサブドメインを追加し、CloudflareにAレコードを追加し、Xserver側で無料SSLを設定するという流れです。

一見すると、そこまで難しい作業ではありません。

しかし、今回はXserverの無料SSL設定がなかなか成功せず、原因の切り分けに時間がかかりました。

解決方法

メインドメイン側の .htaccess に記述していたリダイレクト設定を一時的にコメントアウトすることで、無料SSLの設定に成功しました。

この記事では、同じようにXserverとCloudflareを組み合わせて使っている方に向けて、今回起きたこと、原因の考え方、実際に行った解決方法をまとめます。

今回の環境

今回の前提は下記の通りです。

  • ドメイン：hook-web.com
  • サーバー：Xserver
  • DNS管理：Cloudflare
  • 新規作成したサブドメイン：sample.hook-web.com
  • SSL：Xserverの無料独自SSL
  • 目的：サブドメインで別サービスサイトを立ち上げる

Xserverでドメインを運用していても、ネームサーバーをCloudflareに向けている場合、実際のDNSレコードはCloudflare側で管理する必要があります。

そのため、Xserver側でサブドメインを追加しただけでは、外部からそのサブドメインに正しくアクセスできません。

今回も、Xserverでサブドメインを追加したあと、Cloudflare側に sample のAレコードを追加しました。

最初に行った作業

最初に行った作業は、下記の流れです。

  1. Xserverで sample.hook-web.com のサブドメインを追加
  2. Cloudflareで sample のAレコードを追加
  3. Aレコードの向き先をXserverのサーバーIPに設定
  4. Cloudflareのプロキシは一時的にDNSのみに設定
  5. Xserverで無料SSLを設定

Cloudflareを使っている場合、SSL設定時は一時的に「DNSのみ」にしておく方が切り分けしやすいです。

Cloudflareのプロキシを有効にしていると、アクセスがCloudflare経由になります。一方、DNSのみの場合は、DNSがオリジンサーバーの実IPを返し、HTTP/HTTPSの通信はCloudflareを経由せずサーバーへ直接向かいます。

そのため、Xserver側で無料SSLを設定する段階では、まずはサーバーへ正しく到達できる状態を作ることを優先しました。

発生した問題

Cloudflare側にAレコードを追加し、Xserver側で無料SSLを設定しようとしたところ、Let’s Encrypt証明書の発行に失敗しました。

最初は、DNSの反映待ちかと思いました。

Xserverではドメイン設定の反映に時間がかかる場合がありますし、サブドメイン追加直後であれば、しばらく待つことで解決するケースもあります。

しかし、今回は12時間ほど時間を置いても状況が変わりませんでした。

そこで、ブラウザから下記のURLにアクセスして確認しました。

http://sample.hook-web.com/

すると、Xserverでよく見かける下記のようなエラーが表示されました。

無効なURLです。
プログラム設定の反映待ちである可能性があります。
しばらく時間をおいて再度アクセスをお試しください。

通常、Xserverでドメインやサブドメインを追加した直後にこの表示が出ることはあります。

ただし、多くの場合はしばらく待てば通常の index.html が表示されるようになります。

今回は12時間経っても表示が変わらなかったため、単純な反映待ちではないと判断しました。

原因の切り分け

ここから、原因を順番に切り分けました。

まず確認したのは、CloudflareのDNS設定です。

Cloudflare側では、下記のように設定していました。

Type：A
Name：sample
Content：XserverのサーバーIP
Proxy status：DNS only
TTL：Auto

次に、Xserver側のサーバーIPとCloudflareに設定したAレコードのIPが一致しているかを確認しました。

ここも問題ありませんでした。

さらに、Xserver側でもサブドメインの追加状況を確認しました。

sample.hook-web.com は追加済みで、設定状況も正常でした。

つまり、ここまでの確認では、

  • CloudflareのAレコードは追加済み
  • AレコードのIPも正しい
  • CloudflareのプロキシはDNSのみ
  • Xserver側のサブドメイン設定も正常

という状態でした。

それでも無料SSLが通らず、ブラウザでも index.html が表示されない。

この時点で疑ったのが、.htaccess のリダイレクト設定です。

今回のポイントは.htaccessのリダイレクトだった

Xserver公式でも、無料SSLの更新や手動設定がうまくいかない場合の確認項目として、DNS設定、アクセス制限、リダイレクト設定の確認が案内されています。特に、サイト転送設定や .htaccess によるリダイレクトがある場合は、一時的に解除して試すことが案内されています。

今回、メインドメインの .htaccess には、HTTPからHTTPSへのリダイレクトと、wwwありからwwwなしへのリダイレクトを記述していました。

該当部分は下記です。

RewriteEngine on

RewriteCond %{HTTPS} !on
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]

RewriteCond %{HTTP_HOST} ^www\.(.*)$ [NC]
RewriteRule ^(.*)$ https://%1/$1 [R=301,L]

この設定自体は、通常のサイト運用ではよく使うものです。

HTTPでアクセスされた場合にHTTPSへ統一し、wwwありのURLをwwwなしへ統一するための設定です。

しかし、サブドメインのSSLがまだ発行されていない段階では、このリダイレクトがSSL認証や表示確認の妨げになることがあります。

特に今回のように、サブドメインを新規作成し、Xserverの無料SSLをこれから発行する段階では、まずHTTPでサブドメインの公開先に正しくアクセスできるかを確認する必要があります。

その前にHTTPSへ強制転送されてしまうと、SSL未設定のサブドメインでは正常に確認できません。

実際に行った解決方法

今回は、メインドメイン側の .htaccess にあるリダイレクト部分を一時的にコメントアウトしました。

RewriteEngine on

# 一時的にコメントアウト
# RewriteCond %{HTTPS} !on
# RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]

# 一時的にコメントアウト
# RewriteCond %{HTTP_HOST} ^www\.(.*)$ [NC]
# RewriteRule ^(.*)$ https://%1/$1 [R=301,L]

この状態で、再度Xserverの管理画面から無料SSL設定を行いました。

すると、SSL設定が成功しました。

その後、SSLのステータスは「反映待ち」になりました。

しばらく待ってから確認すると、約1時間後には https://sample.hook-web.com/ でサブドメインのサイトが表示できるようになりました。

SSLの反映を確認したあと、コメントアウトしていた .htaccess のリダイレクト設定を元に戻しました。

最終的には、SSL対応済みのサブドメインとして無事に立ち上げることができました。

今回の作業手順を整理すると

今回の解決までの流れを整理すると、下記のようになります。

  1. Xserverでサブドメインを追加する
  2. Cloudflareにサブドメイン用のAレコードを追加する
  3. AレコードはXserverのサーバーIPに向ける
  4. SSL設定が完了するまではCloudflareのプロキシをDNSのみにする
  5. ブラウザでHTTPアクセスし、サブドメインの公開先が表示されるか確認する
  6. 表示されない場合は、DNS、サーバーIP、Xserver側のサブドメイン設定を確認する
  7. それでも解決しない場合は、.htaccess のリダイレクト設定を確認する
  8. HTTPSリダイレクトやwwwリダイレクトを一時的にコメントアウトする
  9. Xserverで無料SSLを再設定する
  10. SSLの反映を待つ
  11. HTTPSでサブドメインが表示できるか確認する
  12. 問題なければ .htaccess の設定を元に戻す

ポイントは、いきなりSSL設定だけを何度も試すのではなく、まずHTTPでサブドメインの公開先に正しくアクセスできるか確認することです。

index.html が表示できない状態では、SSL設定も失敗する可能性が高くなります。

Cloudflare利用時に注意したいこと

Cloudflareを利用している場合、サブドメイン追加時に混乱しやすいポイントがあります。

Xserverでサブドメインを追加しても、DNSをCloudflareで管理している場合、Cloudflare側にもDNSレコードを追加する必要があります。

Xserver側のDNSレコード設定に追加するのではなく、実際にネームサーバーとして使っているCloudflare側に追加するのがポイントです。

また、SSL設定前はCloudflareのプロキシを一時的にDNSのみにしておくと、原因を切り分けやすくなります。

SSL設定が完了したあと、Cloudflare側のプロキシを有効に戻す場合は、CloudflareのSSL/TLS設定も確認しておきたいところです。

Cloudflareでは、ブラウザとCloudflare間、Cloudflareとオリジンサーバー間の通信をどのように暗号化するかをSSL/TLSモードで管理します。可能であれば、オリジンサーバー側にも有効な証明書を用意したうえで、FullまたはFull(strict)を使う構成が推奨されています。

特にFull(strict)は、オリジンサーバー側の証明書も検証するモードです。Cloudflare公式でも、Full(strict)ではオリジン証明書に対してより厳格な要件を適用すると説明されています。

今回のようにXserver側で無料SSLを発行できた場合は、Cloudflare側のSSL/TLSモードもあわせて確認しておくと安心です。

今回の原因をまとめると

今回うまく進まなかった原因は、CloudflareのDNS設定ミスではありませんでした。

もちろん、Cloudflareを利用している場合は、Aレコードの追加やプロキシ状態の確認は重要です。

ただ、今回の直接的な要因として大きかったのは、メインドメイン側の .htaccess に設定していたHTTPSリダイレクト・wwwリダイレクトでした。

サブドメインのSSLがまだ発行されていない段階でリダイレクトが効いていたため、Xserver側の無料SSL認証や表示確認がうまく進まなかったと考えています。

実際に、該当するリダイレクト設定を一時的にコメントアウトし、再度XserverでSSL設定を行ったところ、無料SSLの設定に成功しました。

同じ状況になったときのチェックリスト

XserverとCloudflareを組み合わせていて、サブドメインの無料SSL設定に失敗した場合は、下記を順番に確認すると良いです。

1. Cloudflare側にAレコードを追加しているか

Xserverでサブドメインを追加しただけでは、Cloudflare管理下のDNSには反映されません。

Cloudflare側で、サブドメイン用のAレコードを追加します。

2. AレコードのIPがXserverのサーバーIPと一致しているか

CloudflareのAレコードが、正しいXserverのサーバーIPを向いているか確認します。

Xserverで複数サーバーを契約している場合は、別サーバーのIPを指定してしまう可能性もあるため注意が必要です。

3. Cloudflareのプロキシを一時的にDNSのみにしているか

SSL発行前の切り分けでは、Cloudflareのプロキシを一時的にDNSのみにしておくと確認しやすいです。

4. HTTPでサブドメインのindex.htmlが表示できるか

SSL設定前に、まずHTTPでサブドメインの公開先が表示できるかを確認します。

無効なURLです。プログラム設定の反映待ちである可能性があります。 と表示される場合は、単なるSSLの問題ではなく、サブドメインの公開先やリダイレクトの問題も疑います。

5. Xserverのアクセス制限が有効になっていないか

アクセス制限が有効になっていると、SSL認証がうまく進まない可能性があります。

6. サイト転送設定や.htaccessのリダイレクトがないか

今回のように、.htaccess のHTTPSリダイレクトやwwwリダイレクトが影響することがあります。

一時的にコメントアウトして、SSL設定を再実行します。

7. SSL設定後は必ず.htaccessを元に戻す

リダイレクトを一時解除した場合は、SSL設定と表示確認が完了したあと、必ず元に戻します。

本番サイトのURL正規化やHTTPS統一に関わるため、戻し忘れには注意が必要です。

まとめ

今回は、XserverとCloudflareを利用している環境で、サブドメインの無料SSL設定に失敗した事例をまとめました。

最初はCloudflareのDNS設定や反映待ちを疑いましたが、最終的な解決策は .htaccess のリダイレクト設定を一時的にコメントアウトすることでした。

サブドメイン追加やSSL設定は、慣れている作業でも、DNS管理がCloudflareになっていたり、親ドメイン側にリダイレクト設定が入っていたりすると、原因の切り分けが難しくなります。

今回の経験から、サブドメインを立ち上げるときは、下記の流れで確認するのが安全だと感じました。

まずDNSを確認する。
次にHTTPで表示確認する。
そのうえでSSLを設定する。
失敗した場合は、アクセス制限とリダイレクトを確認する。

特に .htaccess は、普段は意識しないところで影響していることがあります。

同じようにXserverとCloudflareを組み合わせてサイト運用している方は、無料SSL設定に失敗したとき、DNSだけでなく .htaccess のリダイレクトも確認してみてください。

Related Columns

関連コラム

コラムをすべて見る
廣部 貴志

この記事を書いた人

廣部 貴志

福井県敦賀市を拠点に、ホームページ制作・SEO対策・写真撮影を行うWebクリエイター。 中小企業・店舗・地域団体を中心に、Web制作から運用保守、MEO、EC支援まで幅広く対応。 「作って終わりではなく、育てるWeb」を大切にし、地域密着で長期的なサポートを行っています。