TWaver html5 + NodeJS + express + websocket.io + redis 快速搭建项目(一)

最近看到TWaver 的html5版本即将发布了,于是今天用TWaver HTML5 + NodeJS + express + websocket.io + redis搭建了一个简单原型。先发出几张效果图给大家尝尝鲜。界面添加、修改以及删除网元后,会自动增量存库,并广播更新。

看看这个广播实现的效果,可以在手机上接受任何操作:

最后再来个告警广播的效果图

在后续的文章中会给大家详细的讲解具体技术的实现。

时间: 2024-08-03 04:14:25

TWaver html5 + NodeJS + express + websocket.io + redis 快速搭建项目(一)的相关文章

基于Vue-cli 快速搭建项目

Vue-cli可以快速帮助我们创建一个项目,这是官方给我们提供的脚手架.下面我说一下vue-cli的使用方法. 一.准备工作 在使用vue-cli时,首先需要安装nodejs,npm,其次需全局安装vue和vue-cli 1.nodejs和npm安装方法详见https://www.cnblogs.com/le220/p/8670349.html 2.npm install -g vue 3.npm install -g vue-cli 二.vue-cli快速搭建项目 安装完成后,同时在C:\Us

SpringBoot 学习:(一)快速搭建项目

一.简介 从 Spring Boot 项目名称中的 Boot 可以看出来,Spring Boot 的作用在于创建和启动新的基于 Spring 框架的项目.它的目的是帮助开发人员很容易的创建出独立运行和产品级别的基于 Spring 框架的应用.Spring Boot 会选择最适合的 Spring 子项目和第三方开源库进行整合.大部分 Spring Boot 应用只需要非常少的配置就可以快速运行起来. Spring Boot 包含的特性如下: 创建可以独立运行的 Spring 应用. 直接嵌入 To

Vue(一) vue-cli4.x快速搭建项目

一:基础环境配置 (1)首先要下载node( https://nodejs.org/zh-cn/download/ ): (2)打开终端输入: node --version npm --version (3)若能显示出版本号就说明已经安装ok: (4)安装脚手架(vue-cli) npm install @vue/cli -g //全局安装最新的脚手架   二:搭建项目 (1)生成项目目录 vue create 项目名称(貌似不能含有大写字母); (2)选择手动配置还是默认配置 default 

NodeJS+Express+Socket.io的一个简单例子

初始化一个NodeJS web应用: 打开CMD窗口. 运行cmd:"mkdir myapp",新建一个文件夹,名为myapp. 运行cmd:"cd myapp",切换到文件夹myapp. 运行cmd:"npm init",创建文件package.json. 3.Express入门应用: 在上面的CMD窗口运行cmd:"npm install express --save", 安装"express" nod

HTML5+NodeJs实现WebSocket即时通讯

产品网站中很多地方需要用到实时交互,web端的实时交互. 具体为活动抽奖案例: 现场一个大屏,显示中奖人列表相关信息: 主持人一个pad控制开始抽奖结束抽奖: 每个活动现场的观众的手机.用来摇动手机进行抽奖 毫无疑问用websocket,WebSocket相较于HTTP来说,有很多的优点,主要表现在WebSocket只建立一个TCP连接,可以主动推送数据到客户端,而且还有更轻量级的协议头,减少数据传送量.所以WebSocket暂时来说是实时通讯的最佳协议了 至于服务器语言选择nodeJs,是因为

nodejs express下使用redis管理session

Session实现原理 实现请求身份验证的方式很多,其中一种广泛接受的方式是使用服务器端产生的Session ID结合浏览器的Cookie实现对Session的管理,一般来说包括以下4个步骤: 服务器端的产生Session ID 服务器端和客户端存储Session ID 从HTTP Header中提取Session ID 根据Session ID从服务器端的Hash中获取请求者身份信息 使用Express和Redis对Session管理的实现 var session = require('exp

[Nodejs]利用Socket.IO配合Express4搭建即时聊天

Socket.IO为WebSockets这个较新的web技术提供了必要的支持,包含客户端与服务端模块,以便建立通信通道,当然也可作为中间件而存在. 1 创建一个express项目 ????????? ????? 防工具盗链抓取[如果显示此文字,代表来自第三方转发] freddon所有 ??? ??????????? 可以使用命令行初始化一个express项目 先安装express npm install express npm install express-generator express 

node+express+socket.io+mysql=通讯服务器搭建(一)

首发github/blog 欢迎大家评论给星 安装 首先假定你已经安装了 Node.js,接下来为你的应用创建一个目录,然后安装express-generator应用骨架 $ mkdir node-demo $ npm install express-generator -g //mac需要加sudo express -h $ express -h 用法: express [options] [dir] 选项: -h, --help 输出使用信息 -V, --version 输出版本号 -e,

使用angular-cli脚手架快速搭建项目

第一步 安装全局的angular-cli, npm install -g @angular/cli 或者 cnpm install -g @angular/[email protected] – 国内淘宝源(cnpm的安装自行搜索) 或者 yarn add global @angular/cli 第二步 查看各插件是否已经安装,ng -v会出来一堆东西,如第一个图git命令所示! 第三步 生成项目 代码为:ng new 项目名称 angular-cli可以初始化ng2或者ng4的项目,我这里说2