websocket:用语服务器端主动向客户端推送消息

本例基于koa框架编写用例:服务器端需要安装相关模块 koa koa-socket co等

服务器端脚本:(需要安装相关模块 koa koa-socket co等)
//服务端
const Koa = require( 'koa' )
const IO = require( 'koa-socket' )
const co = require( 'co' ) const app = new Koa()
const io = new IO({
namespace:"mysocket",
ioOptions:{
path:'/restapi/websocketstock'
}
})
const TIME = 3000; //定时向客户端发送消息
let TimerId = null; io.use( co.wrap( function *( ctx, next ) {
let start = new Date()
yield next()
console.log( `response time: ${ new Date() - start }ms` )
})) // io.use( ... ); io.on("connection",function(){ //连接成功
console.log("successfully connect to websocket");
}); //定时向客户端推送消息
function sendToClient(){
TimerId = setInterval(function(){
io.broadcast('stockchallenge', {"userNum":parseInt(Math.random()*100)});
},TIME);
} //监控客户端发来的消息源
io.on('messageClient', ( ctx, data ) => {
console.log("来自客户端的消息");
console.log(data);
}) io.attach( app );
sendToClient(); app.listen( 3004 );
console.log("app is listening at 3004");

  

客户端脚本:在客户端,websocket需要浏览器支持才能使用,不过有许多js脚本对浏览器做了兼容性封装,本例以socket.io为例,

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<div>users count: <span id="count"></span></div>
<script src="js/socket.io.js"></script>
<script> var socket = io.connect( "http://机器名:3004/mysocket",{
path:"/restapi/websocketstock"
}); socket.on("connect",function(){
console.log("连接成功");
}); var sessionId;
//监控服务器端的消息 stockchallenge
socket.on("stockchallenge", function (data) {
console.log("来自服务器端的消息",data);
document.getElementById("count").innerHTML = data.userNum; }); </script>
</body>
</html>

  

基于node的websocket示例的更多相关文章

  1. 基于Node.js + WebSocket 的简易聊天室

    代码地址如下:http://www.demodashi.com/demo/13282.html Node.js聊天室运行说明 Node.js的本质就是运行在服务端的JavaScript.Node.js ...

  2. Websocket - Websocket原理(握手、解密、加密)、基于Python实现简单示例

    一.Websocket原理(握手.解密.加密) WebSocket协议是基于TCP的一种新的协议.WebSocket最初在HTML5规范中被引用为TCP连接,作为基于TCP的套接字API的占位符.它实 ...

  3. 基于node.js 的 websocket的移动端H5直播开发

    这一篇介绍一下基于node.js 的 websocket的移动端H5直播开发, 下载文章底部的源码,我是用vscode打开, 首先在第一个终端运行 npm run http-server 这个指令是运 ...

  4. 基于Node.js的实时推送 juggernaut

    基于Node.js的实时推送 juggernaut Juggernaut 基于 Node.js 构建.为浏览器和服务器端提供一个实时的连接,可在客户端和服务器端进行数据的实时推送,适合多角色游戏.聊天 ...

  5. 转:php使用websocket示例详解

    原文来自于:http://www.jb51.net/article/48019.htm 这篇文章主要介绍了php使用websocket示例,需要的朋友可以参考下   下面我画了一个图演示 client ...

  6. 基于Node.js的强大爬虫 能直接发布抓取的文章哦

    基于Node.js的强大爬虫 能直接发布抓取的文章哦 基于Node.js的强大爬虫能直接发布抓取的文章哦!本爬虫源码基于WTFPL协议,感兴趣的小伙伴们可以参考一下 一.环境配置 1)搞一台服务器,什 ...

  7. WebSocket 示例

    websocket应运而生 在WebSocket规范提出之前,开发人员若要实现带有即时通信.实时数据.订阅推送等功能的应用实时性较强的功能,经常会使用的解决方法是 Comet. Comet是一种服务器 ...

  8. 基于node.js人脸识别之人脸对比

    基于node.js人脸识别之人脸对比 Node.js简介 Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境. Node.js 使用了一个事件驱动.非阻塞式 I/O ...

  9. 基于 Node.js 的服务器自动化部署搭建实录

    基于 Node.js 的服务器自动化部署搭建实录 在服务器上安装 Node.js 编写拉取仓库.重启服务器脚本 配置 Github 仓库的 Webhook 设置 配置 Node.js 脚本 其他问题 ...

随机推荐

  1. css常用属性2

    1  浮动和清除浮动 在上篇的第十一节--定位中说道: CSS 有三种基本的定位机制:普通流.浮动和绝对定位. 普通流和绝对定位已经说完,接下来就是浮动了. 什么是浮动? CSS 的 Float(浮动 ...

  2. uva 10391

    这个题,单纯做出来有很多种方法,但是时间限制3000ms,因此被TL了不知道多少次,关键还是找对最优解决方法,代码附上: #include<bits/stdc++.h> using nam ...

  3. Android Studio 字体和字号调整

    点击File,Settings. 找到Editor-Colors&Fonts-Font 点击Save As... 改个名字点击OK. 1为字体,2为字号,3为行间距. 我认为字体设置为Cons ...

  4. Treblecross 博弈SG值

    Treblecross is a two player game where the goal is to get three X in a row on a one-dimensional boar ...

  5. Gate One——用web展示Terminal(安装)

    Gate One可以用web来展示Terminal,虽然存在一些小缺陷,基本功能都还可以的,有兴趣的可以折腾一下. 安装环境: 系统:RHEL 6.1 ,系统自带python 2.6.6 下载需要安装 ...

  6. RobotFramework自动化测试框架-移动手机自动化测试Click A Point关键字的使用

    Click A Point关键字用来模拟点击APP界面上的一个点,该关键字接收两个三个参数[ x=0 | y=0 | duration=100 ],x和y代表的是点的坐标位置,duration代表的是 ...

  7. PE文件格式详解,第二讲,NT头文件格式,以及文件头格式

    PE文件格式详解,第二讲,NT头文件格式,以及文件头格式 作者:IBinary出处:http://www.cnblogs.com/iBinary/版权所有,欢迎保留原文链接进行转载:) PS:本篇博客 ...

  8. codesmith连接Mysql提示“找不到请求的 .Net Framework Data Provider。可能没有安装。"

    1,首先需要将MySql.Data.dll复制到codesmith安装目录下bin文件夹下,注意dll的版本 2,其次因为codesmith7采用的是.net4.0的配置文件,(64位系统)找到C:\ ...

  9. 一步使你的asp.net网站在手机浏览器上全屏显示

    首先要加入下面的代码: <meta name="viewport" content="width=device-width, initial-scale=1.0, ...

  10. LinearGradientBrush,RadialGradientBrush的样式说明

    LinearGradientBrush 使用线性渐变绘制区域.线性渐变沿直线定义渐变.该直线的终点由线性渐变的 StartPoint 和 EndPoint 属性定义.LinearGradientBru ...