使用socket.io实现简单的聊天功能
Socket.io实际上是WebSocket的父集,Socket.io封装了WebSocket和轮询等方法
首先得在你的项目中安装socket.io
$ npm install socket.io
服务端代码:
var app=require('http').createServer()
var io=require('socket.io')(app)
var PORT =;
var clientCount=;
app.listen(PORT)
io.on('connection',function(socket){
clientCount++
socket.nickname='user'+clientCount
io.emit('enter',socket.nickname+' comes in')
socket.on('message',function(str){
io.emit('message',socket.nickname+' says: '+str)
})
socket.on('disconnect',function(){
io.emit('leave',socket.nickname+' left')
})
})
客户端代码:
<!DOCTYPE html>
<html>
<head>
<mate charset='utf-8' />
<title>websocket</title>
<script src="socket.io.js"></script>
</head>
<body> <h1>chat room</h1>
<input type="text" id='sendtxt' />
<button id='sendbtn'>发送</button>
<div id="recv"></div>
<script type="text/javascript">
var socket=io("ws://localhost:5555/"); function showMessage(str,type){
var div=document.createElement('div');
div.innerHTML=str;
if(type=='enter'){
div.style.color='blue';
}else if(type=='leave'){
div.style.color='red'
}
document.body.appendChild(div);
} document.getElementById('sendbtn').onclick=function(){
var txt=document.getElementById("sendtxt").value;
if(txt){
socket.emit('message',txt);
}
} socket.on('enter',function(data){
showMessage(data,'enter')
}) socket.on('message',function(data){
showMessage(data,'message')
}) socket.on('leave',function(data){
showMessage(data,'leave')
}) </script>
</body>
</html>
来自慕课网课程:
https://www.imooc.com/learn/861
使用socket.io实现简单的聊天功能的更多相关文章
- 使用socket.io开发简单群聊功能
1.新建package.json文件: { "name": "socket-chat-example", "version": " ...
- Spring 学习——基于Spring WebSocket 和STOMP实现简单的聊天功能
本篇主要讲解如何使用Spring websocket 和STOMP搭建一个简单的聊天功能项目,里面使用到的技术,如websocket和STOMP等会简单介绍,不会太深,如果对相关介绍不是很了解的,请自 ...
- vue + socket.io实现一个简易聊天室
vue + vuex + elementUi + socket.io实现一个简易的在线聊天室,提高自己在对vue系列在项目中应用的深度.因为学会一个库或者框架容易,但要结合项目使用一个库或框架就不是那 ...
- 基于react+react-router+redux+socket.io+koa开发一个聊天室
最近练手开发了一个项目,是一个聊天室应用.项目虽不大,但是使用到了react, react-router, redux, socket.io,后端开发使用了koa,算是一个比较综合性的案例,很多概念和 ...
- 利用socket.io实现多人聊天室(基于Nodejs)
socket.io简单介绍 在Html5中存在着这种一个新特性.引入了websocket,关于websocket的内部实现原理能够看这篇文章.这篇文章讲述了websocket无到有,依据协议,分析数据 ...
- 采用tcp协议和UDP协议实现简单的聊天功能
Date: 2019-06-19 Author: Sun 一. Python3输出带颜色字体 实现过程: 终端的字符颜色是用转义序列控制的,是文本模式下的系统显示功能,和具体的语言无关. 转义 ...
- 基于Node.js+socket.IO创建的Web聊天室
这段时间进了一个新的项目组,项目是用Appcan来做一个跨平台的移动运维系统,其中前台和后台之间本来是打算用WebSocket来实现的,但写好了示例后发现android不支持WebSocket,大为受 ...
- 基于 socket.io, 简单实现多平台类似你猜我画 socket 数据传输
一.前言 socket.io 实现了实时双向的基于事件的通讯机制,是基于 webSocket 的封装,但它不仅仅包括 webSocket,还对轮询(Polling)机制以及其它的实时通信方式封装成了通 ...
- android中实现简单的聊天功能
这个例子只是简单的实现了单机版的聊天功能,自己跟自己聊,啦啦~~ 主要还是展示RecyclerView控件的使用吧~ 参考我之前写的文章: android中RecyclerView控件的使用 andr ...
随机推荐
- UML类图记忆口诀
UML类图在设计模式书籍中用的比较多,经常忘记,口诀挺重要的,比如我们从小到大,除了乘法口诀.元素周期表等口诀形式的知识,其它的知识都基本忘记了, 所以编写口诀如下 1.三级石 2.见关一 3.零足迹 ...
- Peewee之playhouse中的数据库连接池
参见 http://note.youdao.com/noteshare?id=104255d91b5a00d716a713ae36e911fd 目前在学习Python库的源码,这是第二篇,比较简单的功 ...
- Key ssd_300_vgg/block3_box/L2Normalization/gamma not found in checkpoint的解决方案
在Tensorflow下使用SSD模型训练自己的数据集时,经过查找很多博客资料,已经成功训练出来了自己的模型,但就是在测试自己模型效果的时候,出现了如下错误. 2019-10-27 14:47:12. ...
- 从时序异常检测(Time series anomaly detection algorithm)算法原理讨论到时序异常检测应用的思考
1. 主要观点总结 0x1:什么场景下应用时序算法有效 历史数据可以被用来预测未来数据,对于一些周期性或者趋势性较强的时间序列领域问题,时序分解和时序预测算法可以发挥较好的作用,例如: 四季与天气的关 ...
- ASP.NET MVC+Easyui 后台管理系统的图片上传
实现图片的上传 easyui代码部分: //添加按钮 var URL; $("#btnCreate").click(function () { $('#UserDialog').d ...
- C#工具类MySqlHelper,基于MySql.Data.MySqlClient封装
源码: using System; using System.Collections.Generic; using System.Linq; using System.Text; using Syst ...
- Python——全国瓜子二手车数据分析
继瓜子二手车数据爬去之后,在此进行处理分析 Pycharm代码 # coding:utf8 # author:Jery # datetime:2019/5/3 17:35 # software:PyC ...
- vue中通过WeixinJSBridge关闭微信公众号当前页面,返回微信公众号首页
之前有个需求,点击菜单进入到微信公众号模块,然后点击返回的时候不知道到哪里去,后来觉得点返回的时候直接关闭页面,但是window.close()并不能关闭页面,然后经过查找资料,发现通过以下方法可以 ...
- CentOS 7.0 使用yum 安装 Mariadb
第一步: 使用命令查看是否已经安装: mysql -u root -p 返回 Enter password: 时表示已经安装成功的,需要卸载安装. 第二步: 使用yum直接安装mariadb,注意带 ...
- Spark MLlib基本算法【相关性分析、卡方检验、总结器】
一.相关性分析 1.简介 计算两个系列数据之间的相关性是统计中的常见操作.在spark.ml中提供了很多算法用来计算两两的相关性.目前支持的相关性算法是Pearson和Spearman.Correla ...