nodejs项目_多人群聊实现其实很简单:Nodejs+WebSocket+Vue轻松实现Web IM

点击右上方红色按钮关注“web秀”,让你真正秀起来

前言

在《Nodejs + WebSocket简单介绍及示例 - 第一章》中简单的介绍了,Nodejs + WebSocket的使用方法及作用,今天就用它来搭建一个简单的聊天室功能。

f5591d411294cad9d5564588b4c28f85.png

1、Nodejs+WebSocket创建后台服务器功能

2、Vue视图层,接收后台数据并渲染页面

3、LocalStorage存储会话ID等用户信息

vue + webpack 生成vue项目

脚手架搭建项目也是非常好用,简单命令即可搞定

# vue init webpack web-im

然后一路向下,填写项目名称,描述,作者等等信息,完成安装。

现在都可以自动安装模块了,当然,你可以可以到目录下面执行npm install

# cd web-im# npm install
6a6287582a133aa71b5263c72006e832.png

这就是整个生成后的项目结构。

WebSocket服务端

在项目根目录下新建server/index.js文件。

var ws = require("nodejs-websocket");// 这里用到了moment,请大家自行安装var moment = require('moment');console.log("开始建立连接...")let users = [];// 向所有连接的客户端广播function boardcast(obj) { server.connections.forEach(function(conn) { conn.sendText(JSON.stringify(obj)); })}function getDate(){ return moment().format('YYYY-MM-DD HH:mm:ss')}var server = ws.createServer(function(conn){ conn.on("text
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值