Trong hướng dẫn nhanh này, bạn sẽ tìm hiểu cách tạo Firebase Data Connect trong ứng dụng bằng một phiên bản SQL sản xuất.
Trong bảng điều khiển Firebase, bạn sẽ:
- Thêm Firebase Data Connect vào dự án Firebase của bạn.
- Tạo một lược đồ cho ứng dụng bằng tính năng tạo lược đồ dựa trên AI trong bảng điều khiển Firebase rồi triển khai lược đồ đó.
- Cung cấp một phiên bản Cloud SQL cho ứng dụng của bạn.
- Với Gemini trong Firebase, hãy điền dữ liệu mẫu vào cơ sở dữ liệu của bạn.
- Tạo truy vấn và đột biến, với hoạt động tạo được hỗ trợ bởi AI, bạn có thể triển khai và sử dụng để phát triển mã ứng dụng cục bộ.
Sau đó, trong môi trường phát triển cục bộ, bạn sẽ:
- Thiết lập một công cụ phát triển, bao gồm cả tiện ích Visual Studio Code để làm việc với phiên bản sản xuất của bạn.
- Đồng bộ hoá môi trường cục bộ với các thành phần mà bạn đã tạo trong bảng điều khiển.
- Tạo SDK có kiểu dữ liệu mạnh và sử dụng chúng trong ứng dụng của bạn.
Quy trình trên bảng điều khiển: Sử dụng tính năng hỗ trợ của AI để thiết kế giản đồ, sau đó triển khai giản đồ đó vào cơ sở dữ liệu
- Nếu chưa có, bạn cần tạo một dự án Firebase.
- Trong bảng điều khiển Firebase, hãy nhấp vào Thêm dự án, sau đó làm theo hướng dẫn trên màn hình.
- Chuyển đến mục Data Connect của bảng điều khiển Firebase.
- Nhấp vào nút Bắt đầu sử dụng Gemini.
- Trong bảng quy trình Schema Generator (Trình tạo giản đồ) xuất hiện, hãy mô tả một ứng dụng để Gemini có thể giúp bạn tạo giản đồ GraphQL.
- Xem lại giản đồ GraphQL, sau đó nhấp vào Nâng cấp và triển khai.
Nâng cấp dự án của bạn lên gói Blaze. Nhờ đó, bạn có thể tạo một phiên bản Cloud SQL cho PostgreSQL.
Chọn Tạo một phiên bản Cloud SQL mới. Trong hộp thoại xuất hiện, hãy chọn vị trí và tên cho cơ sở dữ liệu Cloud SQL cho PostgreSQL.
Giản đồ ứng dụng của bạn được triển khai cùng với cơ sở dữ liệu PostgreSQL tương ứng với giản đồ đó.
Luồng trên bảng điều khiển: Sử dụng tính năng hỗ trợ của AI để tạo các thao tác cho khách hàng
Sau khi triển khai giản đồ, bạn có thể thực hiện các bước đầu tiên để cung cấp dữ liệu này cho các ứng dụng khách bằng cách tạo một trình kết nối gồm các truy vấn và đột biến để triển khai vào phần phụ trợ, sau đó gọi từ các ứng dụng khách.
Các công cụ hỗ trợ dựa trên AI của chúng tôi luôn sẵn sàng trợ giúp bạn.
Khi được nhắc, hãy nhấp vào nút Tạo các thao tác bằng Gemini.
Sau vài giây, trong bảng điều khiển quy trình Tạo các thao tác xuất hiện, hãy xem danh sách các truy vấn và đột biến do Gemini cung cấp dựa trên giản đồ của bạn.
Nhấp vào từng hàng thao tác để xem mã GraphQL xác định thao tác đó. Nếu cần, hãy dùng chế độ cài đặt thùng rác để xoá những thao tác mà bạn không cần.
Để thêm các thao tác, hãy nhấp vào nút + Thêm. Sau đó:
Mô tả hoạt động của bạn bằng ngôn ngữ tự nhiên.
Ví dụ:
List all products
Xem lại GraphQL đã tạo.
Nếu chấp nhận thao tác này, hãy nhấp vào Chèn để thêm thao tác đó vào danh sách thao tác.
Tiếp tục xoá và thêm các thao tác cho đến khi bạn có được một tập hợp thao tác chấp nhận được.
Để triển khai danh sách các thao tác này dưới dạng một tập hợp trình kết nối có thể gọi của máy khách, hãy chọn tên của trình kết nối, rồi nhấp vào Triển khai.
Luồng trên bảng điều khiển: Sử dụng Gemini trong Firebase để tạo một đột biến và điền sẵn cơ sở dữ liệu
Bằng cách hoàn tất các bước trước đó, bạn đã tạo một Data Connect sơ đồ bao gồm các loại thực thể có liên quan và triển khai sơ đồ đó vào quy trình sản xuất, tức là một cơ sở dữ liệu PostgreSQL có bảng tương ứng cũng được tạo và triển khai.
Để điền sẵn cơ sở dữ liệu, bạn có thể sử dụng Gemini trong Firebase để giúp bạn lấy dữ liệu đầu vào bằng ngôn ngữ tự nhiên nhằm xác định một đột biến GraphQL để cập nhật một trong các bảng và một truy vấn để xác nhận nội dung cập nhật.
Mở thẻ Dữ liệu.
Nhấp vào biểu tượng Giúp tôi viết GraphQL pen_spark rồi nhập nội dung đầu vào vào hộp xuất hiện.
Ví dụ:
Add data for three sample products to my app.
Nhấp vào Tạo. Thao tác biến đổi được trả về.
Xem xét kết quả. Nếu cần, hãy nhấp vào Chỉnh sửa để tinh chỉnh câu lệnh và nhấp vào Tạo lại.
Tiếp theo, hãy nhấp vào Chèn để chèn đột biến vào trình chỉnh sửa dữ liệu.
Nhấp vào Chạy.
Khi bạn chạy thao tác biến đổi, dữ liệu sẽ được ghi vào bảng áp dụng trong cơ sở dữ liệu PostgreSQL. Bạn có thể tạo một truy vấn trong bảng điều khiển để xem dữ liệu đã lưu trữ:
Lặp lại các bước trước đó, sử dụng Giúp tôi viết GraphQL pen_spark để tạo một truy vấn.
Trong hộp xuất hiện, hãy nhập thông tin.
Ví dụ:
Query data for all sample products in my app.
Nhấp vào Tạo, rồi nhấp vào Chạy.
Luồng cục bộ: Chọn công cụ phát triển
Giờ đây, khi đã có dữ liệu trong cơ sở dữ liệu được triển khai và đã triển khai một trình kết nối, bạn có thể tiếp tục phát triển lược đồ và trình kết nối trong môi trường phát triển cục bộ.
Trước tiên, bạn cần thiết lập một môi trường cục bộ. Data Connect cung cấp cho bạn 2 cách để cài đặt các công cụ phát triển.
Luồng cục bộ: Thiết lập môi trường phát triển
Tạo một thư mục mới cho dự án cục bộ của bạn.
Để thiết lập môi trường phát triển Data Connect và IDE dựa trên trình duyệt, đồng thời tạo SDK ứng dụng, hãy chạy lệnh sau trong thư mục mới mà bạn đã tạo.
curl -sL https://firebase.tools/init/dataconnect | editor=true bash
Tập lệnh này sẽ thử cài đặt. IDE đã cài đặt cung cấp các công cụ, bao gồm cả các tiện ích VS Code được đóng gói sẵn, để giúp bạn quản lý giản đồ và xác định các truy vấn cũng như đột biến sẽ được dùng trong ứng dụng của bạn, đồng thời tạo các SDK có kiểu dữ liệu mạnh.
Tập lệnh này cũng đồng bộ hoá các thành phần mà bạn đã tạo trong bảng điều khiển Firebase với thư mục cục bộ của bạn, đồng thời tạo SDK ứng dụng cho mọi ứng dụng mà bạn đã đăng ký cho dự án của mình.
Luồng cục bộ: Thiết lập dự án cục bộ
Để thiết lập dự án cục bộ, hãy khởi động thư mục dự án. Trong cửa sổ IDE, ở bảng điều khiển bên trái, hãy nhấp vào biểu tượng Firebase để mở giao diện người dùng của tiện ích Data Connect VS Code:
Nhấp vào nút Start emulators (Khởi động trình mô phỏng).
Luồng cục bộ: Tìm lược đồ và trình kết nối trong môi trường cục bộ
Lựa chọn cài đặt tự động cho macOS hoặc Linux mà bạn đã dùng để đồng bộ hoá các thành phần với một dự án hiện có sẽ có những tác động sau:- Thao tác này sẽ đồng bộ hoá giản đồ mà bạn đã triển khai
- Tìm giản đồ của bạn: giản đồ này nằm trong thư mục dự án Firebase, trong tệp
/dataconnect/schema/schema.gql
.
- Tìm giản đồ của bạn: giản đồ này nằm trong thư mục dự án Firebase, trong tệp
- Thao tác này sẽ đồng bộ hoá các truy vấn và đột biến trong trình kết nối mà bạn đã triển khai
- Tìm trình kết nối: các thao tác nằm trong thư mục dự án Firebase của bạn, trong thư mục
/dataconnect/connector/
.
- Tìm trình kết nối: các thao tác nằm trong thư mục dự án Firebase của bạn, trong thư mục
Luồng cục bộ: Tìm hiểu giản đồ của bạn
Ví dụ về giản đồ: Phim
Trong Data Connect, các trường GraphQL được liên kết với các cột. Loại Movie
có thể có id
, title
, imageUrl
và genre
.
Data Connect nhận dạng các kiểu dữ liệu nguyên thuỷ String
và UUID
.
# File `/dataconnect/schema/schema.gql`
# By default, a UUID id key will be created by default as primary key.
type Movie @table {
id: UUID! @default(expr: "uuidV4()")
title: String!
imageUrl: String!
genre: String
}
Ví dụ về giản đồ 1:1: MovieMetadata
Với phim, bạn có thể mô hình hoá siêu dữ liệu của phim.
Ví dụ: trong schema.gql
, bạn có thể thêm đoạn mã sau hoặc xem xét mã do Gemini tạo.
# Movie - MovieMetadata is a one-to-one relationship
type MovieMetadata @table {
# This time, we omit adding a primary key because
# you can rely on Data Connect to manage it.
# @unique indicates a 1-1 relationship
movie: Movie! @unique
# movieId: UUID <- this is created by the above reference
rating: Float
releaseYear: Int
description: String
}
Lưu ý rằng trường movie
được liên kết với một loại Movie
.
Data Connect hiểu rằng đây là mối quan hệ giữa Movie
và MovieMetadata
, đồng thời sẽ quản lý mối quan hệ này cho bạn.
Tìm hiểu thêm về giản đồ Data Connect trong tài liệu
Luồng cục bộ: Thêm dữ liệu vào bảng
Trong bảng điều khiển trình chỉnh sửa IDE, bạn có thể thấy các nút CodeLens xuất hiện trên các loại GraphQL trong /dataconnect/schema/schema.gql
. Giống như trong bảng điều khiển, bạn có thể tạo một đột biến để thêm dữ liệu vào cơ sở dữ liệu sản xuất.
Để thêm dữ liệu vào một bảng khi làm việc cục bộ, hãy làm như sau:
- Trong
schema.gql
, hãy nhấp vào nút Thêm dữ liệu phía trên khai báo cho một trong các loại của bạn (chẳng hạn nhưMovie
,Product
,Account
, tuỳ thuộc vào bản chất của ứng dụng).
- Một tệp mới (
<type>_insert.qgl
) sẽ được thêm vào thư mục làm việc của bạn, chẳng hạn nhưMovie_insert.gql
hoặcProduct_insert.gql
. Mã hoá cứng dữ liệu trong các trường cho loại đó. - Nhấp vào nút Run (Production) (Chạy (Phát hành công khai)).
- Lặp lại các bước trước đó để thêm bản ghi vào các bảng khác.
Cách nhanh chóng xác minh dữ liệu đã được thêm:
- Quay lại
schema.gql
, hãy nhấp vào nút Read data (Đọc dữ liệu) phía trên khai báo loại. - Trong tệp
<type>_read.gql
thu được, chẳng hạn nhưProduct_read.gql
, hãy nhấp vào nút Run (Production) (Chạy (Sản xuất)) để thực thi truy vấn.
Tìm hiểu thêm về các đột biến Data Connect trong tài liệu
Luồng cục bộ: Tạo SDK
Lược đồ và các thao tác của trình kết nối được đồng bộ hoá cục bộ.
Giờ đây, bạn có thể sử dụng tiện ích VS Code để tạo SDK ứng dụng nhằm bắt đầu triển khai các lệnh gọi đến truy vấn và đột biến trong các ứng dụng iOS, Android, web và Flutter.
- Trong giao diện người dùng của tiện ích, hãy nhấp vào nút Thêm SDK vào ứng dụng.
Trong hộp thoại xuất hiện, hãy chọn một thư mục chứa mã cho ứng dụng của bạn. Mã SDK Data Connect sẽ được tạo và lưu ở đó.
Chọn nền tảng ứng dụng của bạn, sau đó lưu ý rằng mã SDK sẽ được tạo ngay trong thư mục bạn chọn.
Luồng cục bộ: Sử dụng SDK để gọi truy vấn từ một ứng dụng
Trước đó, bạn đã triển khai giản đồ và các thao tác trong bảng điều khiển Firebase.
Để gọi các thao tác từ ứng dụng, bạn có thể sử dụng SDK mà Data Connect đã tạo để triển khai một lệnh gọi đến truy vấn ListMovies
của bạn.
Web
- Thêm Firebase vào ứng dụng web của bạn.
Trong tệp chính của ứng dụng React:
- nhập SDK đã tạo
- gọi các phương thức Data Connect.
import React from 'react'; import ReactDOM from 'react-dom/client'; // Generated queries. // Update as needed with the path to your generated SDK. import { listMovies, ListMoviesData } from '@movie-app/movies'; function App() { const [movies, setMovies] = useState<ListMoviesData['movies']>([]); useEffect(() => { listMovies.then(res => setMovies(res.data)); }, []); return ( movies.map(movie => <h1>{movie.title}</h1>); ); } const root = ReactDOM.createRoot(document.getElementById('root')); root.render(<App />);
Swift
- Thêm Firebase vào ứng dụng iOS của bạn.
Để sử dụng SDK đã tạo, hãy định cấu hình SDK đó làm phần phụ thuộc trong Xcode.
Trong thanh điều hướng trên cùng của Xcode, hãy chọn File (Tệp) > Add Package Dependencies (Thêm các phần phụ thuộc của gói) > Add Local (Thêm cục bộ), rồi chọn thư mục chứa
Package.swift
đã tạo.Trong uỷ quyền chính của ứng dụng:
- nhập SDK đã tạo
- gọi các phương thức Data Connect.
import SwiftUI import FirebaseDataConnect // Generated queries. // Update as needed with the package name of your generated SDK. import <CONNECTOR-PACKAGE-NAME> let connector = DataConnect.moviesConnector struct ListMovieView: View { @StateObject private var queryRef = connector.listMovies.ref() var body: some View { VStack { Button { Task { do { try await refresh() } catch { print("Failed to refresh: \(error)") } } } label: { Text("Refresh") } // use the query results in a view ForEach(queryRef.data?.movies ?? []) { movie in Text(movie.title) } } } @MainActor func refresh() async throws { _ = try await queryRef.execute() } struct ContentView_Previews: PreviewProvider { static var previews: some View { ListMovieView() } }
Kotlin Android
- Thêm Firebase vào ứng dụng Android của bạn.
Để sử dụng SDK đã tạo, hãy định cấu hình Data Connect làm phần phụ thuộc trong Gradle.
Cập nhật
plugins
vàdependencies
trongapp/build.gradle.kts
.plugins { // Use whichever versions of these dependencies suit your application. // The versions shown here were the latest as of March 14, 2025. // Note, however, that the version of kotlin("plugin.serialization") must, // in general, match the version of kotlin("android"). id("com.android.application") version "8.9.0" id("com.google.gms.google-services") version "4.4.2" val kotlinVersion = "2.1.10" kotlin("android") version kotlinVersion kotlin("plugin.serialization") version kotlinVersion } dependencies { // Use whichever versions of these dependencies suit your application. // The versions shown here were the latest versions as of March 14, 2025. implementation("com.google.firebase:firebase-dataconnect:16.0.0-beta04") implementation("org.jetbrains.kotlinx:kotlinx-coroutines-core:1.10.1") implementation("org.jetbrains.kotlinx:kotlinx-serialization-core:1.7.3") // These dependencies are not strictly required, but will very likely be used // when writing modern Android applications. implementation("org.jetbrains.kotlinx:kotlinx-coroutines-android:1.9.0") implementation("androidx.appcompat:appcompat:1.7.0") implementation("androidx.activity:activity-ktx:1.10.1") implementation("androidx.lifecycle:lifecycle-viewmodel-ktx:2.8.7") implementation("com.google.android.material:material:1.12.0") }
Trong hoạt động chính của ứng dụng:
- nhập SDK đã tạo
- gọi các phương thức Data Connect.
import android.os.Bundle import android.widget.TextView import androidx.appcompat.app.AppCompatActivity import androidx.lifecycle.Lifecycle import androidx.lifecycle.lifecycleScope import androidx.lifecycle.repeatOnLifecycle import kotlinx.coroutines.launch private val connector = com.myapplication.MoviesConnector.instance class MainActivity : AppCompatActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContentView(R.layout.activity_main) val textView: TextView = findViewById(R.id.text_view) lifecycleScope.launch { lifecycle.repeatOnLifecycle(Lifecycle.State.STARTED) { val result = connector.listMovies.runCatching { execute { } } val newTextViewText = result.fold( onSuccess = { val titles = it.data.movies.map { it.title } "${titles.size} movies: " + titles.joinToString(", ") }, onFailure = { "ERROR: ${it.message}" } ) textView.text = newTextViewText } } } }
Flutter
- Thêm Firebase vào ứng dụng Flutter.
- Cài đặt CLI flutterfire
dart pub global activate flutterfire_cli
. - Chạy
flutterfire configure
. - Trong hàm chính của ứng dụng:
- nhập SDK đã tạo
- gọi các phương thức Data Connect.
import 'package:firebase_core/firebase_core.dart';
import 'package:flutter/material.dart';
import 'firebase_options.dart';
// Generated queries.
// Update as needed with the path to your generated SDK
import 'movies_connector/movies.dart';
void main() async {
WidgetsFlutterBinding.ensureInitialized();
await Firebase.initializeApp(
options: DefaultFirebaseOptions.currentPlatform,
);
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
body: Column(children: [
ConstrainedBox(
constraints: const BoxConstraints(maxHeight: 200),
child: FutureBuilder(
future: MoviesConnector.instance.listMovies().execute(),
builder: (context, snapshot) {
if (snapshot.connectionState == ConnectionState.done) {
return ListView.builder(
scrollDirection: Axis.vertical,
itemBuilder: (context, index) => Card(
child: Text(
snapshot.data!.data.movies[index].title,
)),
itemCount: snapshot.data!.data.movies.length,
);
}
return const CircularProgressIndicator();
}),
)
])));
}
}
Các bước tiếp theo
Xem lại dự án đã triển khai và khám phá các công cụ khác:
- Thêm dữ liệu vào cơ sở dữ liệu, kiểm tra và sửa đổi giản đồ, đồng thời theo dõi dịch vụ Data Connect trong bảng điều khiển Firebase.
Xem thêm thông tin trong tài liệu. Ví dụ: vì bạn đã hoàn tất hướng dẫn bắt đầu nhanh:
- Khám phá thêm các công cụ hỗ trợ AI và hướng dẫn để giúp bạn tạo lược đồ, truy vấn và đột biến. Hướng dẫn về tính năng hỗ trợ AI đề cập đến cách thiết lập và sử dụng máy chủ MCP của chúng tôi với các IDE và các phương pháp hay nhất để viết câu lệnh.
- Tìm hiểu thêm về việc phát triển lược đồ, truy vấn và đột biến
- Tìm hiểu về cách tạo SDK máy khách và gọi các truy vấn cũng như đột biến từ mã máy khách cho web, Android, iOS và Flutter.