Flutter WebSocket通信插件cereb_frontend_websocket_shadow_sdk的使用
Flutter WebSocket通信插件cereb_frontend_websocket_shadow_sdk的使用
使用方法
pubspec.yaml 配置
通过 Git 引入
在 pubspec.yaml
文件中添加以下依赖:
dependencies:
frontend_websocket_shadow_sdk:
git:
url: git://github.com/cereb-ai/frontend-websocket-shadow-sdk.git
ref: main
本地路径引入
如果已经下载了插件代码,可以通过本地路径引入:
dependencies:
frontend_websocket_shadow_sdk:
path: /path/to/frontend-websocket-shadow-sdk
客户端使用示例
以下是一个完整的客户端使用示例代码:
import 'package:frontend_websocket_shadow_sdk/frontend_websocket_shadow_sdk.dart';
import 'dart:developer';
void main() {
// 初始化 WebSocket 客户端
final client = CerebWebsocketShadowSdk(
url: "https://dev-api.cereb.ai/v1/ws/shadow_websocket", // WebSocket 服务地址
path: "/user/topic/shadow_websocket", // 路径
id: "A791716517900154M", // 客户端 ID
);
// 连接到 WebSocket 服务器
client.connect();
// 订阅主题
client.subscribe(
'/user/topic/shadow_websocket', // 主题路径
(StompFrame frame) { // 接收到消息后的回调函数
log(frame.body ?? 'null'); // 打印接收到的消息内容
},
);
// 发送消息
client.send('test');
// 取消订阅
client.unsubscribe('/user/topic/shadow_websocket');
// 断开连接
client.disconnect();
}
服务器配置
以下是服务器配置的示例图:
发送消息
以下是发送消息的示例图:
单元测试
运行单元测试:
flutter test
参考项目
可以参考以下项目了解更多用法:
发布项目
可以通过 GitHub Actions 自动化发布项目:
创建 Git Tag
发布版本时,创建并推送 Git Tag:
git tag -a v1.0.2 -m "release version 1.0.2"
git push origin v1.0.2
更多关于Flutter WebSocket通信插件cereb_frontend_websocket_shadow_sdk的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html
cereb_frontend_websocket_shadow_sdk
是一个用于 Flutter 的 WebSocket 通信插件,它可以帮助开发者轻松地在 Flutter 应用中实现 WebSocket 通信。以下是如何使用该插件的基本步骤:
1. 添加依赖
首先,你需要在 pubspec.yaml
文件中添加 cereb_frontend_websocket_shadow_sdk
插件的依赖:
dependencies:
flutter:
sdk: flutter
cereb_frontend_websocket_shadow_sdk: ^1.0.0 # 请使用最新版本
然后运行 flutter pub get
来获取依赖。
2. 导入插件
在你的 Dart 文件中导入插件:
import 'package:cereb_frontend_websocket_shadow_sdk/cereb_frontend_websocket_shadow_sdk.dart';
3. 初始化 WebSocket 连接
使用 WebSocketShadow
类来初始化 WebSocket 连接。你需要提供 WebSocket 服务器的 URL。
WebSocketShadow webSocketShadow = WebSocketShadow(
url: 'wss://your-websocket-server-url',
);
4. 连接 WebSocket
调用 connect
方法来建立 WebSocket 连接:
webSocketShadow.connect();
5. 监听消息
你可以通过 onMessage
流来监听从服务器接收到的消息:
webSocketShadow.onMessage.listen((message) {
print('Received message: $message');
});
6. 发送消息
使用 send
方法向服务器发送消息:
webSocketShadow.send('Hello, Server!');
7. 关闭连接
当你不再需要 WebSocket 连接时,可以调用 disconnect
方法来关闭连接:
webSocketShadow.disconnect();
8. 处理连接状态
你可以通过 onConnectionStateChanged
流来监听连接状态的变化:
webSocketShadow.onConnectionStateChanged.listen((state) {
print('Connection state: $state');
});
9. 错误处理
你可以通过 onError
流来处理 WebSocket 连接中的错误:
webSocketShadow.onError.listen((error) {
print('Error: $error');
});
10. 完整示例
以下是一个完整的示例,展示了如何使用 cereb_frontend_websocket_shadow_sdk
插件进行 WebSocket 通信:
import 'package:flutter/material.dart';
import 'package:cereb_frontend_websocket_shadow_sdk/cereb_frontend_websocket_shadow_sdk.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
[@override](/user/override)
Widget build(BuildContext context) {
return MaterialApp(
home: WebSocketExample(),
);
}
}
class WebSocketExample extends StatefulWidget {
[@override](/user/override)
_WebSocketExampleState createState() => _WebSocketExampleState();
}
class _WebSocketExampleState extends State<WebSocketExample> {
late WebSocketShadow webSocketShadow;
[@override](/user/override)
void initState() {
super.initState();
webSocketShadow = WebSocketShadow(
url: 'wss://your-websocket-server-url',
);
webSocketShadow.connect();
webSocketShadow.onMessage.listen((message) {
print('Received message: $message');
});
webSocketShadow.onConnectionStateChanged.listen((state) {
print('Connection state: $state');
});
webSocketShadow.onError.listen((error) {
print('Error: $error');
});
}
[@override](/user/override)
void dispose() {
webSocketShadow.disconnect();
super.dispose();
}
[@override](/user/override)
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('WebSocket Example'),
),
body: Center(
child: ElevatedButton(
onPressed: () {
webSocketShadow.send('Hello, Server!');
},
child: Text('Send Message'),
),
),
);
}
}