开发者社区> 黄小凡> 正文

Node.js+express+MongoDB+socket.io 做的一个即时聊天案例

简介: Node.js+express+MongoDB+socket.io 做的一个即时聊天案例
+关注继续查看

说明


目录说明:

  • config 配置目录
  • public 公共资源文件目录
  • scripts 框架自带js文件
  • server 服务端文件
  • src 客户端文件

    • component 组件文件
    • container 页面文件
    • redux 常量与redux文件
    • APP.js index.jx 入口文件
    • reducer.js 包含所有的reducer文件
    • store.js 包含store文件,扩展其它插件

演示图片

![Uploading file...]()
演示图片

我是拿某款录屏gif软件录的,导致点击发送消息的时候,发送了两次,实际上只有一次,原因应该是服务端触发了两次广播,懒得改了。。。将就看吧!


项目包说明

antd

蚂蚁金服的react组件

按需加载流程
  • 安装antd

`
npm install antd --save
`

  • 暴露eject

npm run eject

  • 安装babel-plugin-import

`
npm install babel-plugin-import --save
`

  • 修改package.json如下代码

`
"babel": {

"presets": [
  "react-app"
]

}
`

`
"babel": {

"presets": [
  "react-app"
],
"plugins": [
  [
    "import",
    {
      "libraryName": "antd",
      "style": "css"
    }
  ]
]

}
`

react-router-dom

管理react路由

在浏览器使用需要引入

`
import {BrowserRouter, Route} from 'react-router-dom'
`

node-sass

使create-react-app支持sass

`
npm install node-sass --save
`

mongoose

管理MongoDB

react-redux

管理redux

redux-thunk

thunk中间件

utility

js加密库

bodyPaser

bodyPaser

cookiePaser

cookiePaser

brwoser-cookies

管理cookie

socket.io

提供socket服务端

socket.io-client

提供socket客户端

github地址:https://github.com/kavience/react-zhaopin

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
FastAPI 学习之路(五十一)WebSockets(七)实现一对一聊天
FastAPI 学习之路(五十一)WebSockets(七)实现一对一聊天
15 0
阿里云服务器怎么设置密码?怎么停机?怎么重启服务器?
如果在创建实例时没有设置密码,或者密码丢失,您可以在控制台上重新设置实例的登录密码。本文仅描述如何在 ECS 管理控制台上修改实例登录密码。
18725 0
【WebSocket No.2】WebSocket和Socket实现聊天群发
介绍: 前面写过一篇简单的websocke实现服务端。这一篇就不在说什么基础的东西主要是来用实例说话,主要是讲一下实现单聊和群组聊天和所有群发的思路设计。 直接不懂的可以看一下上一篇简单版本再来看也行:实现服务端WebSocket传送门 实现效果: 本示例主要实现了个什么东西哪,我们都使用qq或者其他的聊天工具,所有下面我说的大家也都懂。
963 0
阿里云ECS云服务器初始化设置教程方法
阿里云ECS云服务器初始化是指将云服务器系统恢复到最初状态的过程,阿里云的服务器初始化是通过更换系统盘来实现的,是免费的,阿里云百科网分享服务器初始化教程: 服务器初始化教程方法 本文的服务器初始化是指将ECS云服务器系统恢复到最初状态,服务器中的数据也会被清空,所以初始化之前一定要先备份好。
13673 0
阿里云服务器如何登录?阿里云服务器的三种登录方法
购买阿里云ECS云服务器后如何登录?场景不同,阿里云优惠总结大概有三种登录方式: 登录到ECS云服务器控制台 在ECS云服务器控制台用户可以更改密码、更换系.
23694 0
阿里云ECS云服务器初始化设置教程方法
阿里云ECS云服务器初始化是指将云服务器系统恢复到最初状态的过程,阿里云的服务器初始化是通过更换系统盘来实现的,是免费的,阿里云百科网分享服务器初始化教程: 服务器初始化教程方法 本文的服务器初始化是指将ECS云服务器系统恢复到最初状态,服务器中的数据也会被清空,所以初始化之前一定要先备份好。
13925 0
Java Socket编程 - 基于TCP方式的客户服务器聊天程序
本文讲演示如何通过Java Socket建立C/S方式的聊天程序。实现的功能 主要包括如下几个方面: 1. 用户登录,在线用户列表刷新 2.客户端与服务器的TCP连接,实现消息的发送与接受 3.Java Swing与多线程编程技巧 一个整体的Class关系图如下: 程序实现的服务器端UI如下: 一个JList组件用来显示在线的所有用户,一个JTextArea组件用来显示所有消息 记录。
803 0
与众不同 windows phone (31) - Communication(通信)之基于 Socket UDP 开发一个多人聊天室
原文:与众不同 windows phone (31) - Communication(通信)之基于 Socket UDP 开发一个多人聊天室 [索引页][源码下载] 与众不同 windows phone (31) - Communication(通信)之基于 Socket UDP 开发一个多人聊天室 作者:webabcd介绍与众不同 windows phone 7.
770 0
+关注
22
文章
5
问答
文章排行榜
最热
最新
相关电子书
更多
OceanBase 入门到实战教程
立即下载
阿里云图数据库GDB,加速开启“图智”未来.ppt
立即下载
实时数仓Hologres技术实战一本通2.0版(下)
立即下载