WebSocket

WebSocket是一个协议，它是是基于TCP的一种新的网络协议，TCP协议是一种持续性的协议，和HTTP不同的是，它可以在服务器端主动向客户端推送消息。通过这个协议，可以在建立一个nodejs的服务器，然后所有的客户端都可以向服务器端发送消息，然后服务器端把这个消息广播出去，形成了一个类似于聊天室的东西。

客户端：

 <!DOCTYPE html>

 <html>

 <head>

     <meta charset="utf-8" />

     <title>websoket</title>

 </head>

 <body>

     <h1>chat room</h1>

     <input type="text" id="msg" />

     <button id="send">发送</button>

     <script type="text/javascript">

         var websocket = new WebSocket("ws://localhost:6666/");

         function showMsg(str){

             var div = document.createElement('div');

             div.innerHTML = str;

             document.body.appendChild(div)

         }

         websocket.onopen=function(){

             console.log("open");

             document.getElementById('send').onclick = function() {

                 var txt = document.getElementById('msg').value;

                 if (txt) {

                     websocket.send(txt);

                 }

             }

         }

         websocket.onclose = function() {

             console.log("close");

         }

         websocket.onmessage = function(e) {

             console.log(e.data);

             showMsg(e.data);

         }

     </script>

 </body>

 </html>

从我的服务器localhost:6666实例化一个新的websocket，然后打开他监听发送按钮，点击发送就把txt发送到服务器端，然后监听得到的消息，通过showMsg渲染到界面上去

服务器端(node.js)：

 var ws = require("nodejs-websocket")

 var port = 6666;

 var clientCount = 0;

 var server = ws.createServer(function (conn) {

     console.log("New connection")

     clientCount++

     conn.nickname = "user" + clientCount

     broadcast("******* "+conn.nickname + " comes in *******");

     conn.on("text", function (str) {

         console.log("Received "+str)

         broadcast(conn.nickname + " say: " + str)

     })

     conn.on("close", function (code, reason) {

         broadcast("******* " + conn.nickname + " left *******");

     })

     conn.on("error", function(err) {

         console.log("error: "+err);

     })

 }).listen(port)

 console.log("websocket server listening on " + port);

 function broadcast (str) {

     server.connections.forEach(function (connection) {

         connection.sendText(str)

     })

 }

之前要加载一下nodejs-websocket模块，来一个人就把计数器加1，然后给他设置名字，监听收到的消息text，有消息就执行broadcast，broadcast就是向所有的客户端广播新的消息

举个例子

这里是我服务器上的栗子，大家可以看看

http://www.xiedashuaige.cn/websocket.html

通过WebSocket实现一个简单的聊天室功能的更多相关文章

  1. 如何用WebSocket实现一个简单的聊天室以及单聊功能

    百度百科中这样定义WebSocket:WebSocket协议是基于TCP的一种新的网络协议.它实现了浏览器与服务器全双工(full-duplex)通信——允许服务器主动发送信息给客户端.简单的说,We ...

  2. Netty学习笔记(四) 简单的聊天室功能之服务端开发

    前面三个章节,我们使用了Netty实现了DISCARD丢弃服务和回复以及自定义编码解码,这篇博客,我们要用Netty实现简单的聊天室功能. Ps: 突然想起来大学里面有个课程实训,给予UDP还是TCP ...

  3. 基于websocket实现的一个简单的聊天室

    本文是基于websocket写的一个简单的聊天室的例子,可以实现简单的群聊和私聊.是基于websocket的注解方式编写的.(有一个小的缺陷,如果用户名是中文,会乱码,不知如何处理,如有人知道,请告知 ...

  4. [SignalR]一个简单的聊天室

    原文:[SignalR]一个简单的聊天室 1.说明 开发环境:Microsoft Visual Studio 2010 以及需要安装NuGet. 2.添加SignalR所需要的类库以及脚本文件: 3. ...

  5. 用ServletContext做一个简单的聊天室

    这里主要是ServletContext的一个特性:ServletContext是一个公共的空间,可以被所有的客户访问.由此可见ServletContext比cookie和session的作用范围要大[ ...

  6. WebSocket介绍和一个简单的聊天室

    WebSocket是什么呢? WebSocket一种在单个 TCP 连接上进行全双工通讯的协议.WebSocket通信协议于2011年被IETF定为标准RFC 6455,并被RFC7936所补充规范, ...

  7. ASP.NET Signalr 2.0 实现一个简单的聊天室

    学习了一下SignalR 2.0,http://www.asp.net/signalr 文章写的很详细,如果头疼英文,还可以机翻成中文,虽然不是很准确,大概还是容易看明白. 理论要结合实践,自己动手做 ...

  8. Netty学习笔记(六) 简单的聊天室功能之WebSocket客户端开发实例

    在之前的Netty相关学习笔记中,学习了如何去实现聊天室的服务段,这里我们来实现聊天室的客户端,聊天室的客户端使用的是Html5和WebSocket实现,下面我们继续学习. 创建客户端 接着第五个笔记 ...

  9. node实现一个简单的聊天室（认识一下socket）

    边学边理解node的高深,今天写了一个聊天室的demo,很简单,认识一下socket node服务端代码 var express = require('express'); var app = exp ...

随机推荐

  1. 在Notepad++中添加运行快捷键

    在Notepad++中有运行的快捷键,想着如果编辑完Python文件能直接运行就好了,于是尝试了一下. 我安装的是win8.1,安装的notepad++将运行快捷键的文件shortcuts.xml,放 ...

  2. 基于‘BOSS直聘的招聘信息’分析企业到底需要什么样的PHP程序员

    原文地址:http://www.jtahstu.com/blog/scrapy_zhipin_php.html 基于'BOSS直聘的招聘信息'分析企业到底需要什么样的PHP程序员 标签(空格分隔): ...

  3. linux进程管理和系统状态查看命令简介

    1 进程管理简介 进程(Process)是计算机中的程序关于某数据集合上的一次运行活动,是系统进行资源分配和调度的基本单位,是操作系统结构的基础 2 常用命令 2.1 pstree 2.1.1 功能描 ...

  4. 什么是BSD？

       BSD (Berkeley Software Distribution,伯克利软件套件)是Unix的衍生系统,1970年代由加州大学伯克利分校开创.BSD用来代表由此派生出的各种套件集合. BS ...

  5. Android之通过网络播放一首简单的音乐

    首先,附上程序执行后的效果.例如以下图所看到的: 一.部署一个web项目到tomcatserver上: 1.这个小程序是结合网络来播放一首音乐的,首先,把我们搞好的一个web项目放置在tomcat安装 ...

  6. 赵雅智：service与訪问者之间进行通信，数据交换

    服务类 中间人:service服务中的bind对象 创建中间人并通过onBinder方法的return暴露出去 watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQ ...

  7. 【剑指Offer学习】【面试题50：树中两个结点的最低公共祖先】

    题目:求树中两个结点的最低公共祖先,此树不是二叉树,而且没有指向父节点的指针. 树的结点定义 private static class TreeNode { int val; List<Tree ...

  8. Cocos2d-x3.0 触摸事件

    TouchableSpriteTest auto winSize = Director::getInstance()->getWinSize(); Point origin = Director ...

  9. 在线安装eclipse中html/jsp/xml editor插件（很可靠）

    之前有一篇文章也是安装eclipse中的web开发插件 ,可是经过非常多人使用,那种方法.不是全部人使用都能够. 接下来,找到一种很管用的方法.就是在线安装. 废话不多说,这样的方法绝对能够成功安装. ...

  10. jquery 自定义选择器

    // HTML 代码 <body> <div id="divid1" class="divclass">白色</div> & ...