Zenn
🦔

Firebase Functions に独自ドメインを割り当てる方法

2021/04/22に公開
Firebase
LINE
Cloud Functions
Route53
Amazon API Gateway
tech

執筆中でもヒントになることがあればと思い公開しています。

概要

Firebase Functions に独自ドメインの割り当てを、
以下の構成で行う方法を解説します。

  • Firebase Functions
  • AWS API Gateway
  • AWS Route 53

Route53 → API Gateway → Functions

経緯

LINE Messaging APIからイベント通知を受け取る Webhookエンドポイント を、
Firebase Functionsで構築している。

素のURLだと長くて覚えにくいし、
お客様に LINEオフィシャルアカウントマネージャー から Webhook URL として、
登録していただくにも見栄えが悪い。

しかし、一般的に調べて出てくる rewirters で書き換える方法は、
Nuxtで構築している現在のアプリケーションでは以下の様に設定しているため使えないと判断。
(もし使える方法があれば、ご教示いただければ幸いです。)

"rewrites": [
  {
    "source": "**",
    "destination": "/index.html"
  }
]

よってちょっと冗長だが、先述のような構成で実装しました。

手順

前提条件として、

  • Functionsはすでに作ってある
  • Route53 に使いたい独自ドメインの設定は済んでいる
    状態から解説していきます。

解説する内容としては、

  1. SSL証明書の作成(バージニア北部につ作らないといけないため)
  2. API Gateway の構築
  3. API Gateway の独自ドメインの設定
  4. Route53の設定

ハマりどころ

ちゃんと手順にして整理しますが、自分がハマったところを先に書いておきます。

  • API Gateway は リージョナル ではなく エッジ最適化 にする必要がある
  • エッジ最適化には、SSL証明書はバージニア北部のしか選べない
  • Route53 では、Aレコードエイリアスで、エッジ最適化で作成される Cloudfront を選択する
  • 統合リクエストのところではHTTPヘッダーのリマッピングが必要でない限り、ヘッダーの設定は変更の必要がない(大文字小文字の違いで同じヘッダーが重複するなど謎仕様がある)

Image from Gyazo

Discussion