简介:

此项目需要懂一点node、express

功能:

1.前端用户登录,查看服务端推送的消息,用户只能在一个地方登录,也就是单点登录

2.服务端首先登录,上传需要推送的信息文本,后台读取文本后,存入数据库,在取出来返回前端,链接socket服务,然后推送到前端

界面如下:

服务端界面:

用户管理界面:

1.修改、增加、删除等操作

前端界面:

技术栈:

前端:

"axios": "^0.18.0"---(用户提交向服务器提交数据)
"iview": "^3.2.1"---(前端ui组件)
"qs": "^6.6.0" ---(跨域模块)
"socket.io-client": "^2.2.0" ---(与node进行通讯的模块)
"vue": "^2.5.21"---(前端框架)
"vue-router": "^3.0.2"---(前端路由)
"vuex": "^3.0.1"---(前端数据交互模块)

服务端:

备注:服务端使用node+express 搭建的web服务器

"express": "~4.15.5",
"mysql": "^2.16.0",
"socket.io": "^2.2.0"

源代码已经上传github了下面是地址:

https://github.com/lw664256297/textsocket

金主们请博主喝杯茶吧,博主万分感谢!

微信二维码

websocket服务器推送 (node+express+vue+socket)的更多相关文章

  1. HTML5学习总结-08 WebSocket 服务器推送

    一 WebSocket 随着互联网的发展,传统的HTTP协议已经很难满足Web应用日益复杂的需求了.近年来,随着HTML5的诞生,WebSocket协议被提出,它实现了浏览器与服务器的全双工通信,扩展 ...

  2. 基于Tomcat7、Java、WebSocket的服务器推送聊天室

    http://blog.csdn.net/leecho571/article/details/9707497 http://blog.fens.me/java-websocket-intro/ jav ...

  3. Tomcat学习总结(4)——基于Tomcat7、Java、WebSocket的服务器推送聊天室

    前言           HTML5 WebSocket实现了服务器与浏览器的双向通讯,双向通讯使服务器消息推送开发更加简单,最常见的就是即时通讯和对信息实时性要求比较高的应用.以前的服务器消息推送大 ...

  4. Spring之WebSocket网页聊天以及服务器推送

    Spring之WebSocket网页聊天以及服务器推送 转自:http://www.xdemo.org/spring-websocket-comet/ /Springframework /Spring ...

  5. Java Springboot webSocket简单实现,调接口推送消息到客户端socket

    Java Springboot webSocket简单实现,调接口推送消息到客户端socket 后台一般作为webSocket服务器,前台作为client.真实场景可能是后台程序在运行时(满足一定条件 ...

  6. node.js Websocket消息推送---GoEasy

    Goeasy, 它是一款第三方推送服务平台,使用它的API可以轻松搞定实时推送!个人感觉goeasy推送更稳定,推送 速度快,代码简单易懂上手快 浏览器兼容性:GoEasy推送 支持websocket ...

  7. Node+Express+MongoDB + Socket.io搭建实时聊天应用

    Node+Express+MongoDB + Socket.io搭建实时聊天应用 前言 本来开始写博客的时候只是想写一下关于MongoDB的使用总结的,后来觉得还不如干脆写一个node项目实战教程实战 ...

  8. Node+Express+MongoDB + Socket.io搭建实时聊天应用实战教程(二)--node解析与环境搭建

    前言 本来开始写博客的时候只是想写一下关于MongoDB的使用总结的,后来觉得还不如干脆写一个node项目实战教程实战.写教程一方面在自己写的过程中需要考虑更多的东西,另一方面希望能对node入门者有 ...

  9. 【WebSocket】WebSocket消息推送

    准备使用WebSocket实现Java与Vue或者安卓间的实时通信,实现私密聊天.群聊.查询下资料备用. WebSocket客户端 websocket允许通过JavaScript建立与远程服务器的连接 ...

随机推荐

  1. 关于jq中input的value值clone的问题

    如果想将input进行克隆,然后在后面显示出来并修改input里面的文字,这时就会发现一个问题,就是你克隆出来的value值始终是你克隆时的value,检查页面元素你就会发现,这时需要对克隆之后的in ...

  2. Python中self的用法详解,或者总是提示:TypeError: add() missing 1 required positional argument: 'self'的问题解决

    https://blog.csdn.net/songlh1234/article/details/83587086 下面总结一下self的用法详解,大家可以访问,可以针对平时踩过的坑更深入的了解下. ...

  3. jQuery attr() prop() data()用法及区别

    .attr(),此方法从jq1.0开始一直存在,官方文档写的作用是读/写DOM的attribute值,其实1.6之前有时候是attribute,有时候又是property..prop(),此方法jq1 ...

  4. sys.argv的意义及用法

    sys.argv的意义 简单来说,sys.argv是一个参数列表,这个列表存放着从外界获取到的参数(可能有多个) 下面以一个例子来详细阐述sys.argv,本次演示在ubuntu环境下运行 新建一个t ...

  5. maven项目创建4

    运行maven项目,首先要不最根项目添加到maven本地仓库,执行  项目-->右键-->Run as-->Maven install 注:创建war包项目,本地测试,创建index ...

  6. 信息提示框:MessageBox

    一 函数原型及参数 function MessageBox(hWnd: HWND; Text, Caption: PChar; Type: Word): Integer;   1.参数列表    hW ...

  7. 【BZOJ4456】 [Zjoi2016]旅行者 / 【UOJ #184】 【ZJOI2016】旅行者

    Description 小Y来到了一个新的城市旅行.她发现了这个城市的布局是网格状的,也就是有n条从东到西的道路和m条从南到北 的道路,这些道路两两相交形成n×m个路口 (i,j)(1≤i≤n,1≤j ...

  8. [AGC034D]Manhattan Max Matching:费用流

    前置姿势 \(k\)维空间内两点曼哈顿距离中绝对值的处理 戳这里:[CF1093G]Multidimensional Queries 多路增广的费用流 据说这个东西叫做ZKW费用流? 流程其实很简单, ...

  9. linux查看端口占用情况,python探测端口使用的小程序

    Linux如何查看端口 1.lsof -i:端口号 用于查看某一端口的占用情况,比如查看8000端口使用情况,lsof -i:8000 # lsof -i:8000 COMMAND PID USER ...

  10. 胜利点20191010-5 alpha week 1/2 Scrum立会报告+燃尽图 03

    此作业要求参见:https://edu.cnblogs.com/campus/nenu/2019fall/homework/8747 一.小组情况组长:贺敬文组员:彭思雨 王志文 位军营 杨萍队名:胜 ...