Cara mengintegrasikan Aplikasi Flutter iOS anda dengan Firebase di MacOS

Firebase adalah platform pengembangan aplikasi mudah alih yang dikembangkan oleh Firebase, Inc. pada tahun 2011, dan kemudian Diperolehi oleh Google pada tahun 2014. Ia menyediakan pelbagai ciri seperti Cloud Storage, Authentication dan ML kit, yang penting untuk mengembangkan aplikasi mudah alih moden.

Selain itu, ia menyediakan perkhidmatan seperti Performance Monitoring, Crashlytics dan Google Analytics untuk membantu anda meningkatkan kualiti aplikasi anda.

Dalam tutorial ini, saya akan menunjukkan kepada anda cara menyambungkan aplikasi Flutter iOS anda ke Platform Firebase pada Komputer Mac, supaya anda dapat menggunakan perkhidmatan hebat yang disediakan oleh firebase API dalam usaha anda yang akan datang…

1. Menyiapkan Akaun Gmail dan Projek Flutter

Untuk menggunakan perkhidmatan dari Firebase dan Google Cloud Platform, anda memerlukan Akaun Google. Sekiranya anda tidak memilikinya, cukup ikuti arahan halaman di sini untuk mendaftar.

Tutorial ini akan menunjukkan kepada anda bagaimana menghubungkan aplikasi Flutter yang ada ke platform Firebase. Sekiranya anda berminat untuk membuat aplikasi Flutter pertama anda, saya mempunyai tutorial mengenai Cara membuat aplikasi Flutter iOS pertama anda di MacOS . Pada akhir tutorial itu, anda harus mempunyai aplikasi hello_world yang siap di simulator dan memahami cara mengubah aplikasi dengan mengubah fail main.dart .

2. Membuat Projek Firebase

Untuk mengintegrasikan aplikasi Flutter anda dengan Firebase Platform, pertama anda harus membuat Projek Firebase. Dan berikut adalah langkah-langkahnya.

1. Pergi ke Firebase Console .

2. Klik pada butang Tambah projek besar .

3. Masukkan nama Projek anda .

  • Saya menggunakan hello-world untuk contoh ini. Firebase secara automatik menambahkan ID unik ke nama projek anda - sebagai contoh, projek yang saya buat berakhir dengan nama hello-world-f2206 .

4. Anda boleh memilih Lokasi Cloud Firestore .

  • Saya meninggalkannya sebagai nam5 (us-central) kerana saya tinggal di Los Angeles, tetapi Cloud Functions tidak tersedia di us-west2 , dan lalu lintas di antaranya akan menimbulkan caj tambahan. Anda boleh mendapatkan lebih banyak maklumat mengenai ketersediaan perkhidmatan dan lokasi pelayan di sini .

5. Terima Terma dan Syarat .

5. Setelah selesai, tatal ke bawah dan klik Buat Projek .

  • Lihat 3.1 Beralih ke Akaun Pentadbir di lampiran di akhir artikel ini jika anda mengalami mesej ralat yang meminta akaun pentadbir.

Firebase akan mengambil masa untuk menyiapkan aplikasi anda. Setelah selesai, klik pada butang Teruskan untuk membuka Halaman Gambaran Keseluruhan Projek Firebase .

4. Konfigurasikan Aplikasi iOS

1. Di Halaman Ikhtisar Projek Firebase anda , lancarkan wizard persediaan untuk iOS .

2. Di dalam wizard persediaan, masukkan ID paket iOS. The app Daftar butang perlu kemudian ke atas cahaya, klik di atasnya.

  • Petunjuk mengenai cara mencari ID bundle iOS boleh didapati di bawah di bahagian 4.1 Mencari folder root Projek iOS & Memperolehi ID Bundle pada lampiran.

3. Muat turun fail konfigurasi GoogleService-Info.plist dan masukkan ke folder root Projek iOS, kemudian klik Next .

  • Petunjuk mengenai cara mencari ID bundle iOS boleh didapati di bawah di bahagian 4.1 Mencari folder root Projek iOS & Memperolehi ID Bundle pada lampiran.

4. Ikuti arahan untuk menambahkan Firebase SDK , kemudian klik Seterusnya .

  • Panduan terperinci mengenai cara memasang CocoaPods dan Firebase SDK terdapat di bawah di bahagian 4.2 Memasang CocoaPods dan Firebase SDK .

5. Ubah kod di dalam AppDelegate utama seperti yang diperintahkan oleh wizard persediaan kemudian klik Next . Untuk contoh ini, saya menggunakan Objective-C , dan dengan itu mengganti kandungan di dalam AppDelegate.m dengan kod berikut.

#include "AppDelegate.h" #include "GeneratedPluginRegistrant.h" @import UIKit; @import Firebase; @implementation AppDelegate - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions { [FIRApp configure]; return YES; } @end

6. Kembali ke folder root dan jalankan aplikasi anda, setelah beberapa saat anda akan melihat wizard persediaan yang menunjukkan bahawa aplikasi anda ditambahkan ke Firebase. Klik Terus ke Konsol untuk menyelesaikan persediaan.

Tahniah! Anda berjaya menambahkan Firebase ke aplikasi Flutter anda. Walaupun mempunyai Firebase dan Flutter dari Google adalah sesuatu yang hebat, sebenarnya adalah amalan Kejuruteraan Perisian yang baik untuk selalu mempunyai rancangan B, serta rancangan C, D, E, F, dan G. Pada masa akan datang saya akan tulis panduan lain mengenai aplikasi contoh yang menggunakan Firebase, dan lebih banyak lagi mengenai Flutter.

Selamat pengekodan !!!

Lampiran:

3.1 Beralih ke Akaun Pentadbir

Sekiranya anda menerima mesej berikut, ini bermakna anda perlu menghubungi organisasi akaun Gmail anda untuk memberi anda akses ke Google Developers Console .

4.1 Mencari folder root Projek iOS & Memperolehi ID Bundle

1. Lancarkan Xcode dari Launchpad .

2. Select “Open another project…” at the bottom of the prompt screen.

3. Navigate to your Flutter project folder, open the “ios” folder and select “Runner.xcodeproj”. This should automatically open up the project in Xcode.

4. Select the Runner project on the left, you should now see the Bundle Identifier under Identity.

4.2 Installing CocoaPods and Firebase SDK

In case the instructions inside the setup wizard did not work out, you will have to remove the existing Podfile in order to reinstall them correctly.

1. CocoaPods is built with Ruby and is installable with the default Ruby available on MacOS. Use the following commands to install it.

sudo gem install cocoapods

2. Initialize the Podfile with the following command.

pod init

3. Then, add the following code to the initialized Podfile.

pod 'Firebase/Core'

4. Once done, save the changes made to the Podfile, and install the Firebase SDK with the following command.

pod install

5. After the installation, you will likely have to configure the .xcconfig files. First you will have to copy the files from the Pods/Target Support Files/Pods-Runner folder to Flutter folder.

6. Then you will have to include them into the Debug.xcconfig and Release.xcconfig files inside the Flutter folder.

In Debug.xcconfig:

#include "Pods-Runner.debug.xcconfig"

In Release.xcconfig:

#include "Pods-Runner.profile.xcconfig" #include "Pods-Runner.release.xcconfig"