【firebase】funtionsを使ってapiをデプロイ・叩き方【本番・ローカル対応】

デプロイする手順
- 1.APIの作成
- 2.API関数を本番にデプロイアップ
- 3.APIを叩く

firebase-project
- functions
-- index.js
-- package.json
- .firebaserc
- firebase.json
- package.json
firebaseプロジェクトの構造です。
functionsにAPI関数を記述していきます。
Cloud functions APIのコーディング
functionsのindexのパス
firebase-project/functions/index.js
APIの作成
exports.addUser = functions.https.onRequest(async(request, response) => {
const db = admin.firestore();
const userRef = await db.collection('addUsers').add({
name: {
name: 'kami',
age: '35',
sex: 'man',
work: 'executive',
},
})
const userDoc = await userRef.get();
const userData = userDoc.data();
response.send(userData);
});

DB addする実装令です。
スポンサードサーチ
デプロイ方法
Firebaseでは、CLIでfirebase deployコマンドを実行すると、
プロジェクト内のすべてのファイルをデプロイされます。
部分的に意図してデプロイする場合は–onlyオプションを使います。
firebase deploy –only [サービス名]
サービス名として指定できるのは以下です。
- hosting
- functions
- database
- storage
- firestore
Hostingをデプロイ
firebase deploy --only hosting
functionsのデプロイ方法
Cloud functionsをデプロイ

firebase deploy --only functions
functionsをデプロイするとindex.js内の関数がデプロイされます。
スポンサードサーチ
functions単体をデプロイ方法
Cloud functionsの関数単体をデプロイ
firebase deploy --only functions:hoge
Cloud functionsの関数単体を複数デプロイ
firebase deploy --only functions:hoge,foo

複数指定の場合は「,」の後はスペースなしで記述します。
firestoreをデプロイ方法
firestoreのindexをデプロイ
firebase deploy --only firestore:index
スポンサードサーチ
APIを叩く

APIが作成できればAPIを叩くだけです。
本番とローカルでは叩くURLが異なります。
APIを叩く前に以下の項目の値を使用します。
- firebase.json
- .firebasercのprojects値
- region
// firebase.json
"emulators": {
"functions": {
"port": 5001
},
"firestore": {
"port": 8080
},
"hosting": {
"port": 5000
},
"ui": {
"enabled": true
},
"singleProjectMode": true
}
// .firebaserc
{
"projects": {
"default": "hoge"
}
}
// region
functions.region('asia-northeast1')
本番のAPIを叩く
https://region.firebasercのprojectsのdefaultの値.cloudfunctions.net/関数名
ローカルのAPIを叩く
http://localhost:HostingのPORT番号/.firebasercのprojectsのdefaultの値/region/関数名

以上でAPIを叩く例です。
実装やエラーが解決できない場合
プログラミングの実装やエラーでどうしてもわからない場合はメンターに相談するのが一番です。
考えている、見えている範囲が狭くなり、解決から遠くに行って何時間も、何日も経っていることなんてよくある話です。
そういう時は聞ける先輩や、メンターに相談することが大事です。
僕にも相談可能なので気軽に相談してください。

Twitterからの連絡だと確実ですよ。
オンラインスクールやプログラミングスクールといったプログラミングを学べる方法もあるので、そちらもぜひ活用してもいいと思います。
Web開発で分からない時
オンライン完結型スクール DMM WEBCAMP PROアプリ開発で分からない時
プログラミング×稼げる副業スキルはテックキャンププログラミングについて分からない時
【コエテコ様限定】※ご案内を受けた以外のメディアが使用しても成果は承認されません。
僕への個人でもメンターでも、スクールでもお好きな方を活用ください。