Vue实现的聊天系统「建议收藏」

Vue实现的聊天系统

大家好,又见面了,我是全栈君。

项目地址:github.com/CCZX/wechat目前项目一直在更新中。欢迎大家留下宝贵的意见。

一、具备的功能

  1. 好友之间聊天,支持问题、图片、表情、音视频通话以及白板(适用WebRTC实现)。

  2. 对好友支持备注、分组功能,分组可以添加、修改、删除。

  3. 好友之间的消息支持已读状态提醒,可以即时的知道对方是否已读消息。

  4. 在线好友统计,在每个分组中可以查看当前在线好友的数量,并对在线好友的头像做高亮处理。

  5. 群聊,群聊目前只支持文字、图片、表情的形式,目前群聊消息也不支持已读提醒(后续完善)。

  6. 空间,类似于QQ空间,可以发表自己的动态、查看好友的动态。

  7. 动态编辑,支持对空间进行删除、编辑的操作。

  8. 动态互动,支持点赞、评论、评论回复功能。

  9. 添加好友、添加群聊,在添加后需要对方同意。

  10. 日程管理,支持新建日程、删除日程的功能。

  11. 后台管理:独立的项目,使用React实现。

  12. 更多细节功能在后续几天我线上部署代码后欢迎来体验。

二、技术栈

Vue、Vuex、Element-UI、React、axios、sass、ES6、WebSocket、Node等。

三、难点

  1. 各种组件的拆分,项目文件结构。

  2. 修改用户分组、分组后用户界面即时响应。

  3. 在获取会话后,对每条会话最后一条消息的获取处理逻辑。

  4. 对接七牛云实现实现图片的上传。

  5. webRTC技术。

  6. 收到消息后即时提醒以及未读消息的数量提醒。

  7. 消息已读提醒设置。

  8. 用户退出登录后,后端登录信息的即时清除。

  9. 空间动态的评论以及回复评论实现。

  10. 不同页面组件之间执行操作后的响应。

四、项目截图

1、最近会话列表页面(最近会话按照最后消息时间排序,在发送新的消息后该会话会排序到第一条)

Vue实现的聊天系统「建议收藏」

2、好友分组、群聊分类

Vue实现的聊天系统「建议收藏」
Vue实现的聊天系统「建议收藏」

3、新消息提醒、已读提醒

Vue实现的聊天系统「建议收藏」
Vue实现的聊天系统「建议收藏」

4、空间动态

Vue实现的聊天系统「建议收藏」

该项目本人最近会一直跟进,直到实现一个较为完善的聊天系统,后续再进行优化升级。项目地址:github.com/CCZX/wechat  欢迎大家提出宝贵的意见,

链接:https://juejin.im/post/5e81a04ef265da47fb46d338

Vue实现的聊天系统「建议收藏」

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/111801.html原文链接:https://javaforall.net

赞 (0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • oracle索引视图_位图联合索引

    oracle索引视图_位图联合索引一.什么是位图索引我们目前大量使用的索引一般主要是B*Tree索引,在索引结构中存储着键值和键值的RowID,并且是一一对应的.而位图索引主要针对大量相同值的列而创建(例如:类别,操作员,部门ID,库房ID等),索引块的一个索引行中存储键值和起止Rowid,以及这些键值的位置编码,位置编码中的每一位表示键值对应的数据行的有无.一个位图索引块可能指向的是几十甚至成百上千行数据的位置.这种方式存储数据…

    2022年10月26日
  • SQL Server 2008备份数据库失败,拒绝访问的原因

    SQL Server 2008备份数据库失败,拒绝访问的原因

    2021年8月28日
  • php二维码分享到朋友圈,php实现的微信分享到朋友圈并记录分享次数功能

    php二维码分享到朋友圈,php实现的微信分享到朋友圈并记录分享次数功能本文实例讲述了php实现的微信分享到朋友圈并记录分享次数功能。分享给大家供大家参考,具体如下:1.引入JS文件2.通过config接口注入权限验证配置3.通过ready接口处理成功验证4.通过error接口处理失败验证JSDK档说明:https://mp.weixin.qq.com/wiki/7/aaa137b55fb2e0456bf8dd9148dd613f.html(1)(2)页面加入获取we…

    2022年6月6日
  • 命令解压war包_tomcat war包不解压

    命令解压war包_tomcat war包不解压把java程序打成war包。起先用zip命令打包,起先可以用,后来却无法使用。今天找到一个更好的办法。用jar命令,前提是要安装jdk。操作:1、把当前目录下的所有文件打包成game.warjar-cvfM0game.war./-c创建war包-v显示过程信息-f-M-0这个是阿拉伯数字,只打包不压缩的意思解压game.warjar-xvfgame.war解压到当前目录…

    2022年10月24日
  • 【idea】推荐一个idea翻译插件:Translation「建议收藏」

    【idea】推荐一个idea翻译插件:Translation「建议收藏」打开settings-plugins,打开Browserepositories(如图):搜索”Translation”,往下找,找到图中插件install即可(我是已经安装了的)我的插件版本现在是支持谷歌、有道、百度三种翻译,其中有道和百度的需要填写应用id及secret等才能用,这个需要到有道智云(百度的没有试过)申请。使用很简单:选中单词或者段落ctrl+shift+…

    2022年6月15日
  • 示波器探头如何校准「建议收藏」

    示波器探头如何校准「建议收藏」示波器是电子测试设备中常见的电子器件,通过电子工程师会使用它测量相关电路的信号输出以及相应的电压电流变化。在示波器的应用场合中,除了有些RF或高速数字的场合用电缆直接测量以外,很多板上的调试工作都是借助探头完成的。不过在正式开始使用探头前,我们是需要校准的,那么我们如何进行示波器的探头校准呢?探头是示波器测量系统的一部分,很多高带宽的探头都必须是有源探头,有源探头内部的有源放大器的增益和偏置随着温度或者时间老化可能会有漂移,为了补偿这种漂移,就需要定期对探头进行校准。目前示波器探头的校准方法通常有三

    2022年10月12日

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号