前言 下文只在介绍实现的核心代码,没有涉及到具体的实现细节,如果感兴趣可以往下看,在文章最后贴上了仓库地址.项目采用前后端模式,前端使用 Vite + Vue3 + TS:后端使用 Knex + Express + TS.目前项目还没有完全实现,文章的目的是记录阶段性"胜利"和分享知识. 关于搭建 TS 项目请看搭建 Webpack + TypeScript + Babel 的项目或者JavaScript迁移. Room 的概念 私密 Room 在开始做私聊功能之前,要掌握 Socke…
1.首先说说我老姜对官方提供的demo的理解, 在理解的过程也学到了不少知识. 上图(图0)展示的官网demo的目录结构,node_modules是自己用node下载的, iconfont中是自己的离线图标这里不赘述,里面demo.*的都可以删除,那是给的样例,关于webpack基本配置的文件的知识客官你去百度就好,custom中是对图标路径变量的重新赋值,注意顺序, index.less是对ant样式文件的引用和变量文件的引用,没错这个可以和变量文件合并,到这已经对图标访问实现本地化了,只要…
最近练手开发了一个项目,是一个聊天室应用.项目虽不大,但是使用到了react, react-router, redux, socket.io,后端开发使用了koa,算是一个比较综合性的案例,很多概念和技巧在开发的过程中都有所涉及,非常有必要再来巩固一下. 项目目前部署在heroku平台上,在线演示地址: online demo, 因为是国外的平台速度可能有点慢,点进去耐心等一会儿就能加载好了. 加载好之后,首先出现的页面是让用户起一个昵称: 输入昵称之后,就会进入聊天页面,左边是进入聊天室的在线…
拿到一个项目,我们应该如何去完成这个项目呢. 是直接上手? 还是先进行分析,然后再去解决呢?毫无疑问,如果直接上手解决,那么可能会因为知道目标所在,而导致出现各种问题. 所以,我们应该系统的分析这个项目,然后再去完成. 第一步: 需求 服务器端使用nodejs 可以加入现有的房间 可以创建新的房间 用户可以文字聊天 聊天记录永久保存 除了上面的基本需求之外,我们还需要实现登录.注册的相关功能,这样可以保证用户的唯一性,并在后台做出记录. 第二步:确定技术栈 确定技术栈是我们需要知道为什么使用某个…
记得从高中上课时经常偷偷的和同学们使用qq进行聊天,那时候经常需要进行下载qq,但是当时又没有那么多的流量进行下载,这就是一个很尴尬的事情了,当时就多想要有一个可以进行线上聊天的网站呀,不用每次痛苦的进行蓝牙传送软件了,现在,我从事了IT这个行业,便想要去实现当初的那个梦想吧.毕竟,不去努力的实现梦想,你会从一个梦想家变成一个幻想家. ###技术选择 由于从事的是前端工作,界面什么的对我来说是so easy,后台部分当然是选择了node.js,经过分析呢,数据库部分选择了mongoose,很早之…
前面我们已经说了服务器相关的一些内容,且又根据官网给出的一个例子写了一个可以聊天的小程序,但是这还远远不够呀,这只能算是应用前的准备工作.接下来,一起来考虑完善一个小的聊天程序吧. 首先,修改服务器的代码以前就是单纯的接收转发,现在我们考虑定向转发,及这个消息发送给需要接收的接受者,而不是全部客户端用户,并且考虑不使用默认namespace,那样太不安全了. var app = require('express')(); var http = require('http').Server(app…
现实中的问题:有时候版本上线的时候,打包时忘记切换环境,将测试包推上正式服务器,那你就会被批了. 期望:在写打包的命令行的时候就觉得自己在打包正式版本,避免推包时候的,不确信自己的包是否正确. 既然有了期望,那么就要开始百度如何去实现呢. 下面先开始介绍ant design的方法: ant design的打包工具是roadhog,那么从roadhog下手. 在roadhog文档中,发现define的配置可以传递给代码. 在ant design pro的issue中搜索中,发现环境变量的配置. 我…
最近在学习并使用webpack+react+antd写了一个小项目,也可以说是demo,待全部开发完成后发现webpack的打包文件足足有将近13.3MB,快吓死宝宝了,经过连续几天的学习,和调试最后将打包文件缩小到665kb,效果十分显著,网上有许多解决办法,大多对新手都不是很友好,涉及到的知识点十分的多,导致一步一坑,虽然这边文章不是最好的,但通过如下的调试缩小其打包文件. 项目github连接 :https://github.com/2016Messi/webpack3-react-rou…
效果 实现思路 使用TcpListener建一个服务器,接收所有客户端发送的消息,然后由服务器再发送到其他客户端 客户端使用TcpClient,发消息给服务器,接收服务器的消息,不和其他客户端直接交互 服务器端 接收客户端 开启一个线程,死循环去接收客户端.接收到之后放到一个集合里,保存起来,以便转发消息用.每个客户端都再开启一个线程,用于接收这个客户端发送的消息. 接收客户端的方法AcceptTcpClient()是阻塞方法,在程序退出释放资源时会引发异常,可以先使用Pending()方法先判…
最近的计算机网络课上老师开始讲socket,tcp相关的知识,当时脑袋里就蹦出一个想法,那就是打造一个聊天室.实现方式也挺多的,常见的可以用C++或者Java进行socket编程来构建这么一个聊天室.当然,我毫不犹豫选择了node来写,node有一个名叫socket.io的框架已经很完善的封装了socket相关API,所以无论是学习还是使用都是非常容易上手的,在这里强烈推荐!demo已经做好并放到我的个人网站了,大家可以试试,挺好玩的. 进去试试 ->   http://www.yinxiang…