Flutter对等网络通信插件sb_peerdart的使用

Flutter对等网络通信插件sb_peerdart的使用

简介

PeerDart 提供了一个基于 WebRTC 构建的完整、可配置且易于使用的点对点 API。它支持数据通道和媒体流。

PeerDart 的设计与 peerjs 类似。更多文档可以在 这里 找到。

状态

• ✅ Alpha: 正在积极开发中
• ✅ Public Alpha: 已准备好进行测试。但是请注意，可能会有 bug 和缺失的功能。
• ❌ Public Beta: 稳定版。此版本不会有任何破坏性的更改，但可能仍有 bug。
• ❌ Public: 生产就绪版

在线示例

这是一个使用了媒体和数据连接的应用程序示例：在线示例

设置

首先，我们需要创建一个 Peer 对象。

final Peer peer = Peer("pick-an-id");
// 您可以选择自己的 ID 或者省略 ID 来从服务器获取随机 ID。

数据连接

连接

const conn = peer.connect("another-peers-id");

conn.on("open").listen((name) {
    conn.send("hi!");
});

接收

peer.on<DataConnection>("connection").listen((connection) {

    // 当连接关闭时触发
    connection.on("close").listen((event) {
        setState(() {
            connected = false;
        });
    });

    // 处理接收到的数据
    connection.on("data").listen((data) {
        print('Received data: $data');
    });
});

媒体调用

发起呼叫

final mediaStream = await navigator.mediaDevices
        .getUserMedia({"video": true, "audio": false});

    final conn = peer.call("peerId", mediaStream);

    // 处理接收到的媒体流
    conn.on<MediaStream>("stream").listen((event) {
      _remoteRenderer.srcObject = event;
      _localRenderer.srcObject = mediaStream;

      setState(() {
        inCall = true;
      });
    });
});

应答呼叫

peer.on<MediaConnection>("call").listen((call) async {
    final mediaStream = await navigator.mediaDevices
        .getUserMedia({"video": true, "audio": false});

    call.answer(mediaStream);

    // 当连接关闭时触发
    call.on("close").listen((event) {
        setState(() {
            inCall = false;
        });
    });

    // 处理接收到的媒体流
    call.on<MediaStream>("stream").listen((event) {
        _localRenderer.srcObject = mediaStream;
        _remoteRenderer.srcObject = event;

        setState(() {
            inCall = true;
        });
    });
});

更多示例

更多示例可以查看 GitHub

支持

该库支持移动端和浏览器（已通过 Chrome 测试）。

许可证

PeerDart 是在 MIT 许可证下发布的。

示例代码

以下是完整的示例代码：

import 'package:example/call_example.dart';
import 'package:example/data_connection_example.dart';
import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'PeerDart Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      initialRoute: "/",
      routes: {
        '/': (context) => const MyHomePage(title: "PeerDart Demo"),
        '/callExample': (context) => const CallExample(),
        '/dataConnectionExample': (context) => const DataConnectionExample(),
      },
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});

  final String title;

  [@override](/user/override)
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  void onPressCall() async {
    await Navigator.of(context).pushNamed("/callExample");
  }

  void onPressData() async {
    await Navigator.of(context).pushNamed("/dataConnectionExample");
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Row(
          mainAxisAlignment: MainAxisAlignment.spaceAround,
          children: [
            ElevatedButton(
              onPressed: onPressCall,
              child: const Text("Navigate to call example"),
            ),
            ElevatedButton(
              onPressed: onPressData,
              child: const Text("Navigate to data example"),
            ),
          ],
        ),
      ),
    );
  }
}