websocket+node.js 实时聊天系统问题咨询

1.最近新学习websocket。做了一个实时聊天。用Node.js搭建的服务:serevr.js. 两个相互通信页面:client.html 和server.html

但是就是有很多问题,想让知道的人帮我看看哈:

我先把代码贴出来:

server.js:

 var ws=require("nodejs-websocket");

 console.log("开始建立连接...");

 var str1=null,str2=null, clientReady=false,serverReady=false;

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

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

         console.log(str);

          /**

           * 用户小雨第一次连接

           */

        if(str==="小雨"){

              str1=conn;

              clientReady=true;

              str1.sendText("欢迎"+str); 

        }

        /**

         * 用户小乔第一次连接

         */

        if(str==="小乔"){

             str2=conn;

             serverReady=true;

            str2.sendText("欢迎"+str);

        }

      

        /**

         * 当有第二个用户连接时。

         */

         if(clientReady&&serverReady){

            str2.sendText(str);

            str1.sendText(str);

        }

            

     })

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

         console.log("关闭连接");

     })

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

         console.log("异常关闭")

     });

 }).listen(8082);

 console.log("websocket连接完毕")

client.html:

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<meta http-equiv="X-UA-Compatible" content="ie=edge">

<title>Document</title>

<style>

.kuang{

width: 600px;

min-height: 50px;

max-height:296px;

border:1px solid;

float: left;

display:  block;

position:relative;

overflow-y: scroll;

}

.value{

width: 200px;

}

.input{

display:block;

position: absolute;

left:0;

margin-top: 300px;

}

</style>

</head>

<body>

<label>连接用户:</label>

<input type="text" id="name" value="小雨"  readonly/>

<button id="conn">连接</button>

<button id="close">断开</button><br/><br/>

<div class="kuang" id="mess"></div>

<div class="input">

<input type="text" class="value" id="value1"  />

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

</div>

<script>

var name=document.getElementById("name").value;

var mess=document.getElementById("mess");

var value1=document.getElementById("value1");

var conn= document.getElementById("conn");

var close=document.getElementById("close");

close.disabled=true;

if(window.WebSocket){

conn.onclick=function(){

var ws=new WebSocket(‘ws://127.0.0.1:8082‘);

conn.disabled=true;

close.disabled=false;

ws.onopen=function(e){

console.log("连接服务器成功");

ws.send(name);

}

ws.onmessage=function(e){

var time=new Date();

mess.innerHTML+=time.toUTCString()+":"+e.data+"<br>";

document.getElementById("send").onclick=function(e){

ws.send(name+"说:"+value1.value);

value1.value=" ";

}

document.onkeydown = function(e) {

e = e || window.event;

if(e.keyCode == 13) {

document.getElementById("send").onclick();

return false;

}

}

}

/**

* 客户端主动断开连接

*

* **/

close.onclick=function(){

ws.onclose();

conn.disabled=false;

close.disabled=true;

}

ws.onclose = function(e){

console.log("服务器关闭");

}

ws.onerror = function(){

console.log("连接出错");

}

}

}

</script>

</body>

</html>

server.html 页面和client.html的代码一样,就是用户名字换成小乔啦。

接下来就是问题啦:

1.运行界面:

client.html  连接以后:

本来服务器只需要回传一个欢迎小雨的,然后下面还输出了一个。

server.html  小乔连接以后也出来了一个小乔,按理是欢迎小乔。然后告诉小乔小雨在线了。

2.两个页面代码一样,但是就是不能只变成一个页面,硬要两个才能聊天。

3.server.js那边逻辑有点问题,一直理不清楚。

 

时间: 2025-01-21 20:16:58

websocket+node.js 实时聊天系统问题咨询的相关文章

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

如何理解Android架构设计的初心并开发出搭载Android系统并且具备深度定制和软硬整合能力特色产品,是本课程解决的问题. 课程以Android的五大核心:HAL.Binder.Native Service.Android Service(并以AMS和WMS为例).View System为主轴,一次性彻底掌握Android的精髓. 之所以是开发Android产品的必修课,缘起于: 1,     HAL是Android Framework&Application与底层硬件整合的关键技术和必修技

html5 websocket + node.js 实现网页聊天室

1 client:    socket.io server:   node.js +  express  + socket.io 一个简单的聊天室  demo,没有注册,内置了一些测试用户 2 client 关键代码 var socket = io.connect('http://localhost:8080'); socket.on('connect',function(){ console.log('connected to server'); socket.on('login succes

websocket + node.js聊天系统

转:http://www.cnblogs.com/Wayou/p/hichat_built_with_nodejs_socket.html 前端一直是一块充满惊喜的土地,不仅是那些富有创造性的页面,还有那些惊赞的效果及不断推出的新技术.像node.js这样的后端开拓者直接将前端人员的能力扩大到了后端.瞬间就有了一统天下的感觉,来往穿梭于前后端之间代码敲得飞起,从此由前端晋升为'前后端'. 图片来自G+ 本文将使用Node.js加web socket协议打造一个网页即时聊天程序,取名为HiChat

WebSocket+node.js创建即时通信的Web聊天服务器

1.使用nodejs-websocket nodejs-websocket是基于node.js编写的一个后端实现websocket协议的库, 连接:https://github.com/sitegui/nodejs-websocket. (1)安装 在项目目录下通过npm安装:npm install nodejs-websocket (2)创建服务器 //引入nodejs-websocket var ws = require("nodejs-websocket"); //调用creat

面向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

WebSocket+Node.js+dGram+Vue 入门级小系统

接了个基于UDP信号的实时可视化WebGIS系统项目,框架先搭起来: 一  udp和dgram npm安装下面两个包: const StringDecoder = require('string_decoder').StringDecoder; const dgram = require('dgram'); 主要接收代码如下: var serverSocket = dgram.createSocket('udp4'); const decoder = new StringDecoder('utf

细说WebSocket -- Node.js篇

在上一篇提高到了 web 通信的各种方式,包括 轮询.长连接 以及各种 HTML5 中提到的手段.本文将详细描述 WebSocket协议 在 web通讯 中的实现. 一.WebSocket 协议 1. 概述 websocket协议允许不受信用的客户端代码在可控的网络环境中控制远程主机.该协议包含一个握手和一个基本消息分帧.分层通过TCP.简单点说,通过握手应答之后,建立安全的信息管道,这种方式明显优于前文所说的基于 XMLHttpRequest 的 iframe 数据流和长轮询.该协议包括两个方

Fundebug上线Node.js错误监控啦

作为全栈JavaScript错误实时监测平台,Fundebug的Node.js实时错误监测服务上线啦,我们能够帮助开发者及时,高效地发现并且解决Node.js错误,从而提高开发效率,并提升用户体验. Fundebug为什么监测Node.js? 程序员通常是比较自信的,他们坚持自己写的代码没有问题.然而,再追问一下自己: 我的代码真的100%没有问题吗? 我做了完整的单元测试吗? 难道我要花更多的时间没完没了的写单元测试? 那么问题在哪? 当Node.js后台程序在服务器上出错了,然而开发者并不知

Node.js 推荐20多个学习网站及书籍

Web 开发人员对 Node.js 日益增多,更多的公司和开发者开始尝试使用 Node.js 来实现一些对实时性要求高,I/O密集型的业务. 介绍了很不错的书籍和案例,可以提高nodejs开发进度, Node.js Node 官方网站,Node.js 学习之路就起步,开发路途遥远 Nettuts Node.js Tutorial Node.js 编程的就是这样开始的, How To Node Node.js 教程一些文章列表 Node.js 文章列表 The Beginner Node Book