DNS移行でメインサイトが落ちた話と、Cloudflare Pagesへの繋ぎ込みをやっていく

最近、自分で作っているアプリ(Mogu Exercise)のページを Cloudflare Pages で公開しようとしたんですが、DNSの移行で盛大にやらかしました。

こちらのサイトです。

https://mogu-exercise.takumi-oda.com/ja/


その顛末と復旧までの道のりを実況しつつ、記録しておこうと思います。

ドメインの移行って、影響範囲が大きくて正直、怖いとなりがちですよね。
でも、一回仕組みを理解してしまえば意外とすんなりできるはず。やっていこうと思います!

1. まずはAstro側の準備から

もともとは Astro を Cloudflare Workers で動かす構成だったんですが、独自ドメインでシンプルに運用したかったので、Pages向けの静的(Static)配信に切り替えました。

astro.config.mjsoutput: "static" に変更して、Worker用のアダプタを外すだけです。
SEO対策として sitemap や canonical の設定も済ませて、無事ビルドもうまくいきました。

2. DNSの設定…反映されない?

さっそく、Cloudflare Pages 側を見るように CNAME レコードを設定したんですが、いつまで経っても反映されません。
公式ドキュメントの通りに設定したけど・・・あれ・・・?

調べてみると、どうやらお名前.com側で設定している「ネームサーバー(NS)」が別の方を向いていたみたいです。
要は、ドメインの案内役がそもそも別の場所にいるというわけです。

今回はこれを機に、ネームサーバーを dnsv.jp 系(お名前.comなどのドメイン管理会社が標準で用意している、DNSレコードを柔軟に設定するためのサーバーのことですね)にしっかり切り替えることにします。

既存の別サービスを救済する

ただ、依然としてネームサーバーの切り替えがピンとこないと思います。これ、切り替えた瞬間に既存の設定が全部リセットされるみたいなイメージなんですね。

現在、別で動いているサービス(Azure Static Web Apps で稼働しているサブドメイン)があるので、これの設定を引き継がずに切り替えるとサイトが落ちてしまいます。

よくわからんのでまずは、移行先の dnsv.jp にも CNAME(Azure側の対象エンドポイント)を登録しておくか。
これで準備万端なはず。

3. メインサイトが落ちた。なんだ。

ネームサーバーを切り替えて一安心……と思いきや、メインブログにアクセスすると DNS_PROBE_FINISHED_NXDOMAIN というエラーが。

ん?エラーが出てる。なんだ。

実は、サブドメインのことばかり考えていて、ドメイン本体の Aレコードや、メール用の MXレコード、SPFレコードを移行先に登録するのを完全に忘れていました。

ここを間違えると何時間も無駄にするので要注意です。

慌てて復旧作業

急いで dnsv.jp 側に以下の必須レコードを追加しました。大体こんな感じです。

  • ドメイン本体 の Aレコード -> (サーバーのIPアドレス)
  • www の Aレコード -> (サーバーのIPアドレス)
  • MX レコード -> (メールサーバーの指定)
  • TXT (SPF) レコード -> (メール送信用セキュリティ設定)

※今回は実IPアドレス等は伏せていますが、実際はご自身の環境の値を入れます。手動で入力した場合、なぜそこに繋がるのか分からなくなることもあるので注意しましょう。

その後、dig コマンドを使って、ちゃんと値が設定されたか確認します。
例えば、今回移行先にした dnsv.jp (大元のDNSサーバー)に対して直接聞くならこんなコマンドです。

dig @01.dnsv.jp +short takumi-oda.com A

ざっくりいうと、@ の後に大元のDNSサーバー(権威DNS)を指定して問い合わせるというわけです。

DNSの切り替えって、普通のブラウザや自分のPCから確認しようとすると、「世界中に情報が伝播するまでのキャッシュ」に邪魔されて、実際に設定が成功しているのかどうか判断が遅れがちです。
でも、このコマンドを使って大元のDNSサーバーに直接「ちゃんと設定入ってる?」と聞きに行けば、まだ世界中に伝播しきっていない状態でも、設定自体が成功しているかどうかを先に確認できます。
つまり、「自分が今やった入力が間違っていたのか(設定ミス)」それとも「設定は合っているがキャッシュが残っているだけなのか(伝播待ち)」の切り分けが早い段階で確実にできるというわけです。

これでなんとか設定完了です。

4. 最後にHTTPSの警告が出た

最後に Cloudflare Pages に繋いだサブドメインを開くと、「保護されていない通信」警告が出ました。
設定ミスかと思いましたが、裏側の証明書はちゃんと通っているみたいです。

よくある話ですが、ブラウザのキャッシュが古い方を記憶しているのが原因ですね。
キャッシュが影響しているかどうか確認するときは、こうやってシークレットウィンドウを開いて試すのが定石です。今回はシークレットウィンドウで正常に見れました。焦らずに伝播を待ちましょう。

5. 教訓とまとめ

毎度忘れては調べてとやってるので、今後のために気をつけておきたいことを蓄積していくことにします。

  1. レコード設定とネームサーバー委任は別物
    ざっくりいうと、レコードを作っても、ネームサーバーがそっちを向いていないと誰にも通じないって感じですかね。
  2. ネームサーバー切替前に全レコードを完全移植する
    サブドメインだけでなく、大元のAレコードやMX、TXT(SPFなど)も絶対忘れないように事前にリストアップすべき。
  3. UIだけじゃなく dig コマンドで権威DNSに直接確認
    ブラウザのキャッシュに騙されることもあるので、直接確認するのが確実です。