玩转OpenHarmony社交场景:即时通讯平台

一、简介

本样例是基于即时通讯(Instant messaging,简称IM)服务实现的OpenAtom OpenHarmony(简称“OpenHarmony”)应用,允许两人或多人使用互联网即时地传递文字、图片、文件、语音、emoji等讯息,可应用于各类聊天场景,为人们带来更加及时高效的通讯体验。

此外即时通讯平台具备较高的定制化特点,适用于多种行业,客户可以根据自己的需求来定制,实现即时通讯的内部私有化。

设备端:DAYU200(RK3568)开发板,OpenHarmony 3.1 release系统。

二、即时通讯实现原理

想要实现多个设备之间的无障碍即时通讯,需要多台终端设备、终端应用和服务器配合一起使用。首先应该将终端应用安装到终端设备上,用户通过应用向服务器申请注册账号。随后,用户可以通过账号进行查找,添加其他好友,并向好友发送文字、图片、文件、语音、emoji等讯息。用户发送的讯息会先送达服务器,由服务器判断其好友的状态(离线/在线),然后选择发送或者暂时缓存消息等操作。最后,好友的终端应用接收到消息。

实现即时通讯的设备需求:安装应用的终端设备、网络环境和云端服务器。

前提条件:用户将应用安装在终端设备上,并且拥有注册账号,且需要通讯的用户也成功注册了账号并且添加了好友。

通讯原理:用户在安装了应用的终端设备上编辑信息(文字、图片、文件、语音、emoji等),通过网络将消息发送至云端服务器。当对方用户在线时,云端服务器将把消息推送给对方用户,对方用户安装了应用的终端设备也将接收到信息。当对方用户不在线时,信息将被暂时缓存在云端服务器。

三、4步实现多人即时通讯

(1) 通讯功能通讯功能是通过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);//清空字符串

(2) 文件消息的发送与接收

文件转发是即时通讯办公场景下的重要功能。样例中的文件功能支持文件消息的发送、接收和下载。用户通过点击聊天界面的“+”按钮,选择“文件”按钮,完成本地文件的浏览,随后可以选择是否将文件发送给好友。这个功能的实现包括三个步骤:(1)文件的选择;(2)文件上传到服务器;(3)文件的接收。

• 文件上传

//文件的选择
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,
                });
        });

(3) 语音消息的发送与接收

用户通过点击聊天界面的录制按钮,完成语音的录制,随后可以选择是否将语音发送给好友。这个功能的实现包括三个步骤:(1)语音的录制;(2)语音上传到服务器;(3)语音的接收。

图片消息的发送与语音消息的发送步骤相同,文章中不再赘述。

//语音录制
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)
            });

(4) emoji消息的发送与接收

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等讯息的快速发送与接收。除此之外还实现了好友的添加与删除、黑名单、安全登录、私聊/群聊、个人信息设置(二维码/头像等)等功能的全方面支持。

为了能让大家更好的学习鸿蒙(HarmonyOS NEXT)开发技术,这边特意整理了《鸿蒙开发学习手册》(共计890页),希望对大家有所帮助:https://qr21.cn/FV7h05

《鸿蒙开发学习手册》:

如何快速入门:https://qr21.cn/FV7h05

  1. 基本概念
  2. 构建第一个ArkTS应用
  3. ……

开发基础知识:https://qr21.cn/FV7h05

  1. 应用基础知识
  2. 配置文件
  3. 应用数据管理
  4. 应用安全管理
  5. 应用隐私保护
  6. 三方应用调用管控机制
  7. 资源分类与访问
  8. 学习ArkTS语言
  9. ……

基于ArkTS 开发:https://qr21.cn/FV7h05

  1. Ability开发
  2. UI开发
  3. 公共事件与通知
  4. 窗口管理
  5. 媒体
  6. 安全
  7. 网络与链接
  8. 电话服务
  9. 数据管理
  10. 后台任务(Background Task)管理
  11. 设备管理
  12. 设备使用信息统计
  13. DFX
  14. 国际化开发
  15. 折叠屏系列
  16. ……

鸿蒙开发面试真题(含参考答案):https://qr18.cn/F781PH

鸿蒙开发面试大盘集篇(共计319页):https://qr18.cn/F781PH

1.项目开发必备面试题
2.性能优化方向
3.架构方向
4.鸿蒙开发系统底层方向
5.鸿蒙音视频开发方向
6.鸿蒙车载开发方向
7.鸿蒙南向开发方向

  • 5
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值