node.js和websocket实现echo

最近在学习node.js,其中一章讲了WebSocket相关的内容。我看的书是《了不起的node.js》。这本书中实现了一个echo例子,但是我照书上做的程序却出现了错误。书中使用了express和websocket.io实现的这个例子。然而例子的express版本还是古老的2.5.1,最新的已经是4..了,所以出了问题也不奇怪。

书中的服务器代码片段大概是这样的:

var express = require(‘express‘)
    , wsio = require("websocket.io")

var app = express.createServer();

var ws = wsio.attach(app);

app.use(express.static(‘public‘));
/*
*
*/
app.listen(3000);

前端代码index.html如下:

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>websocket echo</title>
</head>
<body>
<h1>websocket echo</h1>
<h2>latency:<span id="latency"></span>ms</h2>
<script>

    var lastMessage;
    window.onload=function(){
        //create socket

        var ws=new WebSocket(‘ws://127.0.0.1:3000‘);
        ws.onopen=function(){
            //send first ping
            ping();
        };
        console.log("going well!");
        // 监听Socket的关闭
        ws.onclose = function(event) {
            console.log(‘Client notified socket has closed‘,event);
        };
        ws.onmessage=function(ev){
            console.log("got:"+ev.data);

            document.getElementById("latency").innerHTML=new Date-lastMessage;
            ping();
        };
        function ping(){
            lastMessage = new Date;
            ws.send("ping");
        }
    }
</script>
</body>
<html>

查了资料才知道新版的express已经没有createServer()这个方法了。然后我参考express 4.x的api文档改程序,也还是解决不了,浏览器显示“Connection closed before receiving a handshake response”。仔细回想一下,还是觉得自己没有理解express,所以就决定先不用express,而是直接用http。

var http = require(‘http‘)
    // use require(‘websocket.io‘) if you installed with NPM
  , wsio = require(‘websocket.io‘)

/**
 * Create HTTP server.
 */

var server = http.createServer(function (req, res) {
  res.writeHead(200, { ‘Content-Type‘: ‘text/html‘ });
  res.end([
  ‘<!DOCTYPE html>‘
    ,‘<html>‘
    /*index.html的内容*/
    ,‘</html>‘
  ].join(‘‘));
});

var ws = wsio.attach(server);

ws.on(‘connection‘, function (socket) {
    socket.on(‘message‘, function (msg) {
        console.log(‘ \033[96mgot:\033[39m ‘ + msg);
        socket.send(‘pong‘);
    });
});

server.listen(3000);

运行结果是正确的。然而这个正确代码看起来很不舒服,前端代码和服务器代码耦合在一起,长长的字符串数组我都不敢把它们贴上来。而且调试的时候根本看不清楚,所以我还是想用express的静态托管功能。于是继续看express的api。然后看到了:

var express = require(‘express’);

var http = require(‘http’);

var app = express();

http.createServer(app).listen(80);

原来app其实一个函数,所以可以使用它来创建传统的httpserver。然后我就得到了如下的服务器端代码:


var express = require(‘express‘)
    , wsio = require(‘websocket.io‘)
    , http = require(‘http‘)

var app = express();

app.use(express.static(‘public‘));

var server = http.createServer(app) 

var ws = wsio.attach(server);

ws.on(‘connection‘, function (socket) {
    socket.on(‘message‘, function (msg) {
        console.log(‘ \033[96mgot:\033[39m ‘ + msg);
        socket.send(‘pong‘);
    });
});

server.listen(3000);

运行效果也是正常的(index.html在public子目录下,和前文中的内容是一样的。)

版权声明:本文为博主原创文章,未经博主允许不得转载。

时间: 2024-11-12 22:30:15

node.js和websocket实现echo的相关文章

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

这一篇介绍一下基于node.js 的 websocket的移动端H5直播开发, 下载文章底部的源码,我是用vscode打开, 首先在第一个终端运行 npm run http-server 这个指令是运行http服务,手机端直接运行http://ip:8000/mpegts.html 即可看到推流过来的视频 新起一个终端运行 npm run ws-server,服务启动后,即可以通过ffmpeg进行推流. 推流过程如下: 推流视频文件: ffmpeg -re -i E:\2.mp4   -code

node.js实现WebSocket

最近在学习“HTML5游戏开发实战”,其中第8章内容是使用WebSocket来构建多人游戏---<你画我猜>.然而在实现过程中,却一直出错: 客户端请求时,服务器端会报错并终止: 而浏览器端也会出错: 服务器代码: var ws = require(__dirname + '\\lib\\ws\\server'); var server = ws.createServer(); server.addListener("connection",function(conn){

node.js基于websocket实时通信的实现—GoEasy

node.js websocket实时消息推送 在这里我记录一下之前如何实现服务器端与客户端实时通信: 实现步骤如下: 1.        获取GoEasy appkey. 在goeasy官网上注册一个账号,并新建一个app. APP创建好后系统会为该app自动生成两个key, 一个既可以用来接收又可以用来推送 (supper key),另一个只可以用来接收(subscriber key). 2.        客户端订阅一个channel. a.        在客户端引入goeasy.js,

Node.js配合WebSocket实现网页斗地主(一、环境配置)

最近闲着没事,研究了一下Node.js技术.发现Node.js真的很强大,它配合socket.io竟然可以实现Web的socket通讯技术.所以我决定来做个Web版的斗地主来好好玩玩这个WebSocket技术,呵呵!!! 先来部署环境 1.安装Node.js 根据自己的操作系统,去Node.js官网下载安装即可.如果成功安装.在命令行输入node -v和npm -v应该能看到相应的版本号.下面是我的版本信息 1 node -v 2 v4.0.0 3 npm -v 4 2.14.2 2.搭建Web

node.js之websocket协议的实现

websocket已经不是什么新鲜的东西了,要在node.js上实现也有socket.io这样好用的第三方模块.但是个人有代码洁癖,实在是受不了在HTML页面上多出一行如下代码:     <script src='http://192.168.0.143:4000/socket.io/socket.io.js'></script> 而且,项目上要实现的效果是和canvas交互,有些东西还是和socket封装在一起比较简单,所以自己踏上了探究websocket的道路. 顺便共享下我的

Windows下Node.js+Express+WebSocket 安装配置

Node.js是一个Javascript运行环境(runtime).实际上它是对Google V8引擎进行了封装.V8引 擎执行Javascript的速度非常快,性能非常好.Node.js对一些特殊用例进行了优化,提供了替代的API,使得V8在非浏览器环境下运行得更好.Node.js是一个基于Chrome JavaScript运行时建立的平台, 用于方便地搭建响应速度快.易于扩展的网络应用.Node.js 使用事件驱动, 非阻塞I/O模型而得以轻量和高效,非常适合在分布式设备上运行的数据密集型的

如何解决Vue.js里面noVNC的截图问题(2)——蛋疼的cookies验证和node.js的websocket代理

在上一篇讲noVNC截图功能的文章中,我们利用WebSocket协议的连接不检查跨域的特性解决了noVNC截图失败的问题. 但是这个方法仅限于没有cookies验证的noVNC服务,但是openstack的noVNC服务,每个虚拟机都要带token,而这个token,是写在cookies里面的. 看了openstack虚拟桌面的代码,知道里面的代码用token = WebUtil.getQueryVar('token', null);和WebUtil.createCookie('token',

websocket与node.js完美结合

之所以写下此文,是我觉得越是简单的技术往往能发挥越重要的作用,随着各种新的技术的诞生,实时web技术已经走进我们.websocket和node.js使开发实时应用非常简单,同时性能也非常高. 关于websocket websocket是html5的重要feature,它直接在浏览器上对与socket的支持,这给了web开发无限的想象,虽然以前也有 flash socket+js的实现,不过毕竟不稳定,而且兼容性有很多问题,当然websocket的普及也依赖于支持html5标准的浏览器的更新,目前

面向Web Cloud的HTML5 App开发实战:Browser&amp;HTML5&amp;CSS3&amp;PhoneGap&amp;jQuery Mobile&amp; WebSocket&amp;Node.js(3天)

课程简介: 王家林老师(联系邮箱[email protected] 电话:18610086859 QQ:1740415547 微信号:18610086859) 22个HTML5主题一次性贯穿HTML5的一切技术: 一网打尽HTML5时代Device.(设备端).Browser(浏览器)和Cloud(浏览器)的所有技术: 以浏览器定制技术为基础,通晓HTML5+CSS3+PhoneGap+Web Socket +jQuery Mobile +Node.js等HTML5的六大核心技术: 最新研发的H