1. Tinjauan
Sasaran
Dalam codelab ini, Anda akan mem-build aplikasi rekomendasi restoran yang didukung Firestore di iOS di Swift. Anda akan belajar bagaimana:
- Membaca dan menulis data ke Firestore dari aplikasi iOS
- Dengarkan perubahan data Firestore secara realtime
- Gunakan Firebase Authentication dan aturan keamanan untuk mengamankan data Firestore
- Tulis kueri Firestore yang kompleks
Prasyarat
Sebelum memulai codelab ini, pastikan Anda telah menginstal:
- Xcode versi 13.0 (atau lebih tinggi)
- CocoaPods 1.11.0 (atau lebih tinggi)
2. Buat proyek konsol Firebase
Tambahkan Firebase ke proyek
- Buka konsol Firebase .
- Pilih Buat Proyek Baru dan beri nama proyek Anda "Firestore iOS Codelab".
3. Dapatkan Proyek Sampel
Unduh Kode
Mulailah dengan mengkloning proyek sampel dan menjalankan pod update
di direktori proyek:
git clone https://github.com/firebase/friendlyeats-ios cd friendlyeats-ios pod update
Buka FriendlyEats.xcworkspace
di Xcode dan jalankan (Cmd+R). Aplikasi harus dikompilasi dengan benar dan segera mogok saat diluncurkan, karena tidak ada file GoogleService-Info.plist
. Kami akan memperbaikinya di langkah berikutnya.
Siapkan Firebase
Ikuti dokumentasi untuk membuat proyek Firestore baru. Setelah mendapatkan proyek Anda, unduh file GoogleService-Info.plist
proyek Anda dari konsol Firebase dan seret ke root proyek Xcode. Jalankan proyek lagi untuk memastikan aplikasi terkonfigurasi dengan benar dan tidak lagi macet saat diluncurkan. Setelah masuk, Anda akan melihat layar kosong seperti contoh di bawah ini. Jika Anda tidak dapat masuk, pastikan Anda telah mengaktifkan metode masuk Email/Kata Sandi di konsol Firebase di bawah Otentikasi.
4. Tulis Data ke Firestore
Di bagian ini kita akan menulis beberapa data ke Firestore agar kita dapat mengisi UI aplikasi. Ini dapat dilakukan secara manual melalui konsol Firebase , tetapi kami akan melakukannya di aplikasi itu sendiri untuk mendemonstrasikan penulisan Firestore dasar.
Objek model utama di aplikasi kita adalah restoran. Data Firestore dibagi menjadi dokumen, koleksi, dan subkoleksi. Kami akan menyimpan setiap restoran sebagai dokumen dalam koleksi tingkat atas yang disebut restaurants
. Jika Anda ingin mempelajari lebih lanjut tentang model data Firestore, baca tentang dokumen dan koleksi di dokumentasi .
Sebelum kami dapat menambahkan data ke Firestore, kami perlu mendapatkan referensi ke koleksi restoran. Tambahkan baris berikut ke dalam for loop dalam metode RestaurantsTableViewController.didTapPopulateButton(_:)
.
let collection = Firestore.firestore().collection("restaurants")
Sekarang kami memiliki referensi koleksi, kami dapat menulis beberapa data. Tambahkan yang berikut tepat setelah baris kode terakhir yang kami tambahkan:
let collection = Firestore.firestore().collection("restaurants")
// ====== ADD THIS ======
let restaurant = Restaurant(
name: name,
category: category,
city: city,
price: price,
ratingCount: 0,
averageRating: 0
)
collection.addDocument(data: restaurant.dictionary)
Kode di atas menambahkan dokumen baru ke koleksi restoran. Data dokumen berasal dari kamus, yang kami dapatkan dari struktur Restoran.
Kita hampir sampai–sebelum kita dapat menulis dokumen ke Firestore, kita perlu membuka aturan keamanan Firestore dan menjelaskan bagian mana dari database kita yang harus dapat ditulisi oleh pengguna yang mana. Untuk saat ini, kami hanya mengizinkan pengguna terotentikasi untuk membaca dan menulis ke seluruh database. Ini agak terlalu permisif untuk aplikasi produksi, tetapi selama proses pembuatan aplikasi kami menginginkan sesuatu yang cukup santai sehingga kami tidak akan terus-menerus mengalami masalah autentikasi saat bereksperimen. Di akhir codelab ini, kita akan membahas tentang cara memperkuat aturan keamanan dan membatasi kemungkinan baca dan tulis yang tidak diinginkan.
Di tab Rules pada konsol Firebase, tambahkan aturan berikut, lalu klik Publikasikan .
rules_version = '2'; service cloud.firestore { match /databases/{database}/documents { match /{document=**} { // // WARNING: These rules are insecure! We will replace them with // more secure rules later in the codelab // allow read, write: if request.auth != null; } } }
Kami akan membahas aturan keamanan secara mendetail nanti, tetapi jika Anda sedang terburu-buru, lihat dokumentasi aturan keamanan .
Jalankan aplikasi dan masuk. Lalu ketuk tombol " Isi " di kiri atas, yang akan membuat kumpulan dokumen restoran, meskipun Anda belum akan melihatnya di aplikasi.
Selanjutnya, arahkan ke tab data Firestore di Firebase console. Anda sekarang akan melihat entri baru di koleksi restoran:
Selamat, Anda baru saja menulis data ke Firestore dari aplikasi iOS! Di bagian selanjutnya, Anda akan mempelajari cara mengambil data dari Firestore dan menampilkannya di aplikasi.
5. Menampilkan Data dari Firestore
Di bagian ini Anda akan mempelajari cara mengambil data dari Firestore dan menampilkannya di aplikasi. Dua langkah kuncinya adalah membuat kueri dan menambahkan pendengar snapshot. Pemroses ini akan diberi tahu tentang semua data yang ada yang cocok dengan kueri dan menerima pembaruan secara waktu nyata.
Pertama, mari buat kueri yang akan menyajikan daftar restoran default yang tidak difilter. Lihat implementasi dari RestaurantsTableViewController.baseQuery()
:
return Firestore.firestore().collection("restaurants").limit(to: 50)
Kueri ini mengambil hingga 50 restoran dari koleksi tingkat atas bernama "restoran". Sekarang kita memiliki kueri, kita perlu melampirkan pendengar snapshot untuk memuat data dari Firestore ke dalam aplikasi kita. Tambahkan kode berikut ke metode RestaurantsTableViewController.observeQuery()
tepat setelah panggilan ke stopObserving()
.
listener = query.addSnapshotListener { [unowned self] (snapshot, error) in
guard let snapshot = snapshot else {
print("Error fetching snapshot results: \(error!)")
return
}
let models = snapshot.documents.map { (document) -> Restaurant in
if let model = Restaurant(dictionary: document.data()) {
return model
} else {
// Don't use fatalError here in a real app.
fatalError("Unable to initialize type \(Restaurant.self) with dictionary \(document.data())")
}
}
self.restaurants = models
self.documents = snapshot.documents
if self.documents.count > 0 {
self.tableView.backgroundView = nil
} else {
self.tableView.backgroundView = self.backgroundView
}
self.tableView.reloadData()
}
Kode di atas mengunduh koleksi dari Firestore dan menyimpannya dalam array secara lokal. Panggilan addSnapshotListener(_:)
menambahkan pendengar snapshot ke kueri yang akan memperbarui pengontrol tampilan setiap kali data berubah di server. Kami mendapatkan pembaruan secara otomatis dan tidak perlu mendorong perubahan secara manual. Ingat, pemroses snapshot ini dapat dipanggil kapan saja sebagai hasil dari perubahan sisi server, jadi penting agar aplikasi kita dapat menangani perubahan.
Setelah memetakan kamus kita ke struct (lihat Restaurant.swift
), menampilkan data hanyalah masalah menetapkan beberapa properti tampilan. Tambahkan baris berikut ke RestaurantTableViewCell.populate(restaurant:)
di RestaurantsTableViewController.swift
.
nameLabel.text = restaurant.name
cityLabel.text = restaurant.city
categoryLabel.text = restaurant.category
starsView.rating = Int(restaurant.averageRating.rounded())
priceLabel.text = priceString(from: restaurant.price)
Metode populasi ini dipanggil dari metode tableView(_:cellForRowAtIndexPath:)
sumber data tampilan tabel, yang menangani pemetaan kumpulan tipe nilai dari sebelumnya ke sel tampilan tabel individual.
Jalankan aplikasi lagi dan verifikasi bahwa restoran yang kita lihat sebelumnya di konsol sekarang terlihat di simulator atau perangkat. Jika Anda berhasil menyelesaikan bagian ini, aplikasi Anda sekarang membaca dan menulis data dengan Cloud Firestore!
6. Menyortir dan Menyaring Data
Saat ini aplikasi kami menampilkan daftar restoran, tetapi tidak ada cara bagi pengguna untuk memfilter berdasarkan kebutuhan mereka. Di bagian ini, Anda akan menggunakan kueri lanjutan Firestore untuk mengaktifkan pemfilteran.
Berikut adalah contoh kueri sederhana untuk mengambil semua restoran Dim Sum:
let filteredQuery = query.whereField("category", isEqualTo: "Dim Sum")
Sesuai namanya, metode whereField(_:isEqualTo:)
akan membuat kueri kita mengunduh hanya anggota koleksi yang bidangnya memenuhi batasan yang kita tetapkan. Dalam hal ini, itu hanya akan mengunduh restoran dengan category
"Dim Sum"
.
Dalam aplikasi ini, pengguna dapat merangkai beberapa filter untuk membuat kueri tertentu, seperti "Pizza di San Francisco" atau "Makanan Laut di Los Angeles dipesan berdasarkan Popularitas".
Buka RestaurantsTableViewController.swift
dan tambahkan blok kode berikut ke tengah query(withCategory:city:price:sortBy:)
:
if let category = category, !category.isEmpty {
filtered = filtered.whereField("category", isEqualTo: category)
}
if let city = city, !city.isEmpty {
filtered = filtered.whereField("city", isEqualTo: city)
}
if let price = price {
filtered = filtered.whereField("price", isEqualTo: price)
}
if let sortBy = sortBy, !sortBy.isEmpty {
filtered = filtered.order(by: sortBy)
}
Cuplikan di atas menambahkan beberapa klausa whereField
dan order
untuk membuat kueri gabungan tunggal berdasarkan input pengguna. Sekarang kueri kami hanya akan mengembalikan restoran yang sesuai dengan kebutuhan pengguna.
Jalankan proyek Anda dan pastikan Anda dapat memfilter berdasarkan harga, kota, dan kategori (pastikan untuk mengetikkan kategori dan nama kota dengan tepat). Saat menguji Anda mungkin melihat kesalahan di log Anda yang terlihat seperti ini:
Error fetching snapshot results: Error Domain=io.grpc Code=9 "The query requires an index. You can create it here: https://console.firebase.google.com/project/project-id/database/firestore/indexes?create_composite=..." UserInfo={NSLocalizedDescription=The query requires an index. You can create it here: https://console.firebase.google.com/project/project-id/database/firestore/indexes?create_composite=...}
Ini karena Firestore memerlukan indeks untuk sebagian besar kueri gabungan. Memerlukan indeks pada kueri membuat Firestore cepat dalam skala besar. Membuka tautan dari pesan kesalahan akan secara otomatis membuka UI pembuatan indeks di konsol Firebase dengan parameter yang diisi dengan benar. Untuk mempelajari lebih lanjut tentang indeks di Firestore, kunjungi dokumentasi .
7. Menulis data dalam suatu transaksi
Di bagian ini, kami akan menambahkan kemampuan bagi pengguna untuk mengirimkan ulasan ke restoran. Sejauh ini, semua tulisan kami bersifat atomik dan relatif sederhana. Jika ada kesalahan, kami kemungkinan hanya akan meminta pengguna untuk mencobanya lagi atau mencoba lagi secara otomatis.
Untuk menambahkan peringkat ke restoran, kami perlu mengoordinasikan beberapa pembacaan dan penulisan. Pertama-tama ulasan itu sendiri harus diserahkan, dan kemudian jumlah peringkat dan peringkat rata-rata restoran perlu diperbarui. Jika salah satu dari ini gagal tetapi tidak yang lain, kami berada dalam keadaan tidak konsisten di mana data di satu bagian dari basis data kami tidak cocok dengan data di bagian lain.
Untungnya, Firestore menyediakan fungsionalitas transaksi yang memungkinkan kami melakukan banyak baca dan tulis dalam satu operasi atomik, memastikan bahwa data kami tetap konsisten.
Tambahkan kode berikut di bawah semua deklarasi let di RestaurantDetailViewController.reviewController(_:didSubmitFormWithReview:)
.
let firestore = Firestore.firestore()
firestore.runTransaction({ (transaction, errorPointer) -> Any? in
// Read data from Firestore inside the transaction, so we don't accidentally
// update using stale client data. Error if we're unable to read here.
let restaurantSnapshot: DocumentSnapshot
do {
try restaurantSnapshot = transaction.getDocument(reference)
} catch let error as NSError {
errorPointer?.pointee = error
return nil
}
// Error if the restaurant data in Firestore has somehow changed or is malformed.
guard let data = restaurantSnapshot.data(),
let restaurant = Restaurant(dictionary: data) else {
let error = NSError(domain: "FireEatsErrorDomain", code: 0, userInfo: [
NSLocalizedDescriptionKey: "Unable to write to restaurant at Firestore path: \(reference.path)"
])
errorPointer?.pointee = error
return nil
}
// Update the restaurant's rating and rating count and post the new review at the
// same time.
let newAverage = (Float(restaurant.ratingCount) * restaurant.averageRating + Float(review.rating))
/ Float(restaurant.ratingCount + 1)
transaction.setData(review.dictionary, forDocument: newReviewReference)
transaction.updateData([
"numRatings": restaurant.ratingCount + 1,
"avgRating": newAverage
], forDocument: reference)
return nil
}) { (object, error) in
if let error = error {
print(error)
} else {
// Pop the review controller on success
if self.navigationController?.topViewController?.isKind(of: NewReviewViewController.self) ?? false {
self.navigationController?.popViewController(animated: true)
}
}
}
Di dalam blok pembaruan, semua operasi yang kami lakukan menggunakan objek transaksi akan diperlakukan sebagai pembaruan atom tunggal oleh Firestore. Jika pembaruan gagal di server, Firestore akan secara otomatis mencobanya beberapa kali. Ini berarti bahwa kondisi kesalahan kami kemungkinan besar adalah satu kesalahan yang terjadi berulang kali, misalnya jika perangkat benar-benar offline atau pengguna tidak diizinkan untuk menulis ke jalur yang mereka coba tulis.
8. Aturan keamanan
Pengguna aplikasi kami seharusnya tidak dapat membaca dan menulis setiap data di database kami. Misalnya setiap orang harus dapat melihat peringkat restoran, tetapi hanya pengguna yang diautentikasi yang diizinkan untuk memposting peringkat. Menulis kode yang baik pada klien saja tidak cukup, kami perlu menentukan model keamanan data kami di backend agar benar-benar aman. Di bagian ini kita akan mempelajari cara menggunakan aturan keamanan Firebase untuk melindungi data kita.
Pertama, mari kita lihat lebih dalam aturan keamanan yang kita tulis di awal codelab. Buka Firebase console dan arahkan ke Database > Rules di tab Firestore .
rules_version = '2';
service cloud.firestore {
match /databases/{database}/documents {
match /{document=**} {
// Only authenticated users can read or write data
allow read, write: if request.auth != null;
}
}
}
Variabel request
dalam aturan di atas adalah variabel global yang tersedia di semua aturan, dan persyaratan yang kami tambahkan memastikan bahwa permintaan diautentikasi sebelum mengizinkan pengguna melakukan apa pun. Ini mencegah pengguna yang tidak diautentikasi menggunakan Firestore API untuk membuat perubahan tidak sah pada data Anda. Ini adalah awal yang baik, tetapi kita dapat menggunakan aturan Firestore untuk melakukan hal yang jauh lebih hebat.
Mari batasi penulisan ulasan sehingga ID pengguna ulasan harus cocok dengan ID pengguna yang diautentikasi. Hal ini memastikan bahwa pengguna tidak dapat saling meniru dan memberikan ulasan palsu. Ganti aturan keamanan Anda dengan yang berikut:
rules_version = '2';
service cloud.firestore {
match /databases/{database}/documents {
match /restaurants/{any}/ratings/{rating} {
// Users can only write ratings with their user ID
allow read;
allow write: if request.auth != null
&& request.auth.uid == request.resource.data.userId;
}
match /restaurants/{any} {
// Only authenticated users can read or write data
allow read, write: if request.auth != null;
}
}
}
Pernyataan kecocokan pertama cocok dengan subkoleksi bernama ratings
dari dokumen apa pun milik koleksi restaurants
. Persyaratan allow write
kemudian mencegah ulasan apa pun dikirim jika ID pengguna ulasan tidak cocok dengan ID pengguna. Pernyataan kecocokan kedua memungkinkan setiap pengguna yang diautentikasi untuk membaca dan menulis restoran ke database.
Ini bekerja sangat baik untuk ulasan kami, karena kami telah menggunakan aturan keamanan untuk secara eksplisit menyatakan jaminan implisit yang kami tulis ke dalam aplikasi kami sebelumnya–bahwa pengguna hanya dapat menulis ulasan mereka sendiri. Jika kami menambahkan fungsi edit atau hapus untuk ulasan, rangkaian aturan yang persis sama ini juga akan mencegah pengguna untuk mengubah atau menghapus ulasan pengguna lain juga. Tetapi aturan Firestore juga dapat digunakan dengan cara yang lebih terperinci untuk membatasi penulisan pada masing-masing bidang dalam dokumen daripada seluruh dokumen itu sendiri. Kami dapat menggunakan ini untuk memungkinkan pengguna memperbarui hanya peringkat, peringkat rata-rata, dan jumlah peringkat untuk restoran, menghilangkan kemungkinan pengguna jahat mengubah nama atau lokasi restoran.
rules_version = '2';
service cloud.firestore {
match /databases/{database}/documents {
match /restaurants/{restaurant} {
match /ratings/{rating} {
allow read: if request.auth != null;
allow write: if request.auth != null
&& request.auth.uid == request.resource.data.userId;
}
allow read: if request.auth != null;
allow create: if request.auth != null;
allow update: if request.auth != null
&& request.resource.data.name == resource.data.name
&& request.resource.data.city == resource.data.city
&& request.resource.data.price == resource.data.price
&& request.resource.data.category == resource.data.category;
}
}
}
Di sini kami telah membagi izin menulis kami menjadi buat dan perbarui sehingga kami dapat lebih spesifik tentang operasi mana yang harus diizinkan. Setiap pengguna dapat menulis restoran ke database, mempertahankan fungsi tombol Isi yang kami buat di awal codelab, tetapi setelah nama restoran ditulis, lokasi, harga, dan kategorinya tidak dapat diubah. Lebih khusus lagi, aturan terakhir mengharuskan setiap operasi pembaruan restoran untuk mempertahankan nama, kota, harga, dan kategori yang sama dari bidang yang sudah ada di database.
Untuk mempelajari lebih lanjut tentang apa yang dapat Anda lakukan dengan aturan keamanan, lihat dokumentasi .
9. Kesimpulan
Dalam codelab ini, Anda mempelajari cara membaca dan menulis dasar dan lanjutan dengan Firestore, serta cara mengamankan akses data dengan aturan keamanan. Anda dapat menemukan solusi lengkapnya di cabang codelab-complete
.
Untuk mempelajari lebih lanjut tentang Firestore, kunjungi sumber daya berikut: