node.js中ws模块创建服务端和客户端,网页WebSocket客户端


Posted in Javascript onMarch 06, 2019

首先下载websocket模块,命令行输入

npm install ws

1.node.js中ws模块创建服务端

// 加载node上websocket模块 ws;
var ws = require("ws");
// 启动基于websocket的服务器,监听我们的客户端接入进来。
var server = new ws.Server({
 host: "127.0.0.1",
 port: 6080,
});
// 监听接入进来的客户端事件
function websocket_add_listener(client_sock) {
 // close事件
 client_sock.on("close", function() {
 console.log("client close");
 });
 // error事件
 client_sock.on("error", function(err) {
 console.log("client error", err);
 });
 // end 
 // message 事件, data已经是根据websocket协议解码开来的原始数据;
 // websocket底层有数据包的封包协议,所以,绝对不会出现粘包的情况。
 // 每解一个数据包,就会触发一个message事件;
 // 不会出现粘包的情况,send一次,就会把send的数据独立封包。
 // 如果我们是直接基于TCP,我们要自己实现类似于websocket封包协议就可以完全达到一样的效果;
 client_sock.on("message", function(data) {
 console.log(data);
 client_sock.send("Thank you!");
 });
 // end 
}
// connection 事件, 有客户端接入进来;
function on_server_client_comming (client_sock) {
 console.log("client comming");
 websocket_add_listener(client_sock);
}
server.on("connection", on_server_client_comming);
// error事件,表示的我们监听错误;
function on_server_listen_error(err) {
}
server.on("error", on_server_listen_error);
// headers事件, 回给客户端的字符。
function on_server_headers(data) {
 // console.log(data);
}
server.on("headers", on_server_headers);

2.node.js中ws模块创建客户端

var ws = require("ws");
// url ws://127.0.0.1:6080
// 创建了一个客户端的socket,然后让这个客户端去连接服务器的socket
var sock = new ws("ws://127.0.0.1:6080");
sock.on("open", function () {
 console.log("connect success !!!!");
 sock.send("HelloWorld1");
 sock.send("HelloWorld2");
 sock.send("HelloWorld3");
 sock.send("HelloWorld4");
 sock.send(Buffer.alloc(10));
});
sock.on("error", function(err) {
 console.log("error: ", err);
});
sock.on("close", function() {
 console.log("close");
});
sock.on("message", function(data) {
 console.log(data);
});

3.网页客户端创建(使用WebApi --->WebSocket)

<!DOCTYPE html>
<html>
<head>
 <title>skynet websocket example</title>
</head>
<body>
 <script>
 var ws = new WebSocket("ws://127.0.0.1:6080/index.html");
 ws.onopen = function(){
 alert("open");
 ws.send("WebSocket hellowrold!!");
 };
 ws.onmessage = function(ev){
 alert(ev.data);
 };
 ws.onclose = function(ev){
 alert("close");
 };
 ws.onerror = function(ev){
 console.log(ev);
 alert("error");
 };
 </script>
</body>
</html>

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,谢谢大家对三水点靠木的支持。如果你想了解更多相关内容请查看下面相关链接

Javascript 相关文章推荐
用Javascript读取中文COOKIE的解决办法
Feb 15 Javascript
jquery实现的元素的left增加N像素 鼠标移开会慢慢的移动到原来的位置
Mar 21 Javascript
extjs中grid中嵌入动态combobox的应用
Jan 01 Javascript
jquery.cookie.js 操作cookie实现记住密码功能的实现代码
Apr 27 Javascript
Javascript页面添加到收藏夹的简单方法
Aug 07 Javascript
js获取URL的参数的方法(getQueryString)示例
Sep 29 Javascript
Javascript实现图片懒加载插件的方法
Oct 20 Javascript
bootstrap weebox 支持ajax的模态弹出框
Feb 23 Javascript
在vue中封装可复用的组件方法
Mar 01 Javascript
turn.js异步加载实现翻书效果
Jul 25 Javascript
vue2.0 解决抽取公用js的问题
Jul 31 Javascript
vue 数字翻牌器动态加载数据
Apr 20 Vue.js
node.js中express模块创建服务器和http模块客户端发请求
Mar 06 #Javascript
微信小程序性能优化之checkSession的使用
Mar 06 #Javascript
详解在微信小程序的JS脚本中使用Promise来优化函数处理
Mar 06 #Javascript
移动端(微信等使用vConsole调试console的方法
Mar 05 #Javascript
利用Vconsole和Fillder进行移动端抓包调试方法
Mar 05 #Javascript
深入理解Puppeteer的入门教程和实践
Mar 05 #Javascript
[jQuery] 事件和动画详解
Mar 05 #jQuery
You might like
利用递归把多维数组转为一维数组的函数
2006/10/09 PHP
PHP include任意文件或URL介绍
2014/04/29 PHP
PHP页面实现定时跳转的方法
2014/10/31 PHP
PHP利用Socket获取网站的SSL证书与公钥
2017/06/18 PHP
Laravel 5.5 的自定义验证对象/类示例代码详解
2017/08/29 PHP
Laravel框架实现model层的增删改查(CURD)操作示例
2018/05/12 PHP
YUI 读码日记之 YAHOO.lang.is*
2008/03/22 Javascript
基于jQuery的input输入框下拉提示层(自动邮箱后缀名)
2012/06/14 Javascript
jQuery常见开发技巧详细整理
2013/01/02 Javascript
javascript中的self和this用法小结
2014/02/08 Javascript
JavaScript中获取鼠标位置相关属性总结
2014/10/11 Javascript
Atitit.js的键盘按键事件捆绑and事件调度
2016/04/01 Javascript
关于javascript的一些知识以及循环详解
2016/09/12 Javascript
jQuery使用getJSON方法获取json数据完整示例
2016/09/13 Javascript
headjs实现网站并行加载但顺序执行JS
2016/11/29 Javascript
JavaScript实现两个select下拉框选项左移右移
2017/03/09 Javascript
js学习总结之DOM2兼容处理重复问题的解决方法
2017/07/27 Javascript
[56:24]DOTA2上海特级锦标赛主赛事日 - 3 胜者组第二轮#1Liquid VS MVP.Phx第二局
2016/03/04 DOTA
Python中使用动态变量名的方法
2014/05/06 Python
用Python实现一个简单的能够发送带附件的邮件程序的教程
2015/04/08 Python
python tkinter实现彩球碰撞屏保
2019/07/30 Python
Python任务自动化工具tox使用教程
2020/03/17 Python
python实现单张图像拼接与批量图片拼接
2020/03/23 Python
Jupyter打开图形界面并画出正弦函数图像实例
2020/04/24 Python
使用Keras中的ImageDataGenerator进行批次读图方式
2020/06/17 Python
Pycharm2020.1安装无法启动问题即设置中文插件的方法
2020/08/07 Python
移动Web—CSS为Retina屏幕替换更高质量的图片
2012/12/24 HTML / CSS
应届大专毕业生个人自荐信
2013/09/22 职场文书
中专毕业生自我鉴定
2014/02/02 职场文书
职位说明书范文
2014/05/07 职场文书
球队口号
2014/06/18 职场文书
客户经理岗位职责大全
2015/04/09 职场文书
校园之声广播稿
2015/08/18 职场文书
2019财务转正述职报告
2019/06/27 职场文书
2019最新婚庆对联集锦!
2019/07/10 职场文书
LayUI+Shiro实现动态菜单并记住菜单收展的示例
2021/05/06 Javascript