本樣例是基于即時通訊(簡稱 IM)服務(wù)實(shí)現(xiàn)的 OpenHarmony 應(yīng)用。
該應(yīng)用允許兩人或多人使用互聯(lián)網(wǎng)即時地傳遞文字、圖片、文件、語音、emoji 等訊息,可應(yīng)用于各類聊天場景,為人們帶來更加及時高效的通訊體驗(yàn)。
此外即時通訊平臺具備較高的定制化特點(diǎn),適用于多種行業(yè),客戶可以根據(jù)自己的需求來定制,實(shí)現(xiàn)即時通訊的內(nèi)部私有化。
設(shè)備端:
DAYU200(RK3568)開發(fā)板
OpenHarmony 3.1 release 系統(tǒng)
即時通訊實(shí)現(xiàn)原理
如下圖:
想要實(shí)現(xiàn)多個設(shè)備之間的無障礙即時通訊,需要多臺終端設(shè)備、終端應(yīng)用和服務(wù)器配合一起使用。
首先應(yīng)該將終端應(yīng)用安裝到終端設(shè)備上,用戶通過應(yīng)用向服務(wù)器申請注冊賬號。
隨后,用戶可以通過賬號進(jìn)行查找,添加其他好友,并向好友發(fā)送文字、圖片、文件、語音、emoji 等訊息。
用戶發(fā)送的訊息會先送達(dá)服務(wù)器,由服務(wù)器判斷其好友的狀態(tài)(離線/在線),然后選擇發(fā)送或者暫時緩存消息等操作。
最后,好友的終端應(yīng)用接收到消息。
實(shí)現(xiàn)即時通訊的設(shè)備需求:安裝應(yīng)用的終端設(shè)備、網(wǎng)絡(luò)環(huán)境和云端服務(wù)器。
前提條件:用戶將應(yīng)用安裝在終端設(shè)備上,并且擁有注冊賬號,且需要通訊的用戶也成功注冊了賬號并且添加了好友。
通訊原理:用戶在安裝了應(yīng)用的終端設(shè)備上編輯信息(文字、圖片、文件、語音、emoji 等),通過網(wǎng)絡(luò)將消息發(fā)送至云端服務(wù)器。
當(dāng)對方用戶在線時,云端服務(wù)器將把消息推送給對方用戶,對方用戶安裝了應(yīng)用的終端設(shè)備也將接收到信息。當(dāng)對方用戶不在線時,信息將被暫時緩存在云端服務(wù)器。
4步實(shí)現(xiàn)多人即時通訊
①通訊功能是通過 TCP 協(xié)議實(shí)現(xiàn)的,我們將通訊接口 connect()、send()、receive() 的實(shí)現(xiàn)放置在 CPP 文件中,通過 NAPI 的方式對 JS 層暴露接口。
如下:
connect():客戶端和服務(wù)器建立連接
send():消息發(fā)送功能
receive():消息接收功能
//建立TCP連接 if(connect(sock_cli,(structsockaddr*)&servaddr,sizeof(servaddr))0)?{ ????napi_create_int32(env,?0,?&result); }?else?{ ????napi_create_int32(env,?1,?&result); ????OH_LOG_INFO(LOG_APP,"C++?接收線程啟動"); ????startRec(); } ?//發(fā)送消息 if(send(sock_cli,?data,?strlen(data),0)?==?-1)?{ ????OH_LOG_INFO(LOG_APP,"zjf?==?send()?:?-1"); ????napi_create_int32(env,?0,?&result); }?else?{ ????OH_LOG_INFO(LOG_APP,"zjf?==?send()?:?!-1"); ????napi_create_int32(env,?1,?&result); } //接收消息 getStep(queue0,sharedMessage);?//取出一條消息 const?char?*c_s=sharedMessage.c_str();//換為char*形式處理 napi_value?result; napi_create_string_utf8(env,?c_s,?sharedMessage.length(),?&result); std::string().swap(sharedMessage);//清空字符串
②文件消息的發(fā)送與接收
文件轉(zhuǎn)發(fā)是即時通訊辦公場景下的重要功能。樣例中的文件功能支持文件消息的發(fā)送、接收和下載。 用戶通過點(diǎn)擊聊天界面的“+”按鈕,選擇“文件”按鈕,完成本地文件的瀏覽,隨后可以選擇是否將文件發(fā)送給好友。
這個功能的實(shí)現(xiàn)包括三個步驟:
文件的選擇
文件上傳到服務(wù)器
文件的接收
文件上傳:
//文件的選擇 letfile1={filename:this.$app.$def.uid+'-'+FILE_URL,name:'file',uri:FILE_URL,type:fileType} letfileId=this.guid(); letdata={}; letheader={"filename":this.selectedFileName.toString()}; //文件上傳到服務(wù)器 request.upload({url:"http://"+this.$app.$def.ip+"/file/fileUpload?fileSignature="+fileId+"&uid="+this.$app.$def.uid+"&fileType="+this.$app.$def.chatData[this.idx].unRead,header:header,method:"POST",files:[file1],data:[data]}).then((data)=>{ uploadTask=data; uploadTask.on('headerReceive',functioncallback(headers){ _this.socketSendFile(fileId,timestamp); }); }).catch((err)=>{ console.error('fileSelect=====Failedtorequesttheupload.Cause:'+JSON.stringify(err)); }) //文件的接收 letdownloadConfig={//下載參數(shù) url:fileUrl, header:{}, enableMetered:true, enableRoaming:true, filePath:'/data/storage/el2/base/haps/entry/files/'+downloadFileName, networkType:request.NETWORK_WIFI } request.download(downloadConfig,(err,data)=>{ if(err){ return; } downloadTask=data; //下載完成 downloadTask.on('complete',functioncallback(){ prompt.showToast({ message:'下載文件成功!', duration:1000, }); });③語音消息的發(fā)送與接收 用戶通過點(diǎn)擊聊天界面的錄制按鈕,完成語音的錄制,隨后可以選擇是否將語音發(fā)送給好友。
這個功能的實(shí)現(xiàn)包括三個步驟:
語音的錄制
語音上傳到服務(wù)器
語音的接收
圖片消息的發(fā)送與語音消息的發(fā)送步驟相同,文章中不再贅述。
//語音錄制 startRecorder(config,callback){ if(typeof(this.audioRecorder)!=='undefined'){ this.audioRecorder.on('prepare',()=>{ this.audioRecorder.start() }) this.audioRecorder.on('start',()=>{ callback() }) this.audioRecorder.prepare(config) }else{ logger.info(`${TAG}casefailed,audiorecorderisnull`) } } //錄制好的語音文件的位置 letsrcPath='internal://cache/'+this.mainData.file+'.wav' letfile1={filename:this.$app.$def.uid+'-'+this.mainData.path,name:'audio',uri:srcPath,type:"wav"}; //語音消息發(fā)送到服務(wù)器 request.upload({url:myurl,header:header,method:"POST",files:[file1],data:[data]}).then((data)=>{ uploadTask=data; uploadTask.on('headerReceive',functioncallback(headers){ _this.sendAudio(audioId) }); uploadTask.on('progress',functioncallback(uploadedSize,totalSize){ console.info("dialogPages=====uploadtotalSize:"+totalSize+"uploadedSize:"+uploadedSize); }); }).catch((err)=>{ console.error('dialogPages=====Failedtorequesttheupload.Cause:'+JSON.stringify(err)); }) //語音的接收 letdownloadConfig={//下載參數(shù) url:item.content.path, header:{}, enableMetered:true, enableRoaming:true, filePath:filePath, networkType:request.NETWORK_WIFI } letdownloadTask; let_this=this request.download(downloadConfig,(err,data)=>{ if(err){ return; } downloadTask=data; //下載完成 downloadTask.on('complete',functioncallback(){ letaudio={ content:{path:filePath} } _this.playAudio(audio) });
④emoji 消息的發(fā)送與接收
emoji 是即時通訊軟件不可缺少的一部分,可以更加生動地表現(xiàn)用戶的聊天情感。 在樣例中,用戶通過點(diǎn)擊聊天界面的 emoji 按鈕,即可找到目前應(yīng)用內(nèi)支持的所有樣式的 emoji,隨后可以選擇具體樣式并將其發(fā)送給好友。
//引入emoji第三方組件//第三方組件的展示布局 所有表情
即時通訊功能總結(jié)
本樣例是基于 OpenHarmony 實(shí)現(xiàn)的即時通訊應(yīng)用,目前已經(jīng)支持文字、圖片、文件、語音、emoji 等訊息的快速發(fā)送與接收。 除此之外還實(shí)現(xiàn)了好友的添加與刪除、黑名單、安全登錄、私聊/群聊、個人信息設(shè)置(二維碼/頭像等)等功能的全方面支持。 代碼地址:
https://gitee.com/isrc_ohos/instant-message_ohos
-
通訊
+關(guān)注
關(guān)注
9文章
890瀏覽量
34810 -
開發(fā)板
+關(guān)注
關(guān)注
25文章
4896瀏覽量
97058 -
鴻蒙
+關(guān)注
關(guān)注
57文章
2302瀏覽量
42689 -
OpenHarmony
+關(guān)注
關(guān)注
25文章
3635瀏覽量
16061
原文標(biāo)題:鴻蒙上實(shí)現(xiàn)多人聊天功能
文章出處:【微信號:gh_834c4b3d87fe,微信公眾號:OpenHarmony技術(shù)社區(qū)】歡迎添加關(guān)注!文章轉(zhuǎn)載請注明出處。
發(fā)布評論請先 登錄
相關(guān)推薦
評論