DATA-WORLD-BLOG

Programing

2023-08-08

Journal

Move to Netlify from Vercel

👤horomi

Vercel hobbyは商用利用できないので、

ちょっとお小遣い稼ぎができるようにherohoroブログのサーバーをNetlifyにすることにしました。

About Netlify

SSGだけど、プラグイン使えばSSR・ISRになる!?

https://recruit.gmo.jp

Get start

テンプレ使ってすぐはじめられる＼(^o^)／

https://app.netlify.com

１分でできる！！！

build待ってる間にゲームが用意されてる 🤣

ゲームしてたらすぐ終わってた 🥳

やー＼(^o^)／

herohoroブログをdeploy

環境変数設定してあとはそのままで成功

プラグイン入れない状態でもいいねボタンが動いていたので、今回はそのままの状態で使うことにしました👀

Set domain

一応subdomainもできるっぽい❤(ӦｖӦ｡)

https://docs.netlify.com

今回はherohoro.comだけやってみたいからsubは見送り。

【アカウント(herohoro)】のDomainsからDNSを登録する。

Netfilyで提示されたネームサーバーは４つ

Google Domainへ行き、DNSのネームサーバーを登録する。

Set HTTPS

https://docs.netlify.com

Our certificates use the modern TLS protocol, which has replaced the now deprecated SSL standard.

If you add a custom domain, we will automatically provision a certificate with Let’s Encrypt, enabling HTTPS on your domain. Certificates are generated and renewed automatically as needed.

If your domain uses Netlify DNS, we’ll automatically provision a wildcard certificate, which ensures instant HTTPS for all of the Netlify sites using subdomains of that domain.

Netlifyのvalidateを選択！

access to domain but 404

Vercelのherohoroブログのprojectで設定していたdomainを削除して、

Netfilyだけにすれば動くかと思ったら、、、、

404＼(^o^)／

ChatGPTに質問

❓ Prompt
Next.jsで作ったブログをVercelでdeployしていましたが、Netlifyに変更しようとしています。

Netlifyでのdeployは成功しましたが、独自ドメインを設定してもアクセス先が404エラーとなってしまいます。DNSはGoogle domainを使っています。

💬 Answer：独自ドメインの404エラー確認法

独自ドメインをNetlifyに設定する際に404エラーが表示される場合、以下の点を確認してみるとよいでしょう。

DNS設定の確認: Google Domainの管理画面から、DNS設定がNetlifyのネームサーバーに正しく向いていることを確認してください。ネームサーバーの変更が完全に反映されるまでには時間がかかることがあるため、変更後にすぐにエラーが解消されない場合もあるので注意してください。
Netlifyのドメイン設定の確認: Netlifyの管理画面から、独自ドメインが正しく設定されていることを確認してください。サブドメインが含まれる場合など、設定が間違っているとエラーになることがあります。
リダイレクトの設定: 何らかのリダイレクトの設定が原因でエラーが発生している可能性があるので、リダイレクトの設定を確認してみてください。
ビルド設定の確認: Netlifyでのビルドが正しく行われているか確認してみてください。ビルドエラーがあるとページが表示されないことがあります。
SSL証明書の確認: HTTPSを使用している場合、SSL証明書の設定に問題がないか確認してみてください。
キャッシュのクリア: DNSの変更がブラウザのキャッシュに残っている可能性があるので、ブラウザのキャッシュをクリアしてみてください。
DNSプロパゲーションの確認: DNSの変更が全世界のDNSサーバーに反映されるまでには時間がかかることがあります。プロパゲーションの状況は、オンラインのDNSプロパゲーションチェックツールを使用して確認できます。

エラーの原因が分からない場合は、Netlifyのサポートに問い合わせることも一つの選択肢です。必要な情報を提供して、専門的なサポートを受けることができるでしょう。

❓ Prompt：とりあえず項目ごとに答えてみた
Google Domainに設定してまだ24時間経っていません。
Netlifyの管理画面では成功したという表示になっています。

リダイレクトの設定の確認方法がわかりません。
Netlifyでのビルドは成功しています。
HTTPSはNetlifyで自動で設定されて成功しています。
ブラウザのキャッシュのクリアの方法がわかりません。
DNSプロパゲションの確認のしかたがわかりません。

💬 Answer：具体的な手順

DNSプロパゲーションの確認: DNSプロパゲーションは、DNSの変更がインターネット全体に広がるまでの時間です。このプロセスは24～48時間かかることがあります。プロパゲーションの状態を確認するためには、DNS Checkerなどのオンラインツールを使用できます。ドメイン名を入力して、世界中の異なる場所からDNSレコードをチェックできます。
リダイレクトの設定の確認: Netlifyでは、リダイレクトルールをnetlify.tomlファイルか_redirectsファイルで設定できます。プロジェクトのディレクトリ内でこれらのファイルを確認し、意図しないリダイレクトルールがないかをチェックしてください。
ブラウザのキャッシュのクリア: キャッシュのクリア方法はブラウザによって異なります。たとえば、Google Chromeでは、設定メニューから「その他のツール」→「閲覧履歴を消去」を選択し、キャッシュされた画像やファイルをクリアします。

あなたの説明に基づいて、特にDNSプロパゲーションが未完了である可能性が高いようです。変更後の24～48時間以内はこのような問題が発生することが一般的なので、もう少し時間をかけて待ってみると良いかもしれません。上記のDNS Checkerツールを使って進捗をチェックすると、状況がどう変わっているのかがわかります。