【完全ガイド】Databuttonでカスタムドメインを設定する方法（Route 53対応）
Databuttonで作成したアプリを独自ドメインで公開したい──。
この記事では、AWS Route 53 を使って Databuttonアプリにカスタムドメインを割り当てる方法をステップごとに丁寧に解説します。
さらに、Firebase Authentication を併用している場合に必要な「承認済みドメイン」設定についてもカバーします。
✅ 前提条件
- Databuttonでアプリを作成済み（公開URLあり）
- AWS Route 53でドメインを管理している
- 使用する独自ドメインが
app.example.comのようなサブドメイン形式である
🔧 ステップ 1：Databuttonでカスタムドメインを申請
- Databuttonのアプリ編集画面を開く
- 上部メニューから
Settings→Custom Domainに移動 - 使用したいドメイン（例：
app.example.com）を入力 -
Continueをクリックすると、DNSに設定すべき CNAMEレコード が表示される
📋 表示される内容（例）：
Name: app.example.com
Type: CNAME
Value: abc1234567890.cname.databutton.io
🛰 ステップ 2：Route 53 にCNAMEレコードを追加
- AWSマネジメントコンソール → Route 53 → 対象ドメインの「ホストゾーン」を開く
- 「レコードを作成」をクリック
- 以下のように設定：
| 項目 | 内容 |
|---|---|
| レコード名 |
app（= app.example.com の app 部分） |
| タイプ | CNAME |
| 値 |
abc1234567890.cname.databutton.io（例） |
| TTL | 300（デフォルトでOK） |
- レコードを保存
⏳ ステップ 3：DNS反映を待つ
DNSの反映には通常数分〜30分ほどかかります。
✅ 動作確認：
ブラウザで https://app.example.com にアクセスし、Databuttonのアプリが表示されれば設定完了です 🎉
🔐 HTTPS対応について
Databuttonはカスタムドメインを登録すると、自動でSSL証明書（HTTPS）を設定してくれます。
そのため、Let's Encrypt などの証明書発行作業は不要です。
🛡 Firebase Authenticationを使っている場合の注意
Databuttonで Firebase Authentication（例：Googleログイン）を使用している場合は、
Firebase 側にもカスタムドメインを「承認済みドメイン」として追加する必要があります。
🔧 設定手順：
- Firebase コンソールを開く
- 対象プロジェクトを選択 → 「Authentication」→「Sign-in method」へ
- ページ下部の「Authorized domains（承認済みドメイン）」までスクロール
- 「Add domain」をクリックし、
app.example.comを追加 - 保存
これを行わないと、OAuth認証時に次のようなエラーが出ます：
This domain is not authorized for OAuth operations.
⚠️ その他の注意点
- Apexドメイン（
example.com）を使いたい場合は、CNAMEではなく ALIAS or Aレコードを使用する必要があります。 - すでに同じサブドメインに他のレコードが存在している場合、競合するので削除してください。
✅ まとめ
| 項目 | 内容 |
|---|---|
| 対応サービス | Databutton + AWS Route 53 |
| 対応ドメイン形式 |
subdomain.example.com（CNAME対応） |
| HTTPS証明書 | 自動発行（Databuttonが対応） |
| Firebase Auth 対応 | 承認済みドメイン登録が必要 |
| 所要時間 | 約10〜15分 |
Databuttonは爆速でアプリを公開できるだけでなく、カスタムドメイン設定も非常にスムーズです。
ブランドURLで公開したい、独自ドメインでAIアプリを運用したいという人にはおすすめの構成です。