Skip to content

Firebase — Realtime Database 紀錄

Posted on:April 13, 2019

之前寫過一篇 Cloud Firestore 紀錄,這篇換來看 Firebase 的另一個 database — Realtime Database。

First

若你還沒在 firebase 上啟動過任何專案,可以參考我這篇的前面來跟著操作啟動專案 -> Cloud Firestore 紀錄

之後點選左側的「開發 -> database」,待右側畫面更新完後,將上方的選項改為「Realtiem Database」:

然後點選「規則」進入編輯,將 .read 與 .write 設為 true,按下「發布」,這樣你就可以讀取與設定資料到資料庫裡了。

Coding

在你的編輯器插入以下程式碼:

user-datas 為你的資料 key 值,可以隨意自訂名稱,6~7 行為資料的 key-value,一樣可以隨意自訂,

之後將你的程式碼運行到瀏覽器上,按下 set 按鈕後,我們回到 firebase 去查看,可以發現 realtime database 強大的地方,資料馬上更新了:

寫完 set 後,我們來寫 get 吧~

Get data

在你的編輯器插入以下程式碼:

get 的部分滿簡短的,這邊設定為頁面載入完後就去取得 DB 資料,

user-datas 為你剛剛的「資料 key 值」剛輸入什麼,這邊就需輸入什麼。

此時我們打開 console 來查看:

可以看到剛剛 set 進去的資料。

realtime database 神奇的地方在於即時更新,我們回到 firebase,直接在 firebase 上改變資料內容,然後再回去看剛剛的 console,可以發現資料馬上被印出:

真是太神奇了~

set / get 都很單純,Realtime Database 真正強大的地方就是這個即時更新行為,做聊天室、即時通知這類功能滿適合的。