Flutter WebSocket管理插件websocket_manager_safe的使用

Flutter WebSocket管理插件websocket_manager_safe的使用

说明

请注意,此仓库已不再由ENGAPP维护。它已被转移到Kunlatek进行维护。有关该插件的问题应在此报告: https://github.com/kunlatek/flutter_websocket_manager_plugin

简介

Websocket Manager 是一个支持Android和iOS的WebSocket插件。该插件基于两个不同的原生库:iOS上的Starscream和Android上的okHttp。

该插件的创建是为了在屏幕锁定或应用程序处于后台时保持WebSocket连接活跃,而Flutter自带的WebSocket在这些情况下无法保持连接。

如何安装

Android

仅当服务器没有SSL/TLS时才需要此配置

由于Android P默认阻止HTTP,因此有许多配置方式。一种方法是明确表示接受某些主机的明文传输。

  1. 创建res/xml/network_security_config.xml文件,内容如下:
<?xml version="1.0" encoding="utf-8"?>
<network-security-config>
    <domain-config cleartextTrafficPermitted="true">
        <domain includeSubdomains="true">your_domain</domain>
    </domain-config>
</network-security-config>
  1. 在你的manifest文件中引用此文件(为了加分项,只在测试manifest中添加):
<application
    android:networkSecurityConfig="@xml/network_security_config"
    android:label="@string/app_name"
    android:theme="@style/AppTheme">
    <activity android:name="(...)
</application>
iOS

无需任何配置

示例

int messageNum = 0;

// 配置WebSocket URL
final socket = WebsocketManager('wss://echo.websocket.org');

// 监听关闭消息
socket.onClose((dynamic message) {
    print('close');
});

// 监听服务器消息
socket.onMessage((dynamic message) {
    print('recv: $message');
    
    // 如果接收到第10条消息,则关闭连接
    if (messageNum == 10) {
        socket.close();
    } else {
        messageNum += 1;
        final String msg = '$messageNum: ${DateTime.now()}';
        print('send: $msg');
        socket.send(msg);
    }
});

// 连接到服务器
socket.connect();

更多关于Flutter WebSocket管理插件websocket_manager_safe的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter WebSocket管理插件websocket_manager_safe的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


websocket_manager_safe 是一个用于在 Flutter 中管理 WebSocket 连接的插件。它提供了一个简单且安全的接口来处理 WebSocket 连接、消息发送和接收等操作。下面是如何使用 websocket_manager_safe 插件的基本指南。

1. 添加依赖

首先,你需要在 pubspec.yaml 文件中添加 websocket_manager_safe 插件的依赖:

dependencies:
  websocket_manager_safe: ^1.0.0

然后运行 flutter pub get 来安装依赖。

2. 导入包

在你的 Dart 文件中导入 websocket_manager_safe 包:

import 'package:websocket_manager_safe/websocket_manager_safe.dart';

3. 创建 WebSocket 连接

使用 WebSocketManagerSafe 类来创建和管理 WebSocket 连接。

class WebSocketService {
  late WebSocketManagerSafe _webSocketManager;

  void connect(String url) {
    _webSocketManager = WebSocketManagerSafe(url: url);

    _webSocketManager.onOpen(() {
      print('WebSocket connection opened');
    });

    _webSocketManager.onMessage((message) {
      print('Received message: $message');
    });

    _webSocketManager.onClose((code, reason) {
      print('WebSocket connection closed: $code, $reason');
    });

    _webSocketManager.onError((error) {
      print('WebSocket error: $error');
    });

    _webSocketManager.connect();
  }

  void sendMessage(String message) {
    _webSocketManager.send(message);
  }

  void disconnect() {
    _webSocketManager.close();
  }
}

4. 使用 WebSocket 服务

在你的 Flutter 应用中使用 WebSocketService 类来管理 WebSocket 连接。

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  late WebSocketService _webSocketService;

  @override
  void initState() {
    super.initState();
    _webSocketService = WebSocketService();
    _webSocketService.connect('ws://your.websocket.url');
  }

  @override
  void dispose() {
    _webSocketService.disconnect();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('WebSocket Example'),
        ),
        body: Center(
          child: ElevatedButton(
            onPressed: () {
              _webSocketService.sendMessage('Hello, WebSocket!');
            },
            child: Text('Send Message'),
          ),
        ),
      ),
    );
  }
}

5. 处理 WebSocket 事件

在上面的示例中,你已经看到了如何处理 WebSocket 的各种事件,如 onOpenonMessageonCloseonError。你可以根据需要在这些回调中执行特定的操作。

6. 断开连接

在不再需要 WebSocket 连接时,调用 disconnect 方法来关闭连接:

_webSocketService.disconnect();
回到顶部