ใใฎใชใใธใใชใฏ2024ๅนด7ๆใซใตใใผใใ็ตไบใใพใใ ่ฉณ็ดฐใฏใfreee ไผ่จ Firebase SDK / freee-app-template-firebaseใฎใกใณใใใณใน็ตไบใซใคใใฆใใใ่ฆงใใ ใใใ
ใใฎใขใใชใฏ Firebase ไธใงๅไฝใใ freee SDK ใๅฉ็จใใฆใ freee ใขใซใฆใณใใฎ่ช่จผใ freee API ใฎๅผใณๅบใใ่กใใตใณใใซใขใใชใงใใ
ใใฎใชใใธใใชใใณใใผใปใฏใญใผใณใใฆใ็ฌ่ชใฎ freee ใขใใชไฝๆๆใฎใใณใใฌใผใใจใใฆๅฉ็จใใใใจใใงใใพใใ๏ผใใฎใชใใธใใชใฏMITใฉใคใปใณในใงใใ๏ผ
- ใญใฐใคใณ๏ผfreee ใขใซใฆใณใใฎ่ช่จผ๏ผ
- freee ใญใฐใคใณ็ป้ขใฎ่กจ็คบ
- freee ใขใซใฆใณใใฎ่ช่จผใจ่ชๅฏ
- ใณใผใซใใใฏใง freee ใขใซใฆใณใใฎๆ ๅ ฑใ Firebase ใซไฟๅญ
- ใญใฐใคใณๅพใฎใใผใ ็ป้ขใฎ่กจ็คบ
- ใญใฐใขใฆใ
- ไบๆฅญๆๆ
ๅ ฑใฎๅๅพ
- SDK ใๅฉ็จใใฆ freee API ใฎ GET api/1/users/me ใๅผใณๅบใใพใ
- ๅๅผๆ
ๅ ฑใฎ็ป้ฒ
- SDK ใๅฉ็จใใฆ freee API ใฎ POST api/1/deals ใๅผใณๅบใใพใ
- freee API ใฎๅผใณๅบใใซๅฟ ่ฆใชใขใฏใปในใใผใฏใณใจใชใใฌใใทใฅใใผใฏใณใฎใๆๅทๅใจ key rotation
Windows็ฐๅขใฏใตใใผใใใฆใใใพใใใ
ใใฎใขใใชใงใฏไปฅไธใฎ Firebase ใฎใตใผใในใๅฉ็จใใพใใ
- ้็ใใกใคใซใไปปๆใฎใใกใคใณใง้ ไฟกใใ Firebase Hosting
- freee API ใๅผใณๅบใ Firebase Cloud Functions
- ใใผใฟใฎไฟๅญใ่กใ Cloud FireStore
Firebase ใงใฎ Web ใขใใชไฝๆใซใคใใฆใฏๅ ฌๅผใชใใกใฌใณในใใๅ็ งใใ ใใใ
ใชใใธใใชใฎใซใผใใใฃใฌใฏใใช
โ functions .. Firebase Cloud Functions ใซใใใญใคใใใใฝใผในใฎใซใผใใใฃใฌใฏใใช
โใโ src .. Firebase Cloud Functions ็จใฎไธป่ฆใชใฝใผในใ็ฝฎใใฆใใใใฃใฌใฏใใช
โใใใโ config .. ๅ็จฎ่จญๅฎใใกใคใซใ็ฝฎใใฆใใใใฃใฌใฏใใช
โใใใโใใโ config.xxxx.json .. freee ใฎ SDK ็จใฎ่จญๅฎใใกใคใซ
โใใใโใใโ service-account.xxxx.json .. Firebase ็จใฎ่จญๅฎใใกใคใซ
โใใใโ freee_sdk .. freee ใฎ SDK ใฎใปใใใขใใใใกใคใซ็ฝฎใๅ ด
โใใใโ routes .. freee ใขใซใฆใณใใฎ่ช่จผใๅถๅพกใใใใกใคใซ็ฝฎใๅ ด
โใใใโ services .. Firebase Cloud Functions ใซ็ป้ฒใใ API ็จใฎใฝใผใน็ฝฎใๅ ด
โใใใโ index.tx .. Firebase Cloud Functions ใซ็ป้ฒใใ API ็จใฎใจใณใใใคใณใใๅฎ็พฉใใใใกใคใซ
โ
โ hosting .. Firebase Hosting ใซใใใญใคใใใใฝใผในใฎใซใผใใใฃใฌใฏใใช
ใใโ src .. Firebase Hosting ็จใฎไธป่ฆใชใฝใผในใ็ฝฎใใฆใใใใฃใฌใฏใใช
ใใใใโ services .. Firebase Cloud Functions ใจใฎๆฅ็ถ็จใฎใฝใผในใ็ฝฎใใฆใใใใฃใฌใฏใใช
ใใใใโ utils .. ใขใใชใๆธใไธใงไพฟๅฉใชใใญใฐใฉใ ใ็ฝฎใใฆใใใใฃใฌใฏใใช
ใใใใโ index.html .. ใขใใชใฎ็ป้ขใใกใคใซ
ใใใใโ main.css .. ใขใใชใฎCSSใใกใคใซ
ใใใใโ main.ts .. ใขใใชใฎ็ป้ข็จใฎใฝใผในใใกใคใซ
- git
- Node.js 10
- Google Chrome
- ใชใใธใใชใใฏใญใผใณใใใ
$ git clone https://github.com/freee/freee-app-template-firebase.git $ cd freee-app-template-firebase
- firebase-tools ใใคใณในใใผใซใใใ
npm install -g firebase-tools@7.16.2
- Firebase ใซใญใฐใคใณใใใ๏ผใใฉใฆใถใง่ช่จผ็ป้ขใ่กจ็คบใใใใฎใงใๆฟ่ชใใฆใใ ใใใ๏ผ
firebase login
- Firebase ใฎใณใณใฝใผใซใง Firebase ใใญใธใงใฏใใไฝๆใใใ๏ผ https://console.firebase.google.com/u/0/?hl=ja ใๅ่ใซใใชใใ Firebase ใใญใธใงใฏใใไฝๆใใฆใใ ใใใ๏ผ
- ไฝๆใใ Firebase ใใญใธใงใฏใใฎ่ฉณ็ดฐ็ป้ขใ้ใใใตใคใใใผใใ Authentication ใ้ธๆใ ๅงใใ ใใฏใชใใฏใใฆ Authentication ใใขใฏใใฃใใผใใใใ
- ๅๆงใซใตใคใใใผใใ Firestore ใ้ธๆใ ใใผใฟใใผในใฎไฝๆ ใใฏใชใใฏใใฆ Firestore ใใขใฏใใฃใใผใใใใ
- ใในใใขใผใใง้ๅงใใใซใใงใใฏใๅ ฅใใฆใใ ใใใ
- ใญใฑใผใทใงใณใฏ asia-northeast1 ใ้ธๆใใฆใใ ใใใ
- ๅๆงใซใตใคใใใผใใ Storage ใ้ธๆใ Storage ใใขใฏใใฃใใผใใใใ
- ไฝๆใใใใญใธใงใฏใใฎ [Project ID] ใ็ขบ่ชใใใ
firebase projects:list ๅบๅไพ) โโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโฌโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโฌโโโโโโโโโโโโโโโโโโโโโโโ โ Project Display Name โ Project ID โ Resource Location ID โ โโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโผโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโผโโโโโโโโโโโโโโโโโโโโโโโค โ template-firebase-local โ template-firebase-local โ asia-northeast1 โ โโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโผโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโผโโโโโโโโโโโโโโโโโโโโโโโค
- Firebase ใใญใธใงใฏใใ็ดไปใใใ
firebase use [Project ID] ๅฎ่กไพ) firebase use template-firebase-local
- freee ใขใใชในใใขใง freee ใขใใชใไฝๆใใใ๏ผ ใใกใใๅ่ใซใใชใใ freee ใขใใชใไฝๆใใฆใใ ใใใ๏ผ
- ใณใผใซใใใฏ URL ใฏ
http://localhost:5001/{{project-id}}/us-central1/api/auth/callback
ใซใใฆใใ ใใใ
- ใณใผใซใใใฏ URL ใฏ
Firebase Cloud Functions ใฏใตใผใใผใฌในใงๅฎ่กใงใใ้ขๆฐใงใใญใผใซใซใงๅใใใใจใใงใใพใใ
ใใใงใฏใใญใผใซใซใง Firebase Cloud Functions ใๅไฝใใใๆ้ ใ็ดนไปใใพใใ
functions/.runtimeconfig.json
ใ่จญๅฎใใใ{ "env": { "serviceaccountpath": "config/service-account.local.json", "mode": "local" }, "freee": { "client_id": "ไฝๆใใ freee ใขใใชใฎ client_id", "client_secret": "ไฝๆใใ freee ใขใใชใฎ client_secret" } }
- Firebase ็จใฎ่จญๅฎใใกใคใซใๆบๅใใใใใกใ ใๅ่ใซ JSON file ใใใฆใณใญใผใใใ
functions/src/config/service-account.local.json
ใจใใใใกใคใซๅใงไฟๅญใใฆใใ ใใใservice-account.local.json
ใฎไธญ่บซใฎไพ{ "type": "service_account", "project_id": "sample-pjt-xxx", "private_key_id": "xxx", "private_key": "xxx", "client_email": "xxx", "client_id": "xxx", "auth_uri": "https://accounts.google.com/o/oauth2/auth", "token_uri": "https://oauth2.googleapis.com/token", "auth_provider_x509_cert_url": "https://www.googleapis.com/oauth2/v1/certs", "client_x509_cert_url": "xxx" }
- freee SDK ็จใฎ่จญๅฎใใกใคใซใๆบๅใใใ
functions/src/config/config.local.json
ใซไปฅไธใฎใใกใคใซใๆบๅใใฆใใ ใใใ [ใฆใงใ API ใญใผ] ใฏ ไปฅไธใฎๆ้ ใง็ขบ่ชใใฆใใ ใใใ Firebase ใฎใณใณใฝใผใซใงใใญใธใงใฏใใฎๆฆ่ฆใฎๅณๅดใซใใๆญฏ่ปใขใคใณใณใใใใญใธใงใฏใใฎ่จญๅฎใใฏใชใใฏใใใ ๅ จ่ฌใฟใๅ ใซใใ ใฆใงใ API ใญใผ ใฎๅคใ็ขบ่ชใใใ{ "freee": { "authHost": "http://localhost:5001/[Project ID]/us-central1/api/auth", "appHost": "http://localhost:5000", "homePath": "/select_company", "tokenHost": "https://accounts.secure.freee.co.jp", "apiHost": "https://api.freee.co.jp" }, "firebase": { "apiKey": "[ใฆใงใ API ใญใผ]", "cryptoKeyBucket": "[Project ID].appspot.com" } }
Firebase Hosting ใฏ้็ใชใใกใคใซ๏ผHTML, JavaScript็ญ๏ผใใใใญใคใใฆไปปๆใฎใใกใคใณใงๅ ฌ้ใงใใใในใใฃใณใฐใตใผใในใงใใ
ใใฎใขใใชใงใฏ Firebase Hosting ใใ Firebase Cloud Functions ใๅผใณๅบใใฆใใขใใชใๅไฝใใใฆใใพใใ
.env.development
ใ่จญๅฎใใใ hosting/.env.development ใซไปฅไธใฎ่จญๅฎใ่จ่ผใใฆใใ ใใใ# functions ใฎ URL CLOUD_FUNCTION_HOST=http://localhost:5001/[Project ID]/us-central1 # fucntionsใฎonCallๅผใณๅบใใใญใผใซใซใงๅใใๆใซๅฟ ่ฆ่จญๅฎ(CORSใจใฉใผๅฏพ็ญ) CLOUD_FUNCTION_LOCAL_HOST=http://localhost:5001 # hosting ใๆฅ็ถใใ functions ใฎใชใผใธใงใณใๆๅฎใใ HOSTING_REQUEST_FUNCTIONS_REGION=us-central1 # freee ไผ่จใฎใใกใคใณ CFO_DOMAIN=https://secure.freee.co.jp
npm run setup
ใๅฎ่กใใใnpm start
ใๅฎ่กใใhttp://localhost:5000
๏ผhosting ใฎURL๏ผใซใขใฏใปในใใใ
- ๆฌ็ช็ฐๅข็จใซๆนใใฆ Firebase ใใญใธใงใฏใใจ freee ใขใใชใไฝๆใใฆใใ ใใใ๏ผ้็บ็ฐๅขใฎใปใใใขใใใฎStep 1ใๅ่ใซใใฆใใ ใใใ๏ผ
- freee ใขใใชใฎใณใผใซใใใฏ URL ใซใฏใไปฅไธใ่จญๅฎใใฆใใ ใใใ
https://asia-northeast1-[Project ID].cloudfunctions.net/api/auth/callback
- freee ใขใใชใฎใณใผใซใใใฏ URL ใซใฏใไปฅไธใ่จญๅฎใใฆใใ ใใใ
- ใณใใณใใฉใคใณใใๆฌ็ช็ฐๅข็จใซไฝๆใใใใญใธใงใฏใใฎๅฉ็จใใใใใซๅใๆฟใใพใใ
firebase use [Project ID]
้็บ็ฐๅข็จใซ่จญๅฎใใๅ็จฎ่จญๅฎใใกใคใซใซใคใใฆใใ ๆฌ็ช็ฐๅข็จใฎใใกใคใซใไฝๆใใๅฟ ่ฆใใใใพใใ
functions/src/config/service-account.production.json
functions/src/config/config.production.json
functions/src/config/config.production.json
ใฎ่จญๅฎไพ
{
"freee": {
"authHost": "https://asia-northeast1-[Project ID].cloudfunctions.net/api/auth",
"appHost": "https://[Project ID].web.app/home",
"homePath": "/select_company",
"tokenHost": "https://accounts.secure.freee.co.jp",
"apiHost": "https://api.freee.co.jp"
},
"firebase": {
"apiKey": "[ใฆใงใ API ใญใผ]",
"cryptoKeyBucket": "[Project ID].appspot.com"
}
}
ใพใๆฌ็ช็ฐๅขใง Firebase Cloud Functions ใๅไฝใใใใใใซใฏใ.runtimeconfig.json
ใฎๅ
ๅฎนใ Firebase Cloud Functions ใซ่จญๅฎใใๅฟ
่ฆใใใใพใใ
ไปฅไธใๅ่ใซใณใใณใใฉใคใณใใ่จญๅฎใใฆใใ ใใใ๏ผใใกใใๅ่ใซใใฆใใ ใใ๏ผ
firebase functions:config:set env.mode=production env.region="asia-northeast1" freee.client_id=xxx freee.client_secret=xxx env.serviceaccountpath="config/service-account.production.json"
Firebase Hosting ใๅๆงใซใๆฌ็ช็ฐๅข็จใฎ่จญๅฎใใกใคใซใไฝๆใใๅฟ ่ฆใใใใพใใ
hosting/.env.production
# functions ใฎ URL
CLOUD_FUNCTION_HOST=https://asia-northeast1-[Project ID].cloudfunctions.net
# hosting ใๆฅ็ถใใ functions ใฎใชใผใธใงใณใๆๅฎใใ
HOSTING_REQUEST_FUNCTIONS_REGION=asia-northeast1
# freee ไผ่จใฎใใกใคใณ
CFO_DOMAIN=https://secure.freee.co.jp
Firebase Cloud Functions ใฎใใใญใคใซใ Cloud Build API ใๅฉ็จใใๅฟ ่ฆใใใใฎใง Cloud Build API ใๆๅนใซใใพใใ
https://console.cloud.google.com/apis/library/cloudbuild.googleapis.com?project=[Project ID] ใ้ใใๆๅนใซใใใใฏใชใใฏใใฆใใ ใใใ
npm run deploy
ใๅฎ่กใใฆใใ ใใใ
Q. Firebase ใฎๆ้ใใฉใณใฏใฉใใใใ่ฏใใ๏ผ
A. ้็บ็ฐๅข็จใฎ Firebase ใฏ็กๆใฎ Spark ใใฉใณใงๅไฝใใใใใจใใงใใพใใๆฌ็ช็ฐๅข็จใฎ Firebase ใฏ Blaze ใใฉใณใซใใๅฟ ่ฆใใใใพใใ