Flutter使用socketIo實現(xiàn)實時通訊
更新時間：2024年07月04日 08:33:03 作者：小猿_00
本文主要介紹了Flutter使用socketIo實現(xiàn)實時通訊,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧
1. NodeJS
首先使用Node創(chuàng)建一個服務端，讓Node來對所有接受到的數(shù)據(jù)進行一個獲取和存儲已經(jīng)轉(zhuǎn)發(fā)。通過在Node中編寫接口來對數(shù)據(jù)進行一個具體的操作。
2. SocketIo
Socket.io 是一個基于事件驅(qū)動的實時通信庫，可以在瀏覽器和服務器之間建立持久連接，使得雙向?qū)崟r通信成為可能。它為開發(fā)者提供了簡單易用的 API，支持跨平臺、跨瀏覽器的實時通信。
3. 服務端實現(xiàn)
3.1 Express
沒有基礎(chǔ)的去看一下Node，方便后續(xù)代碼的學習。主要用來對各個接口的數(shù)據(jù)進行渲染和前端頁面的展示。
var express=require('express');
var app=express();
var server = require('http').Server(app);
var io = require('socket.io')(server);
app.set('view engine','ejs');
app.use(express.static('public'));
app.get('/',function(req,res){
res.render('index');
})
server.listen(8000);
//socket.io 配置
io.on('connection', function (socket) {
console.log('建立連接');
socket.on('toServer',function(data){
console.log(data);
socket.emit('toClient',data);
})
});
4 Flutter
@override
void initState() {
this.socket = IO.io('http://192.168.0.11:3000?roomid=1', <String, dynamic>{
'transports': ['websocket'],
'extraHeaders': {'foo': 'bar'} // optional
});
//建立連接的時候觸發(fā)的方法
socket.on('connect', (_) {
print('connect');
socket.emit('toServer', 'test'); //給服務器發(fā)送消息
});
//接收到信息的時候觸發(fā)的方法
socket.on('toClient', (data){
setState(() {
this._messageList.add(
{
"server":true,
'title':data
}
);
});
});
//斷開連接的時候觸發(fā)的方法
socket.on('disconnect', (_) => print('disconnect'));
super.initState();
}
總結(jié)
到此這篇關(guān)于Flutter使用socketIo實現(xiàn)實時通訊的文章就介紹到這了,更多相關(guān)Flutter socketIo實時通訊內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
flutter中有默認的Route組件，叫做MaterialPageRoute，但是MaterialPageRoute太普通了，如果我們想要做點不同的跳轉(zhuǎn)特效應該如何處理呢？一起來看看吧2023-04-04
Android編程實現(xiàn)輸入框動態(tài)自動提示功能
這篇文章主要介紹了Android編程實現(xiàn)輸入框動態(tài)自動提示功能,結(jié)合實例形式分析了AutoCompleteTextView相關(guān)使用技巧,需要的朋友可以參考下2017-03-03
android教程viewpager自動循環(huán)和手動循環(huán)
這篇文章主要介紹了android的viewpager自動循環(huán)和手動循環(huán)示例,需要的朋友可以參考下2014-02-02
這篇文章主要介紹了Android rom解包打包工具的相關(guān)資料,對rom解包打包相關(guān)知識感興趣的朋友可以參考下2016-01-01
在AndroidStudio中開發(fā)版本控制，除了Git就是SVN，和Eclipse不同，Android Studio沒有提供單獨的插件，只能和SVN客戶端關(guān)聯(lián)使用，這篇文章主要介紹了Android?studio使用SVN的方法,需要的朋友可以參考下2022-09-09
Android監(jiān)聽應用前臺的實現(xiàn)方案
在 Android 應用開發(fā)中,監(jiān)聽應用前臺狀態(tài)是一項核心功能,對于優(yōu)化用戶體驗、提升資源管理效率以及實現(xiàn)系統(tǒng)級功能具有重要意義,以下將從技術(shù)實現(xiàn)、業(yè)務場景和系統(tǒng)特性等多個維度,深入探討幾種主流的實現(xiàn)方案,需要的朋友可以參考下2025-02-02
這篇文章主要介紹了Android實現(xiàn)越界回彈效果，支持水平和垂直方向，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-04-04
本篇文章給大家通過代碼實例教學Android中實現(xiàn)Redux的方法，有需要的朋友跟著參考下吧。2018-01-01
android中Bitmap用法(顯示,保存,縮放,旋轉(zhuǎn))實例分析
這篇文章主要介紹了android中Bitmap用法,以實例形式較為詳細的分析了android中Bitmap操作圖片的顯示、保存、縮放、旋轉(zhuǎn)等相關(guān)技巧,需要的朋友可以參考下2015-09-09
下面小編就為大家?guī)硪黄獪\談Android Studio JNI生成so庫。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-04-04