Flutter直播功能插件ditto_live的使用

简介

Ditto Flutter SDK 是一个边缘同步平台，允许设备在有或没有互联网连接的情况下同步数据。本文将介绍如何在Flutter项目中集成和使用ditto_live插件来实现直播功能。

更多信息，请访问 Ditto 官方文档。

支持的平台

使用前准备

• 需要一个Ditto Portal账户，并获取App ID和Playground Token。注册Ditto Portal账户

安装

在项目的根目录下运行以下命令：

flutter pub add ditto_live

移动应用权限

为了使应用程序能够访问设备级别的功能，需要设置特定平台的权限。这将允许 Ditto 使用 BLE、LAN 和 P2P Wi-Fi 建立点对点连接并在没有互联网连接的情况下同步数据。

iOS 权限

在 ios/Runner/Info.plist 文件中添加以下权限：

<key>NSBluetoothAlwaysUsageDescription</key>
<string>Uses Bluetooth to connect and sync with nearby devices</string>
<key>NSBluetoothPeripheralUsageDescription</key>
<string>Uses Bluetooth to connect and sync with nearby devices</string>
<key>NSLocalNetworkUsageDescription</key>
<string>Uses WiFi to connect and sync with nearby devices</string>
<key>NSBonjourServices</key>

Android 权限

在 android/app/src/main/AndroidManifest.xml 文件中添加以下权限：

<uses-permission android:name="android.permission.BLUETOOTH"
    android:maxSdkVersion="30" />
<uses-permission android:name="android.permission.BLUETOOTH_ADMIN"
    android:maxSdkVersion="30" />
<uses-permission android:name="android.permission.BLUETOOTH_ADVERTISE"
    tools:targetApi="s" />
<uses-permission android:name="android.permission.BLUETOOTH_CONNECT"
    tools:targetApi="s" />
<uses-permission android:name="android.permission.BLUETOOTH_SCAN"
    android:usesPermissionFlags="neverForLocation"
    tools:targetApi="s" />
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION"
    android:maxSdkVersion="32" />
<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION"
    android:maxSdkVersion="30" />
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.ACCESS_WIFI_STATE" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
<uses-permission android:name="android.permission.CHANGE_NETWORK_STATE" />
<uses-permission android:name="android.permission.CHANGE_WIFI_MULTICAST_STATE" />
<uses-permission android:name="android.permission.CHANGE_WIFI_STATE" />
<uses-permission android:name="android.permission.NEARBY_WIFI_DEVICES"
    android:usesPermissionFlags="neverForLocation"
    tools:targetApi="tiramisu" />

使用示例

初始化

首先，创建一个 Ditto 实例。这是所有 Ditto 相关功能的主要入口点。

final identity = await OnlinePlaygroundIdentity.create(
    appId: "YOUR_APP_ID", // 替换为你的具体ID
    token: "YOUR_PLAYGROUND_TOKEN", // 替换为你的具体Token
);
final ditto = await Ditto.open(identity);

await ditto.startSync();

执行本地数据存储查询

使用 ditto.store.execute(...) 执行查询：

final results = await ditto.store.execute("SELECT * FROM users");

for (final result in results) {
    print("I got ${result.value}");
}

你也可以使用 execute 插入或修改数据：

final result = await ditto.store.execute(
    "INSERT INTO users DOCUMENTS (:user1)",
    arguments: {
        "user1": {
            "name": "John",
            "age": 123,
        },
    },
);

expect(result.mutatedDocumentIDs, hasLength(1));

更多关于编写查询的信息，请参阅 Ditto Query Language。

观察本地数据存储的变化

你可以使用 StoreObserver 监听本地数据库的变化：

final observer = await ditto.store.registerObserver(
    "SELECT * FROM users",
    onChange: (queryResult) => print("we got some changes"),
);

StoreObserver 还提供了一个 Stream，便于在 Flutter 中使用：

final observer = await ditto.store.registerObserver("SELECT * FROM users");

return StreamBuilder(
    stream: observer.stream,
    builder: (context, snapshot) {
        final items = snapshot.data!.items;
        return Text("We have ${items.length} items");
    },
);

同步数据

为了与其他设备同步数据，你需要创建一个 SyncSubscription：

final subscription = await ditto.sync.registerSubscription("SELECT * FROM users");

// 当完成时取消订阅
await subscription.cancel();

更多信息，请访问 Ditto 官方文档。

示例代码

以下是一个完整的示例，展示了如何在 Flutter 应用程序中使用 ditto_live 插件：

import 'package:ditto_live/ditto_live.dart';
import 'package:flutter/material.dart';
import 'package:permission_handler/permission_handler.dart';

const appID = "caf9e870-d416-4b1c-9ab4-fb6e8319dd25";
const token = "cb639c76-5633-44dd-ad28-03a5a43f092e";

Future<void> main() async {
  WidgetsFlutterBinding.ensureInitialized();

  runApp(const MaterialApp(
    debugShowCheckedModeBanner: false,
    home: DittoExample(),
  ));
}

class DittoExample extends StatefulWidget {
  const DittoExample({super.key});

  [@override](/user/override)
  State<DittoExample> createState() => _DittoExampleState();
}

class _DittoExampleState extends State<DittoExample> {
  Ditto? _ditto;

  [@override](/user/override)
  void initState() {
    super.initState();
    _initDitto();
  }

  Future<void> _initDitto() async {
    await [
      Permission.bluetoothConnect,
      Permission.bluetoothAdvertise,
      Permission.nearbyWifiDevices,
      Permission.bluetoothScan
    ].request();

    final identity = await OnlinePlaygroundIdentity.create(
      appId: appID,
      token: token,
    );

    final ditto = await Ditto.open(identity);

    ditto.startSync();

    setState(() => _ditto = ditto);
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    final ditto = _ditto;

    if (ditto == null) return _loading;

    return Scaffold(
      appBar: AppBar(
        title: const Text("Ditto Tasks"),
      ),
      body: Center(
        child: ElevatedButton(
          onPressed: () async {
            final results = await ditto.store.execute("SELECT * FROM users");
            for (final result in results) {
              print("I got ${result.value}");
            }
          },
          child: const Text("Fetch Users"),
        ),
      ),
    );
  }

  Widget get _loading => Scaffold(
        appBar: AppBar(title: const Text("Ditto Tasks")),
        body: const Center(
          child: CircularProgressIndicator(),
        ),
      );
}