本样例是基于立即通信(简称 IM)办事实现的 OPEnHarmony 应用。

鸿蒙上实现多人聊天功用  第1张

该应用允许两人或多人利用互联网立即地传递文字、图片、文件、语音、emoji 等讯息,可应用于各类聊天场景,为人们带来愈加及时高效的通信体验。

此外立即通信平台具备较高的定造化特点,适用于多种行业,客户能够按照本身的需求来定造,实现立即通信的内部私有化。

鸿蒙上实现多人聊天功用  第2张

设备端:

DAYU200(RK3568)开发板OpenHarmony 3.1 release 系统

立即通信实现原理

如下图:

鸿蒙上实现多人聊天功用  第3张

想要实现多个设备之间的无障碍立即通信,需要多台末端设备、末端应用和办事器共同一路利用。

起首应该将末端应用安拆到末端设备上,用户通过应用向办事器申请注册账号。

随后,用户能够通过账号停止查找,添加其他老友,并向老友发送文字、图片、文件、语音、emoji 等讯息。

用户发送的讯息会先送达办事器,由办事器判断其老友的形态(离线/在线),然后选择发送或者暂时缓存动静等操做。

最初,老友的末端应用领受到动静。

实现立即通信的设备需求:安拆应用的末端设备、收集情况和云端办事器。

前提前提:用户将应用安拆在末端设备上,而且拥有注册账号,且需要通信的用户也胜利注册了账号而且添加了老友。

通信原理:用户在安拆了应用的末端设备上编纂信息(文字、图片、文件、语音、emoji 等),通过收集将动静发送至云端办事器。

当对方用户在线时,云端办事器将把动静推送给对方用户,对方用户安拆了应用的末端设备也将领受到信息。当对方用户不在线时,信息将被暂时缓存在云端办事器。

4 步实现多人立即通信

①通信功用是通过 TCP 协议实现的,我们将通信接口 connect()、send()、receive() 的实现放置在 CPP 文件中,通过 NAPI 的体例对 JS 层表露接口。

如下:

connect():客户端和办事器成立毗连send():动静发送功用receive():动静领受功用//成立TCP毗连if (connect(sock_cli, (struct sockaddr *)&servaddr, sizeof(servaddr)) < 0) { napi_create_int32(env, 0, &result);} else { napi_create_int32(env, 1, &result); OH_LOG_INFO(LOG_APP,"C++ 领受线程启动"); startRec();} //发送动静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);//清空字符串②文件动静的发送与领受

②文件动静的发送与领受

鸿蒙上实现多人聊天功用  第4张

文件转发是立即通信办公场景下的重要功用。样例中的文件功用撑持文件动静的发送、领受和下载。

用户通过点击聊天界面的“+”按钮,选择“文件”按钮,完成当地文件的阅读,随后能够选择能否将文件发送给老友。

那个功用的实现包罗三个步调:

文件的选择文件上传到办事器文件的领受

文件上传:

//文件的选择let file1 = {filename: this.$app.$def.uid +'-'+ FILE_URL, name: 'file', uri: FILE_URL, type:fileType }let fileId = this.guid();let data = {};let header = { "filename": this.selectedFileName.toString()};//文件上传到办事器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', function callback(headers){ _this.socketSendFile(fileId, timestamp); });}).catch((err) => { console.error('fileSelect=====Failed to request the upload. Cause: ' + JSON.stringify(err));})//文件的领受let downloaDConfig = { //下载参数 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', function callback() { PRompt.showToast({ message: '下载文件胜利!', duration: 1000, }); });

③语音动静的发送与领受

鸿蒙上实现多人聊天功用  第5张

用户通过点击聊天界面的录造按钮,完成语音的录造,随后能够选择能否将语音发送给老友。

那个功用的实现包罗三个步调:

语音的录造语音上传到办事器语音的领受

图片动静的发送与语音动静的发送步调不异,文章中不再赘述。

//语音录造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} case failed, audiorecorder is null`) }}//录造好的语音文件的位置let srcPath = 'internal://cache/' + this.mainData.file + '.wav'let file1 = { filename: this.$app.$def.uid +'-'+ this.mainData.path, name: 'audio', uri: srcPath, type: "wav" };//语音动静发送到办事器request.upload({ url: myurl, header: header, method: "POST", files: [file1], data: [data] }).then((data) => { uploadTask = data; uploadTask.on('headerReceive', function callback(headers){ _this.sendAudio(audioId) }); uploadTask.on('progress', function callback(uploadedSize, totalSize) { console.info("dialogPages=====upload totalSize:" + totalSize + " uploadedSize:" + uploadedSize); }); }).catch((err) => { console.error('dialogPages=====Failed to request the upload. Cause: ' + JSON.stringify(err)); })//语音的领受let downloadConfig = { //下载参数 url: item.content.path, header: {}, enableMetered: true, enableRoaming: true, filePath: filePath, networkType: request.NETWORK_WIFI } let downloadTask; let _this = this request.download(downloadConfig, (err, data) => { if (err) { return; } downloadTask = data; //下载完成 downloadTask.on('complete', function callback() { let audio = { content: { path: filePath } } _this.playAudio(audio) });

④emoji 动静的发送与领受

鸿蒙上实现多人聊天功用  第6张

emoji 是立即通信软件不成贫乏的一部门,能够愈加生动地表示用户的聊天感情。

在样例中,用户通过点击聊天界面的 emoji 按钮,即可找到目前应用内撑持的所有款式的 emoji,随后能够选择详细款式并将其发送给老友。

//引入emoji第三方组件<element name="emojiExpression" src="../../common/components/emojiExpression/emojiExpression.hml"></element>//第三方组件的展现规划<div id="moreContainer" if="{{showFace}}"> <div id="moreOneLine"> <div class="moreFillGap" style="flex: 1 1;"></div> <text style="left: 25fp; top: 10fp;">所有脸色</text> <emojiExpression></emojiExpression> <div class="moreFillGap" style="flex: 1 1;"></div> </div></div>

立即通信功用总结

本样例是基于 OpenHarmony 实现的立即通信应用,目前已经撑持文字、图片、文件、语音、emoji 等讯息的快速发送与领受。

除此之外还实现了老友的添加与删除、黑名单、平安登录、私聊/群聊、小我信息设置(二维码/头像等)等功用的全方面撑持。

代码地址:https://gitee.com/isrc_ohos/instant-message_ohos