import 'dart:convert';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:web_socket_channel/web_socket_channel.dart';
void main() {
runApp(const MyApp());
}
//消息状态
class MessageState{
String type;
String? content;
int? userId;
int? messageCount;
static List<MessageState> states=[];
MessageState({required this.type, this.content, this.userId, this.messageCount});
}
//消息事件
class MessageEvent{
String message;
MessageEvent({required this.message});
}
//接收消息事件
class ReceiveMessageEvent extends MessageEvent{
ReceiveMessageEvent({required super.message});
}
//发送消息事件
class SendMessageEvent extends MessageEvent{
SendMessageEvent({required super.message});
}
class MessageBloc extends Bloc<MessageEvent,MessageState>{
MessageBloc() : super(MessageState(type: 'init')) {
//1. 初始化连接
WebSocketChannel channel = WebSocketChannel.connect(Uri.parse('ws://localhost:1888/chat'));
//2. 监听消息
channel.stream.listen((message) {
//2.1 将监听到的消息通过event通知bloc
add(ReceiveMessageEvent(message: message));
});
//3. 发送消息事件注册
on<SendMessageEvent>((event, emit) {
channel.sink.add(event.message);
});
//4. 接收消息事件注册
on<ReceiveMessageEvent>((event, emit) {
var msg = jsonDecode(event.message);
if(msg['type']=='system') {
emit(MessageState(type: msg['type'], content: msg['content']));
} else if(msg['type']=='user') {
MessageState state=MessageState(type: msg['type'], userId: msg['userId'],content: msg['content'], messageCount: msg['messageCount']);
emit(state);
MessageState.states.add(state);
}
});
}
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Message App',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: BlocProvider(
create: (context) => MessageBloc(),
child: MessagePage(),
)
);
}
}
class MessagePage extends StatelessWidget {
final TextEditingController msgInputController=TextEditingController();
MessagePage({super.key});
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('Message App'),
),
body: BlocBuilder<MessageBloc, MessageState>(
builder: (context, state) {
if (state.type=='init') {
return const CircularProgressIndicator();
}
return buildResult(context, state);
},
),
);
}
Widget buildResult(BuildContext context, MessageState state){
return Column(
children: [
// 发送消息
Row(
children: [
Expanded(child: TextField(controller: msgInputController,maxLines: 3,minLines: 1,)),
ElevatedButton(onPressed: () {
context.read<MessageBloc>().add(SendMessageEvent(message: msgInputController.text));
}, child: const Text("发送")),
]
),
// 系统消息栏红点
Container(
alignment: Alignment.centerRight,
padding: const EdgeInsets.all(16),
child: state.type == 'system' ? Text("${state.content} ") : Container(),
),
// 用户列表
Expanded(
child: ListView.builder(
itemCount: MessageState.states.length,
itemBuilder: (context, index) {
return ListTile(
title: Text('User ${MessageState.states[index].userId}'),
subtitle: Text("${MessageState.states[index].content}"),
trailing: Text('${MessageState.states[index].messageCount}', style: const TextStyle(color: Colors.red))
);
},
),
),
],
);
}
}
java websocket实现
import java.io.IOException;
import java.util.concurrent.TimeUnit;
import org.springframework.stereotype.Component;
import org.springframework.web.socket.TextMessage;
import org.springframework.web.socket.WebSocketSession;
import org.springframework.web.socket.handler.TextWebSocketHandler;
@Component
public class MessageRouter extends TextWebSocketHandler{
@Override
public void afterConnectionEstablished(WebSocketSession session) throws Exception {
sendHello(session);
}
void sendHello(WebSocketSession session) {
new Thread(()->{
for(int i=0;i<100;i++) {
try {
JSONObject sj=new JSONObject();
sj.put("type", "system");
sj.put("content", "system content");
JSONObject uj=new JSONObject();
uj.put("type", "user");
uj.put("userId", 2010);
uj.put("messageCount",32);
uj.put("content", "聊天 content1");
session.sendMessage(new TextMessage(sj.toJSONString()));
session.sendMessage(new TextMessage(uj.toJSONString()));
uj.put("userId", 2110);
uj.put("content", "聊天 content2");
uj.put("messageCount",132);
session.sendMessage(new TextMessage(uj.toJSONString()));
sj.put("content", "system content2");
session.sendMessage(new TextMessage(sj.toJSONString()));
TimeUnit.SECONDS.sleep(2);
} catch (IOException e) {
e.printStackTrace();
} catch (InterruptedException e) {
e.printStackTrace();
}
}
}).start();
}
@Override
protected void handleTextMessage(WebSocketSession session, TextMessage message) throws Exception {}
}