基于Firebase平臺開發(三) —— Firebase基本使用簡介(一)

版本記錄

版本號 時間
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:此控制器將使用Firebasepresence功能顯示當前在線的所有用戶。

除了視圖控制器,還有兩個模型,GroceryItem.swiftUser.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 DatabaseGet 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.swiftviewDidLoad()的末尾:

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基本使用簡介,感興趣的給個贊或者關注~~~

?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容