基于(webSocket)搭建一个双人匹配聊天的在线网站,音视频开发进阶指南

101 阅读4分钟

最后:

总结来说,面试成功=基础知识+项目经验+表达技巧+运气。我们无法控制运气,但是我们可以在别的地方花更多时间,每个环节都提前做好准备。

面试一方面是为了找到工作,升职加薪,另一方面也是对于自我能力的考察。能够面试成功不仅仅是来自面试前的临时抱佛脚,更重要的是在平时学习和工作中不断积累和坚持,把每个知识点、每一次项目开发、每次遇到的难点知识,做好积累,实践和总结。

开源分享:docs.qq.com/doc/DSmRnRG… 网站效果:

========================================================================

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

gitee地址

==========================================================================

(前端)在线聊天-Vue。Gitee地址

(后端)在线聊天gitee地址

Fork->clone->打包->部署 私人聊天室不是梦😄😄

技术栈

======================================================================

服务:springboot,websocket长连接服务

前端:vue

通过websocket进行通信

maven依赖


引入springboot额外添加一个websocket相关依赖

org.springframework.boot

spring-boot-starter-websocket

webSocket服务器搭建

=================================================================================

  • 引入websocket服务后。我们需要创建一个类,并添加注解指定服务对外开放姐服务地址;

在这里插入图片描述

其中地址内有{}包裹是可以通过地址来接受的参数,上图可以接受用户名及性别。

webSocket生命周期对应的函数回调


服务端:


  1. 有客户端连接时:onOpen,在函数上添加该注解,当客户端连接时则会立即执行该函数。发生对应其他状态时也会执行特定函数

连接的回调函数可以接受当前连接的会话, 可以通过session发送消息,客户端连接有不同的会话,通过会话session可以发送消息,断开连接等操作

  1. 收到客户端发送的消息时:onMessage

可以接受收到的字符消息

  1. 出现异常情况时:onError

  2. 连接断开时:onClose

搭建使用:

在这里插入图片描述

启动springboot项目,就启动了webSocket服务。

客户端:


客户端使用webSocket连接服务器时,使用js的WebSocket对象创建连接

前端wensocket连接websocket服务代码

this.ws = new WebSocket(ws://localhost:3000/chat/${this.from.fromName}/${this.from.fromSex})

ws: w:web s:Socket 使用webSocket协议进行连接。

后面则是连接的地址。可以在地址放一些参数。后台同样配置可以接收

创建成功后会返回一个webSocket对象,该对象需要给不同的生命周期设置一个回调。

生命周期痛服务端一样。

最后:

总结来说,面试成功=基础知识+项目经验+表达技巧+运气。我们无法控制运气,但是我们可以在别的地方花更多时间,每个环节都提前做好准备。

面试一方面是为了找到工作,升职加薪,另一方面也是对于自我能力的考察。能够面试成功不仅仅是来自面试前的临时抱佛脚,更重要的是在平时学习和工作中不断积累和坚持,把每个知识点、每一次项目开发、每次遇到的难点知识,做好积累,实践和总结。

开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】