独自のドメインを取得しHerokuに設定する
開発環境
- macOS
- VSCode
- Rails 7.1.3.3
- ruby-3.2.3
- PostgreSQL 16.2
- Heroku
行いたいこと
- Herokuの無料プランでデプロイした場合URLは、
https://◯◯◯.herokuapp.comのようなドメインになっているので独自のドメインに変更したい。 - 本来Herokuで独自ドメインを設定するためには、
ドメインをSSL化するために月額7$の有料プラン（Hobby）に入会する必要がありますが、今回はCloudflareを使用しドメインのSSL化に対応していきます。
独自のドメインを取得する
・お名前.comで簡単に取得できます。（クレジットカードの登録が必要です）
（ドメインの取得サイトは他にもあります）
取得の手順
アカウントの作成 ⇨ ＋ドメイン登録 ⇨ 検索欄に作成したいドメイン名を入力（小文字）（アンダーバーは不可）
⇨ .com （今回は0円〜）を選択 ⇨ ブログ・ホームページ ⇨ 今回レンタルサーバーは不要なので削除
⇨ 支払い方法を入力 ⇨ 完了
※今回レンタルサーバーは不要なので以下を削除しました。
Herokuに取得したドメインを設定する
・HerokuのダッシュボードのSettingsから直接設定することもできますが、今回はターミナルからコマンドで設定しました。
・今回取得したドメインはlive-fes.comなので、頭にwww.をつけてwww.live-fes.comで登録する。
$ heroku domains:add www.live-fes.com
・ドメインが正しく登録されているか確認するコマンドです。
$ heroku domains
CloudflareでドメインをSSL対応させる設定
・まずStart for freeから無料プランで登録する。
設定の手順
[Cloudflare側]
・ホーム ⇨ ＋ドメインを追加する
・ドメインを追加すると、追加したドメインの画面 ⇨ DNS（レコード）からCloudflare ネームサーバーが
2つ確認できる。（これをお名前.comのネームサーバーに登録する）
(参考画像)
[お名前.com側]
・お名前.comのご利用中のサービスから登録したドメインを選択 ⇨ ネームサーバーの変更を選択
⇨ その他のサービスを選択 → Cloudflare ネームサーバーの2つをコピペする。
（参考画像）
Cloudflare で 独自ドメイン経由でアクセスできる様に設定する
・追加したドメインの画面 ⇨ DNS（レコード） → DNS管理 → 編集
・タイプ、名前（必須）、ターゲット（必須）を入力する。（他はデフォルト）
(タイプはCNAME、名前はwww、ターゲットは元のHerokuのドメインを入力します。)
Herokuの "DNS Target" について
Herokuに独自ドメインを登録した際にターゲット入力用のDNS Targetが発行されますが、それを使用したところ上手くい反映されなかったため、今回は直接元のドメインを入力しました。
SSL化の設定確認
・SSL/TLS（概要） ⇨ SSL/TLS 暗号化の現在の暗号化モードがフルになっていることを確認
・正しく設定できていれば、URLが独自のドメインに変更されています。
以上で独自ドメインの取得から設定は完了です。
実装や外部ツールで元のHerokuのドメイン設定をして場合は、ドメインの修正や追加をする。
(README, OGP, Google認証 など)
Discussion