版本記錄
版本號 | 時間 |
---|---|
V1.0 | 2019.02.01 星期五 |
前言
Firebase是一家實時后端數據庫創業公司,它能幫助開發者很快的寫出Web端和移動端的應用。自2014年10月Google收購Firebase以來,用戶可以在更方便地使用Firebase的同時,結合Google的云服務。Firebase能讓你的App從零到一。也就是說它可以幫助手機以及網頁應用的開發者輕松構建App。通過Firebase背后負載的框架就可以簡單地開發一個App,無需服務器以及基礎設施。接下來幾篇我們就一起看一下基于Firebase平臺的開發。感興趣的看下面幾篇文章。
1. 基于Firebase平臺開發(一) —— 基于ML Kit的iOS圖片中文字的識別(一)
2. 基于Firebase平臺開發(二) —— 基于ML Kit的iOS圖片中文字的識別(二)
開始
首先看下寫作環境
Swift 4, iOS 11, Xcode 9
在此Firebase教程中,您將學習Firebase基礎知識,包括保存數據,實時同步,身份驗證,用戶狀態和離線支持。
Firebase是一種移動后端即服務,可為構建移動應用提供強大功能。 Firebase有三個核心服務:實時數據庫,用戶身份驗證和托管(a realtime database, user authentication and hosting)
。 使用Firebase iOS SDK,您可以使用這些服務創建應用程序,而無需編寫任何服務器代碼。
在此Firebase教程中,您將通過創建名為Grocr
的協作雜貨清單應用程序來了解Firebase的基礎知識。 當項目添加到列表中時,它們會立即出現在任何用戶的設備上,但您不會就此而止。 你會調整Grocr
離線工作,所以即使是雜亂的雜貨店數據連接,列表也會保持同步。
在您工作的過程中,您將了解:
- 將數據保存到Firebase數據庫
- 實時同步數據
- 驗證用戶
- 監控在線用戶
- 啟用離線支持
下面就開始,打開已有的初始項目,該項目使用CocoaPods
來管理依賴項,它們包含在下載的項目中。
該項目包含三個視圖控制器:
- LoginViewController.swift:登錄當前正在使用硬編碼憑據,但您很快就會解決這個問題。
-
GroceryListTableViewController.swift:這是
UITableViewController
的子類,它使用UIAlertController
將項添加到本地數據列表中。 -
OnlineUsersTableViewController.swift:此控制器將使用
Firebase
的presence
功能顯示當前在線的所有用戶。
除了視圖控制器,還有兩個模型,GroceryItem.swift
和User.swift
。
構建并運行,您將看到該應用程序如下所示:
您只需點擊Login
即可登錄,登錄將使用硬編碼用戶。 如果您看一下,您會看到該應用目前僅適用于本地數據。 接下來,您將使用Firebase將應用程序變的更靈活和富有生命。
Setting up a Firebase Account
在iOS項目中設置Firebase
有三個主要步驟:
- 1) 創建一個免費的
Firebase
帳戶 - 2) 下載
GoogleService-Info.plist
并將其添加到您的應用中 - 3) 告訴
Firebase
在您的應用啟動時啟動
要創建Firebase帳戶,請訪問Firebase主頁Firebase homepage。 如果您尚未登錄,請按右上角的GO TO CONSOLE
,然后輸入您的Google
帳戶的憑據。 如果您沒有Google帳戶,則需要先創建一個,您可以在此處here創建。
然后,您將為您創建一個干凈的Firebase控制臺。 不要擔心花錢;此Firebase教程中的所有內容都可以使用免費計劃完成。
是時候創建第一個項目了,所以單擊+
添加項目按鈕。
在出現的對話框中,輸入Grocr
作為項目名稱,然后選擇您喜歡的國家/地區:
單擊CREATE PROJECT
,等待它創建,然后按Continue
繼續進入項目的儀表板:
這是項目Firebase
服務的容器。 您將使用它來存儲數據和驗證用戶。
選擇Add Firebase to your iOS app
上方的iOS按鈕。 在iOS Bundle ID
字段中輸入rw.firebase.gettingstarted
:
單擊REGISTER APP
,然后單擊Download GoogleService-Info.plist
。 按照說明將其移動到Xcode中的Grocr
項目。
當Xcode提示時,請確保選中Copy Items if needed
。
返回Firebase項目的網頁,然后點擊CONTINUE
。 下一頁介紹了如何安裝Firebase SDK:
入門項目已包含SDK,因此只需單擊CONTINUE
即可。 最后一頁介紹了在應用啟動時如何連接Firebase:
您需要在教程應用中執行此操作。 在Xcode中,打開AppDelegate.swift
并在application(_:didFinishLaunchingWithOptions:)
的return語句之前添加此代碼:
FirebaseApp.configure()
返回Firebase項目的網頁,單擊FINISH
以查看新項目的詳細信息:
這樣就簡單的完成了。
Creating a Connection to Firebase
設置Firebase應用程序后,轉到Xcode并打開GroceryListTableViewController.swift
。 在定義屬性的位置,添加以下內容:
let ref = Database.database().reference(withPath: "grocery-items")
這將使用提供的路徑建立與Firebase數據庫的連接。 在文檔(the documentation)中,這些Firebase屬性稱為引用(references)
,因為它們引用Firebase數據庫中的某個位置。
簡而言之,此屬性允許將數據保存和同步到給定位置。
您會注意到未使用基本URL。 相反,它使用grocery-items
的子路徑。 Firebase數據庫是JSON NoSQL數據庫,因此所有數據都存儲為JSON。
JSON是一種分層鍵值數據結構 - 鍵指的是可以包含指向其他對象的值的對象。 JSON數據只是鍵值對的樹。
對于Firebase,鍵是一個URL,值是任意數據,可以是數字,字符串,布爾值或對象。
1. Structuring Data
無論在客戶端上如何格式化,Firebase中存儲的所有數據都是JSON。 看一下以下示例JSON數據:
// The root of the tree
{
// grocery-items
"grocery-items": {
// grocery-items/milk
"milk": {
// grocery-items/milk/name
"name": "Milk",
// grocery-items/milk/addedByUser
"addedByUser": "David"
},
"pizza": {
"name": "Pizza",
"addedByUser": "Alice"
},
}
}
在上面的JSON樹中,您可以看到映射到每個數據的路徑。 您可以繼續遍歷樹并在更深的位置檢索數據。
對于上述數據,您可以使用以下路徑檢索所有grocery items
:
grocery-items
如果您只想獲取第一個雜貨商品,則可以導航其子路徑:
grocery-items/milk
由于所有Firebase密鑰都映射到路徑,因此您選擇的密鑰名稱尤為重要。
2. Understanding Firebase References
要掌握的基本主題是Firebase參考指向Firebase中存儲數據的位置。 如果您創建多個引用,則它們都共享相同的連接。
看看這個示例代碼:
// 1
let rootRef = Database.database().reference()
// 2
let childRef = Database.database().reference(withPath: "grocery-items")
// 3
let itemsRef = rootRef.child("grocery-items")
// 4
let milkRef = itemsRef.child("milk")
// 5
print(rootRef.key) // prints: ""
print(childRef.key) // prints: "grocery-items"
print(itemsRef.key) // prints: "grocery-items"
print(milkRef.key) // prints: "milk"
下面進行詳細解析:
- 1) 您可以創建對Firebase數據庫根目錄的引用。
- 2) 使用URL,您可以在Firebase數據庫中創建對子位置的引用。
- 3) 從
rootRef
中,您可以使用child(_:)
通過傳遞子路徑來創建子引用。 該引用與上面的引用相同。 - 4) 使用
itemsRef
,您可以創建對milk
位置的子引用。 - 5) 每個引用都有一個key屬性。 此屬性會告訴您Firebase數據庫中的密鑰名稱。
您無需在示例項目中的任何位置添加此代碼,這純粹是出于說明目的。
Adding New Items to the List
在GroceryListTableViewController.swift
的底部附近,找到addButtonDidTouch(_ :)
。
您可以在此向用戶顯示UIAlertController
以添加新項目。
在方法內,找到saveAction
。 目前,它只將數據保存到本地陣列,因此saveAction
不會在多個客戶端之間同步,并在重新啟動應用程序時消失。
沒有人會想要使用不記得或同步他們的購物清單的應用程序! 將saveAction
替換為以下內容:
let saveAction = UIAlertAction(title: "Save",
style: .default) { _ in
// 1
guard let textField = alert.textFields?.first,
let text = textField.text else { return }
// 2
let groceryItem = GroceryItem(name: text,
addedByUser: self.user.email,
completed: false)
// 3
let groceryItemRef = self.ref.child(text.lowercased())
// 4
groceryItemRef.setValue(groceryItem.toAnyObject())
}
下面進行詳細細分:
- 1) 從
alert controller
獲取text field
及其文本。 - 2) 使用當前用戶的數據,創建一個新的,未完成的
GroceryItem
。 - 3) 使用
child(_ :)
創建子引用。 此引用的鍵值是小寫的項目名稱,因此當用戶添加重復項目(即使它們大寫,或使用大小寫)時,數據庫僅保存最新條目。 - 4) 使用
setValue(_ :)
將數據保存到數據庫。 這種方法需要一個字典。GroceryItem
有一個名為toAnyObject()
的輔助函數,可以將其轉換為Dictionary
。
您接下來需要更改數據庫設置。 轉到瀏覽器中的Firebase儀表板,然后選擇左側的Database
選項,然后選擇Realtime Database
的Get started
部分。
在Security rules for Cloud Firestore
的對話框中,選擇Start in test mode
,然后按ENABLE
。
Cloud Firestore
是實時數據庫(Realtime Database)
的替代品,目前處于測試階段。 如果你很好奇,你可以在這里here了解更多相關信息。
在此Firebase教程中,您將使用實時數據庫而不是Cloud Firestore
。 選擇Database
旁邊的下拉列表,然后選擇Realtime Database
。
默認情況下,實時數據庫需要用戶身份驗證才能進行讀寫。 如果您之前選擇了測試模式,則將Firebase設置為始終允許兩者,以便在開發過程中更輕松。 選擇RULES
并在編輯器中驗證以下內容:
{
"rules": {
".read": true,
".write": true
}
}
如果它們不匹配,請替換它們,然后選擇PUBLISH
按鈕以保存更改。
建立并運行。 在Firebase儀表板中,選擇DATA
選項卡并將瀏覽器窗口放在模擬器旁邊。 在模擬器中添加項目時,您會看到它出現在儀表板中:
現在您有一個購物清單應用程序,可以實時向Firebase添加數據! 因此,此關鍵功能正常工作,但沒有任何項目添加到表視圖(table view)
中。
那么,如何將數據從數據庫同步到表視圖呢?
Retrieving Data
通過使用observe(_:with :)
將異步偵聽器附加到引用,可以在Firebase
中檢索數據。
將以下內容添加到GroceryListTableViewController.swift
中viewDidLoad()
的末尾:
ref.observe(.value, with: { snapshot in
print(snapshot.value as Any)
})
此方法有兩個參數:DataEventType
實例和閉包。
事件類型指定要偵聽的事件。 代碼偵聽.value
事件類型,該類型反過來偵聽Firebase
數據庫中添加,刪除和更改的數據的所有類型的更改。
發生更改時,數據庫會使用最新數據更新應用程序。
應用程序通過閉包通知更改,該閉包傳遞DataSnapshot
的實例。 顧名思義,快照代表特定時刻的數據。 要訪問快照中的數據,請使用value
屬性。
構建并運行,您將看到添加時記錄到控制臺的列表項:
Optional({
pizza = {
addedByUser = "hungry@person.food";
completed = 0;
name = Pizza;
};
})
Synchronizing Data to the Table View
現在是時候在桌面視圖中實際顯示購物清單了。
在Grocery List TableViewController.swift
中,使用以下代碼替換上一個代碼段:
// 1
ref.observe(.value, with: { snapshot in
// 2
var newItems: [GroceryItem] = []
// 3
for child in snapshot.children {
// 4
if let snapshot = child as? DataSnapshot,
let groceryItem = GroceryItem(snapshot: snapshot) {
newItems.append(groceryItem)
}
}
// 5
self.items = newItems
self.tableView.reloadData()
})
下面進行詳細分解:
- 1) 每當修改雜貨商品端點時,附加一個監聽器以接收更新。
- 2) 將最新版本的數據存儲在偵聽器閉包內的局部變量中。
- 3) 偵聽器的閉包返回最新數據集的快照。 快照包含整個雜貨項目列表,而不僅僅是更新。 使用
children
,你可以遍歷grocery items
。 - 4)
GroceryItem
結構有一個初始化程序,它使用DataSnapshot
填充其屬性。 快照的值是AnyObject
類型,可以是字典,數組,數字或字符串。 在創建GroceryItem
實例后,它將其添加到包含最新版本數據的數組中。 - 5) 使用最新版本的數據替換
items
,然后重新加載表格視圖,以便顯示最新版本。
建立并運行。 添加一個項目 - 一些牛奶怎么樣? - 它將顯示在表格視圖中。
無需實時更新列表即可進行刷新!
后記
本篇主要講述了Firebase基本使用簡介,感興趣的給個贊或者關注~~~