firebase hostingでURLの一部だけfunctionsが提供するAPIに飛ばす
メモです
やりたいこと
hoge.web.app/api/**へのアクセスだけ、functionsで動いているAPIに向けたい
firebase.jsonにrewritesルールを追加すれば良い
code:firebase.json
"rewrites": [
{
"source": "/api/**",
"function": "app"
}
],
疑問
SPAなので/api/**以外のパスはindex.htmlに渡す必要がある
「〇〇以外のパス」のような除外ができる書き方がなさそう
解決策
redirects と rewrites 属性内では、Hosting のレスポンスは、リクエストされたパスをキャプチャする最初の source glob によって指定されたルールに従います。
つまり優先したいルールを上に書けばOK
code:firebase.json
"rewrites": [
{
"source": "/api/**",
"function": "app"
},
{
"source": "**",
"destination": "/index.html"
}
],
未解決のこと
設定完了後に/api/**にアクセスしてもフロントエンドの画面が表示される
設定を間違えたかと焦る
curlで直接アクセスするとAPIに繋がる
DevToolで検証してみたところServiceWorkerのせい
https://gyazo.com/e7b12c19a596d30b890911c1c9eefc1d
ServiceWorkerからunregistarしてキャッシュを削除すると、期待通りhostingではなくfunctionに接続された
しかし一度でもフロント側を閲覧したら元通りになる……