使用vue3+ websokect后台koa2后端实现聊天框（vue3+koa2）_vue3 聊天对话页面

我们使用websokect来实现一个聊天室的功能，这里我们用到的技术栈是vue3，然后使用koa2来模拟后端 以及如何使用websokect。

话不多说，直接上操作及代码。

首先我们先搭建好vue框架以及koa2的框架

这里我们就不细说了，可以直接去他们官网去看api。

搭建好框架以后，然后我们还需要下载一个  ws 的依赖

我这里使用的 是一个 7.5.0的一个版本

接下来我们写前端，这里直接上代码，

这里我都有注释，写的我认为很详细了，这样我们就已经写好前端 需要的了，我们再去后端使用

koa2 创建的·项目

这里如果启动你的后端项目的话直接用  node +文件名.js

 

这边也是很详细的写在了代码之中了，不懂得可以多看看，并没有多大的逻辑，就是要注意那边那个端口号，那个端口号并不需要你非得要哪个服务器的端口号，只需要咱们自己本地的端口号即可。 实现一个简单的聊天功能，看下效果。

 

 这边我们就从两个页面，实现了一个简单的聊天室功能了，剩下的就剩大家自己去排版创作了。