SoFunction
Updated on 2025-03-11

Flutter uses socketIo to achieve real-time communication

1. NodeJS

First, use Node to create a server, let Node obtain and store all received data. A specific operation is performed on the data by writing an interface in Node.

2. SocketIo

It is an event-driven real-time communication library that can establish persistent connections between the browser and the server, making two-way real-time communication possible. It provides developers with a simple and easy-to-use API that supports real-time communication across platforms and across browsers.

3. Server-side implementation

3.1 Express

If you don’t have a basic foundation, you can take a look at Node to facilitate the learning of subsequent code. It is mainly used to render data from each interface and display front-end pages.

var express=require('express');
var app=express();
var server = require('http').Server(app);
var io = require('')(server);
('view engine','ejs');
(('public'));
('/',function(req,res){
	('index');
})
(8000);
// Configuration('connection', function (socket) {
	('Make a connection');
	('toServer',function(data){
	(data);
	('toClient',data);
})
});

4 Flutter

@override
void initState() {
 = ('http://192.168.0.11:3000?roomid=1', <String, dynamic>{
	'transports': ['websocket'],
	'extraHeaders': {'foo': 'bar'} // optional
});
// Methods that trigger when establishing a connection('connect', (_) {
print('connect');
('toServer', 'test'); //Send a message to the server});
// Method to trigger when receiving information('toClient', (data){
setState(() {
this._messageList.add(
	{ 
		"server":true,
		'title':data
	}
);
});
});
// Methods to trigger when disconnecting('disconnect', (_) => print('disconnect'));
();
}

Summarize

This is the end of this article about Flutter using socketIo to achieve real-time communication. For more related Flutter socketIo real-time communication content, please search for my previous articles or continue browsing the related articles below. I hope everyone will support me in the future!