服务器端代码不超过42行:

const WSServer = require("./server.js");

var counter = 0;

function createWebsocket() {

  var host = "127.0.0.1";
var port = "9999"; var wsServer = WSServer.startServer(host, port);
console.log("WebSocket server listens to: " + host + ":" + port);
wsServer.on('open', (data) => {
console.log('WS Client has connected: ' + data); setInterval(function(){
counter++;
WSServer.broadcast("Jerry: " + counter );
}, 3000); }); wsServer.on('dataWS', (data) => {
console.log('Receive Data from WebUI : ' + data);
}); wsServer.on('disconnect', (data) => {
console.log('WSServer disconnect:' + data.name);
}); wsServer.on('close', (data) => {
console.log('WSServer close: ' + data.name);
}); wsServer.on('end', (data) => {
console.log('WSServer Close: '+data.name);
}); wsServer.on('error', (data) => {
});
} createWebsocket();

代码第10行创建一个WebSocket服务器,监听在9999端口上:

第15~18行每隔3秒发送一个字符串到浏览器,用一个计数器标识每次发送的请求。

代码里所需的server.js我已经上传到我的Github上了:

https://github.com/i042416/KnowlegeRepository/blob/master/practice/nodejs/server.js

使用nodejs启动这个服务器:

网页端代码:

<html>
<script src="socket.io.dev.js">
</script>
<script>
console.log("1"); var socket = io('ws://127.0.0.1:9999');
socket.on('connect', function(){
console.log("connected!");
});
socket.on('event', function(data){
console.log("event: " + data);
}); socket.on('news', function(data){
console.log("data from server: " + JSON.stringify(data,2,2));
}); socket.on('disconnect', function(){
console.log("disconnect...");
}); </script>
</html>

浏览器端每隔三秒收到服务器推送的消息,打印在console上:

要获取更多Jerry的原创文章,请关注公众号"汪子熙":

一个最简单的WebSocket hello world demo的更多相关文章

  1. 用 Go 编写一个简单的 WebSocket 推送服务

    用 Go 编写一个简单的 WebSocket 推送服务 本文中代码可以在 github.com/alfred-zhong/wserver 获取. 背景 最近拿到需求要在网页上展示报警信息.以往报警信息 ...

  2. 如何使用AEditor制作一个简单的H5交互页demo

    转载自:http://www.alloyteam.com/2015/06/h5-jiao-hu-ye-bian-ji-qi-aeditor-jie-shao/ 本教程演示如何使用AEditor制作一个 ...

  3. Dubbo入门介绍---搭建一个最简单的Demo框架

    Dubbo入门---搭建一个最简单的Demo框架 置顶 2017年04月17日 19:10:44 是Guava不是瓜娃 阅读数:320947 标签: dubbozookeeper 更多 个人分类: D ...

  4. 一个简单的MariaDB认证插件demo

    代码地址如下:http://www.demodashi.com/demo/13076.html 一.前言 众所周知(其实可能很多人不知道)MariaDB支持插件认证.在MariaDB中新建用户,常见的 ...

  5. springboot搭建一个简单的websocket的实时推送应用

    说一下实用springboot搭建一个简单的websocket 的实时推送应用 websocket是什么 WebSocket是一种在单个TCP连接上进行全双工通信的协议 我们以前用的http协议只能单 ...

  6. 10分钟完成一个最最简单的BLE蓝牙接收数据的DEMO

    这两天在研究蓝牙,网上有关蓝牙的内容非常有限,Github上的蓝牙框架也很少很复杂,为此我特地写了一个最最简单的DEMO,实现BLE蓝牙接收数据的问题, 不需要什么特定的UUID, 不需要什么断开重连 ...

  7. 搭建CAS服务器,并实现一个简单的单点登录的demo

    官网:http://jasig.github.io/cas/Cas Server下载:http://developer.jasig.org/cas/Cas Client下载:http://develo ...

  8. socket.io简单说明及在线抽奖demo

    socket.io简单说明及在线抽奖demo socket.io 简介 Socket.IO可以实现实时双向的基于事件的通信. 它适用于各种平台,浏览器或设备,也同样注重可靠性和速度. socket.i ...

  9. WebSocket简单介绍(WebSocket 实战)(3)

    这一节里我们用一个案例来演示怎么使用 WebSocket 构建一个实时的 Web 应用.这是一个简单的实时多人聊天系统,包括客户端和服务端的实现.客户端通过浏览器向聊天服务器发起请求,服务器端解析客户 ...

随机推荐

  1. [转]iCheck表单美化插件使用方法详解(含参数、事件等)

    本文转自:http://www.exp99.com/jswz/f2e/1408696007_34.html iCheck   特色: 1.在不同浏览器(包括ie6+)和设备上都有相同的表现 — 包括 ...

  2. grafana 安装- 曲线图展示每秒新增数据量

    下载: https://dl.grafana.com/oss/release/grafana-5.4.2.windows-amd64.zip 解压就能用 添加数据源 添加查询条件 sql 模式编写查询 ...

  3. vue.js 项目打包

    vuejs是个前端框架,npm run dev的目的在于前端开发的时候可以实时调试.所以npm run dev 只是开发时期会用到,在生产环境中我们应该使用nginx,apahce tomcat等应用 ...

  4. drupal7 formAPI给元素加css样式

    比如,我定义了一个表单元素,名字叫做包库开始日期, $form['starttime_baoyue']=array( '#type'=>'textfield', '#title'=>t(' ...

  5. html基础-标题标签-文字标签(2)

    昨天说道了我的第一个网页,今天接着继续带大家深入,前期学习千万不要用代码工具哦!那样就少了深入了解的机会了哦! 一.大家都知道文章会有各种标题,网页其实也跟文章差不多也有专门来写标题的元素. (1). ...

  6. Ubuntu下编译opencv 和Ubuntu使用ffmpeg实现音频、视频的抽取

    一.使用Ubuntu编译opencv (前提是Ubuntu内已经正确配置了opencv,个人采用opencv3.2) g++ 1.cpp -o 1 `pkg-config --cflags --lib ...

  7. ArcGIS10.3+Oracle12C+ArcGIS Server10.3安装布署(之二)

    1.创建PDB 输入 dbca 命令 2.安装完成后,连接PDBSDE的容器数据库 3.环境变量 从Oracle的官方网站下载   instantclient-basic-nt-12.1.0.2.0. ...

  8. 在android工程中,res目录下又有anim、drawable、layout、menu、raw、values和xml文件夹,分别用来保存?

    res目录主要是存放资源文件的!layout 布局 这个就是你经常看到的与用户交互的界面的 xml 文件,就是各个 view 的排列和嵌套,没什 么好说的啦 风格和主题. 风格主要是指 view 的显 ...

  9. frame shiro 认证示例及原理简述

    shiro 认证流程 1.创建一个 javaSE 的maven项目(quickstart),并添加依赖 <dependency> <groupId>junit</grou ...

  10. WEBserver 性能测试

    本地实验(Centos7),WEBserver性能测试; 软件包地址 wget http://download.joedog.org/siege/siege-4.0.2.tar.gztar -xf s ...