파이어베이스에서 데이터를 플러터에서 캐싱[ sqflite 패키지 로컬 스토리지 이용 ]

 

Firebase에서 데이터를 플러터 앱에서 캐싱하는 방법과 Firebase에서 데이터가 업데이트되거나 삭제될 때 캐싱을 다루는 방법에 대해 알아보겠습니다.

이를 위해서 우리는 sqflite 패키지를 사용하여 로컬 데이터베이스를 구현하고, Firebase와의 동기화를 처리하는 방법을 살펴볼 것입니다.

1. 패키지 설치

먼저 firebase_core, firebase_database, sqflite, path 등의 패키지를 설치해야 합니다.

pubspec.yaml 파일에 다음과 같이 추가합니다

dependencies:
  flutter:
    sdk: flutter
  firebase_core: ^2.5.2
  firebase_database: ^9.1.0
  sqflite: ^2.2.1
  path: ^1.8.3

2. Firebase 초기화

Firebase를 초기화하는 코드를 main.dart 파일에 추가합니다

import 'package:flutter/material.dart';
import 'package:firebase_core/firebase_core.dart';
import 'firebase_options.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp(
    options: DefaultFirebaseOptions.currentPlatform,
  );
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(),
    );
  }
}

3. Firebase 데이터 읽기

Firebase Realtime Database에서 데이터를 읽고 로컬 데이터베이스에 캐싱하는 방법을 살펴보겠습니다

import 'package:flutter/material.dart';
import 'package:firebase_database/firebase_database.dart';
import 'package:sqflite/sqflite.dart';
import 'package:path/path.dart';

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  final databaseReference = FirebaseDatabase.instance.reference();
  Database? db;

  @override
  void initState() {
    super.initState();
    initDb();
    syncData();
  }

  Future<void> initDb() async {
    var databasesPath = await getDatabasesPath();
    String path = join(databasesPath, 'demo.db');

    db = await openDatabase(path, version: 1, onCreate: (Database db, int version) async {
      await db.execute('CREATE TABLE Items (id TEXT PRIMARY KEY, value TEXT)');
    });
  }

  Future<void> syncData() async {
    databaseReference.child('items').onValue.listen((event) async {
      var snapshot = event.snapshot;
      Map<dynamic, dynamic>? items = snapshot.value as Map<dynamic, dynamic>?;

      if (items != null) {
        await db!.transaction((txn) async {
          await txn.delete('Items');
          items.forEach((key, value) async {
            await txn.insert('Items', {'id': key, 'value': value});
          });
        });
      }
    });
  }

  Future<List<Map<String, dynamic>>> getItemsFromCache() async {
    return await db!.query('Items');
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Flutter Demo Home Page'),
      ),
      body: FutureBuilder(
        future: getItemsFromCache(),
        builder: (context, snapshot) {
          if (snapshot.connectionState == ConnectionState.waiting) {
            return CircularProgressIndicator();
          } else if (snapshot.hasError) {
            return Text('Error: ${snapshot.error}');
          } else if (snapshot.hasData) {
            List<Map<String, dynamic>> items = snapshot.data as List<Map<String, dynamic>>;
            return ListView.builder(
              itemCount: items.length,
              itemBuilder: (context, index) {
                return ListTile(
                  title: Text(items[index]['value']),
                );
              },
            );
          } else {
            return Text('No data');
          }
        },
      ),
    );
  }
}

4. 데이터 동기화 및 삭제 처리

위 코드에서는 Firebase Realtime Database에서 데이터를 읽어올 때마다 syncData 함수가 호출되어 로컬 데이터베이스를 업데이트합니다. Firebase의 데이터를 로컬 DB에 저장하여 캐시 역할을 합니다.

Firebase 데이터가 변경되거나 삭제될 때도 해당 이벤트가 트리거되어 로컬 DB에 반영됩니다.

5. 데이터 갱신 반영하기

Firebase에서 데이터가 업데이트되거나 삭제될 때 로컬 데이터베이스도 자동으로 갱신됩니다.

onValue 리스너를 통해 데이터가 변경될 때마다 로컬 DB를 업데이트하기 때문입니다.

이 방법으로 실시간으로 데이터 동기화가 가능합니다.

이제 플러터 앱이 Firebase와 동기화된 데이터를 로컬에 캐싱하고, Firebase에서 데이터 변경 시 이를 반영할 수 있게 되었습니다.

 

Starting Google Play App Distribution! "Tester Share" for Recruiting 20 Testers for a Closed Test.

Tester Share [테스터쉐어] - Google Play 앱