เพิ่ม Firebase ให้กับแอพ Flutter ของคุณ
ข้อกำหนดเบื้องต้น
ติดตั้ง โปรแกรมแก้ไขหรือ IDE ที่คุณต้องการ
ติดตั้ง Flutter สำหรับระบบปฏิบัติการเฉพาะของคุณ รวมถึงสิ่งต่อไปนี้:
- Flutter SDK
- ห้องสมุดที่รองรับ
- ซอฟต์แวร์เฉพาะแพลตฟอร์มและ SDK
ลงชื่อเข้าใช้ Firebase โดยใช้บัญชี Google ของคุณ
หากคุณยังไม่มีแอป Flutter คุณสามารถ เริ่มต้นใช้งาน: ทดลองขับ เพื่อสร้างแอป Flutter ใหม่โดยใช้โปรแกรมแก้ไขหรือ IDE ที่คุณต้องการ
ขั้นตอนที่ 1 : ติดตั้งเครื่องมือบรรทัดคำสั่งที่จำเป็น
หากคุณยังไม่ได้ ติดตั้ง ให้ติดตั้ง Firebase CLI
ลงชื่อเข้าใช้ Firebase โดยใช้บัญชี Google ของคุณโดยเรียกใช้คำสั่งต่อไปนี้:
firebase login
ติดตั้ง FlutterFire CLI โดยเรียกใช้คำสั่งต่อไปนี้จากไดเร็กทอรีใดก็ได้:
dart pub global activate flutterfire_cli
ขั้นตอนที่ 2 : กำหนดค่าแอพของคุณเพื่อใช้ Firebase
ใช้ FlutterFire CLI เพื่อกำหนดค่าแอป Flutter ของคุณเพื่อเชื่อมต่อกับ Firebase
จากไดเร็กทอรีโปรเจ็กต์ Flutter ของคุณ ให้รันคำสั่งต่อไปนี้เพื่อเริ่มเวิร์กโฟลว์การกำหนดค่าแอพ:
flutterfire configure
เวิร์กโฟลว์
flutterfire configure
ทำสิ่งต่อไปนี้:
ขอให้คุณเลือกแพลตฟอร์ม (iOS, Android, เว็บ) ที่รองรับในแอป Flutter ของคุณ สำหรับแต่ละแพลตฟอร์มที่เลือก FlutterFire CLI จะสร้างแอป Firebase ใหม่ในโครงการ Firebase ของคุณ
คุณเลือกใช้โปรเจ็กต์ Firebase ที่มีอยู่หรือสร้างโปรเจ็กต์ Firebase ใหม่ได้ หากคุณมีแอปที่ลงทะเบียนในโปรเจ็กต์ Firebase ที่มีอยู่แล้ว FlutterFire CLI จะพยายามจับคู่แอปตามการกำหนดค่าโปรเจ็กต์ Flutter ปัจจุบันของคุณ
สร้างไฟล์การกำหนดค่า Firebase (
firebase_options.dart
) และเพิ่มลงในlib/
ของคุณ(สำหรับ Crashlytics หรือการตรวจสอบประสิทธิภาพบน Android) เพิ่มปลั๊กอิน Gradle เฉพาะผลิตภัณฑ์ที่จำเป็นลงในแอป Flutter ของคุณ
ขั้นตอนที่ 3 : เริ่มต้น Firebase ในแอปของคุณ
จากไดเร็กทอรีโครงการ Flutter ของคุณ ให้รันคำสั่งต่อไปนี้เพื่อติดตั้งปลั๊กอินหลัก:
flutter pub add firebase_core
จากไดเรกทอรีโปรเจ็กต์ Flutter ของคุณ ให้รันคำสั่งต่อไปนี้เพื่อให้แน่ใจว่าการกำหนดค่า Firebase ของแอป Flutter เป็นปัจจุบัน:
flutterfire configure
ในไฟล์
lib/main.dart
ให้นำเข้าปลั๊กอินหลักของ Firebase และไฟล์การกำหนดค่าที่คุณสร้างไว้ก่อนหน้านี้:import 'package:firebase_core/firebase_core.dart'; import 'firebase_options.dart';
นอกจากนี้ ในไฟล์
lib/main.dart
ของคุณ ให้เริ่มต้น Firebase โดยใช้อ็อบเจ็กต์DefaultFirebaseOptions
ที่ส่งออกโดยไฟล์การกำหนดค่า:await Firebase.initializeApp( options: DefaultFirebaseOptions.currentPlatform, );
สร้างแอปพลิเคชัน Flutter ของคุณใหม่:
flutter run
ขั้นตอนที่ 4 : เพิ่มปลั๊กอิน Firebase
คุณเข้าถึง Firebase ในแอป Flutter ผ่าน ปลั๊กอิน Firebase Flutter ที่หลากหลาย หนึ่งปลั๊กอิน สำหรับผลิตภัณฑ์ Firebase แต่ละผลิตภัณฑ์ (เช่น Cloud Firestore, Authentication, Analytics เป็นต้น)
เนื่องจาก Flutter เป็นเฟรมเวิร์กหลายแพลตฟอร์ม ปลั๊กอิน Firebase แต่ละตัวจึงใช้ได้กับแพลตฟอร์ม Apple, Android และเว็บ ดังนั้น หากคุณเพิ่มปลั๊กอิน Firebase ใดๆ ลงในแอป Flutter ของคุณ ปลั๊กอินนั้นจะถูกใช้โดยแอปเวอร์ชัน Apple, Android และเว็บ
วิธีเพิ่มปลั๊กอิน Firebase Flutter มีดังนี้
จากไดเร็กทอรีโครงการ Flutter ของคุณ ให้รันคำสั่งต่อไปนี้:
flutter pub add PLUGIN_NAME
จากไดเร็กทอรีโครงการ Flutter ของคุณ ให้รันคำสั่งต่อไปนี้:
flutterfire configure
การเรียกใช้คำสั่งนี้ช่วยให้แน่ใจว่าการกำหนดค่า Firebase ของแอป Flutter เป็นปัจจุบัน และสำหรับ Crashlytics และการตรวจสอบประสิทธิภาพบน Android จะเพิ่มปลั๊กอิน Gradle ที่จำเป็นลงในแอปของคุณ
เมื่อเสร็จแล้ว ให้สร้างโครงการ Flutter ของคุณใหม่:
flutter run
คุณทุกชุด! แอป Flutter ของคุณลงทะเบียนและกำหนดค่าให้ใช้ Firebase แล้ว
ปลั๊กอินที่มีอยู่
ผลิตภัณฑ์ | ชื่อปลั๊กอิน | iOS | Android | เว็บ | แอปเปิ้ลอื่นๆ (macOS เป็นต้น) |
---|---|---|---|---|---|
การวิเคราะห์ | firebase_analytics | เบต้า | |||
ตรวจสอบแอพ | firebase_app_check | เบต้า | |||
การตรวจสอบสิทธิ์ | firebase_auth | เบต้า | |||
Cloud Firestore | cloud_firestore | เบต้า | |||
ฟังก์ชั่นคลาวด์ | cloud_functions | เบต้า | |||
การส่งข้อความบนคลาวด์ | firebase_messaging | เบต้า | |||
การจัดเก็บเมฆ | firebase_storage | เบต้า | |||
Crashlytics | firebase_crashlytics | เบต้า | |||
ลิงก์แบบไดนามิก | firebase_dynamic_links | ||||
การส่งข้อความในแอป | firebase_in_app_messaging | ||||
การติดตั้ง Firebase | firebase_app_installations | เบต้า | |||
ML Model Downloader | firebase_ml_model_downloader | เบต้า | |||
การตรวจสอบประสิทธิภาพ | firebase_performance | ||||
ฐานข้อมูลเรียลไทม์ | firebase_database | เบต้า | |||
การกำหนดค่าระยะไกล | firebase_remote_config | เบต้า |
ลองใช้แอปตัวอย่างกับ Analytics
เช่นเดียวกับแพ็คเกจทั้งหมด ปลั๊กอิน firebase_analytics
มาพร้อมกับ โปรแกรมตัวอย่าง
เปิดแอป Flutter ที่คุณกำหนดค่าให้ใช้ Firebase แล้ว (ดูคำแนะนำในหน้านี้)
เข้าถึง
lib
ของแอป จากนั้นลบไฟล์main.dart
ที่มีอยู่จากที่ เก็บโปรแกรมตัวอย่าง Google Analytics ให้คัดลอกและวางไฟล์สองไฟล์ต่อไปนี้ลงในไดเรกทอรี
lib
ของแอป:-
main.dart
-
tabs_page.dart
-
เรียกใช้แอพ Flutter ของคุณ
ไปที่โปรเจ็กต์ Firebase ของแอปใน คอนโซล Firebase จากนั้นคลิก Analytics ในการนำทางด้านซ้าย
สำหรับข้อมูลเพิ่มเติมเกี่ยวกับการตั้งค่า Analytics โปรดไปที่คู่มือเริ่มต้นใช้งานสำหรับ iOS+ , Android และ เว็บ
ขั้นตอนถัดไป
รับประสบการณ์ตรงจาก Firebase Flutter Codelab
เตรียมเปิดแอปของคุณ:
- ตั้งค่า การแจ้งเตือนงบประมาณ สำหรับโครงการของคุณใน Google Cloud Console
- ตรวจสอบ แดชบอร์ด การใช้งานและการเรียกเก็บเงิน ในคอนโซล Firebase เพื่อดูภาพรวมการใช้งานโปรเจ็กต์ของคุณในบริการ Firebase ที่หลากหลาย
- ตรวจ สอบรายการตรวจสอบการเปิดตัว Firebase