当前位置: 首页 > news >正文

WebSocket 使用示例,后台为nodejs

效果图

在这里插入图片描述

页面代码

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>WebSocket Client</title></head><body><script>const ws = new WebSocket('ws://localhost:8765')ws.onopen = () => {console.log('HTML: init!')ws.send(`HTML say -> I'm init!`)}ws.onmessage = event => {console.log('HTML listen: ', event.data)}ws.onerror = error => {console.error('HTML Error: ', error)}ws.onclose = event => {if (event.wasClean) {console.log('HTML Closed cleanly, code:',event.code,'reason:',event.reason)} else {console.error('HTML Connection died')}}</script></body>
</html>

服务后台代码

const WebSocket = require('ws')const wss = new WebSocket.Server({ port: 8765 })wss.on('connection', ws => {console.log('SERVER: init!')ws.on('message', message => {console.log('SERVER listen: %s', message)setInterval(() => {function getTwoNum(num) {return (+num < 10 ? '0' : '') + num}const now = new Date()const nowStr = `${now.getFullYear()}-${getTwoNum(now.getMonth() + 1)}-${getTwoNum(now.getDate())} ${getTwoNum(now.getHours())}:${getTwoNum(now.getMinutes())}:${getTwoNum(now.getSeconds())}`ws.send(`SERVER say -> ${nowStr}`)}, 3000)})
})

new WebSocket() api说明

var Socket = new WebSocket(url, [protocol] );
参数:

  • url, 指定连接的 URL
  • protocol 是可选的,指定了可接受的子协议

属性:

  • Socket.readyState 只读属性 readyState 表示连接状态(0-表示连接尚未建立; 1-表示连接已建立,可以进行通信; 2-表示连接正在进行关闭; 3-表示连接已经关闭或者连接不能打开)
  • Socket.bufferedAmount 只读属性 bufferedAmount 已被 send() 放入正在队列中等待传输,但是还没有发出的 UTF-8 文本字节数。

事件:

  • open Socket.onopen 连接建立时触发
  • message Socket.onmessage 客户端接收服务端数据时触发
  • error Socket.onerror 通信发生错误时触发
  • close Socket.onclose 连接关闭时触发

方法:

  • Socket.send() 使用连接发送数据
  • Socket.close() 关闭连接

相关文章:

WebSocket 使用示例,后台为nodejs

效果图 页面代码 <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8" /><meta name"viewport" content"widthdevice-width, initial-scale1.0" /><title>WebSocket Client</title&g…...

【算法】力扣【树形DP】687. 最长同值路径

【算法】力扣【树形DP】687. 最长同值路径 687. 最长同值路径 文章目录 【算法】力扣【树形DP】687. 最长同值路径题目描述输入输出示例 题解思路代码描述 复杂度分析总结 题目描述 本题要求在给定的二叉树中寻找最长的同值路径&#xff0c;这个路径中的每个节点的值都相同。…...

S32DS用PE调试报错

1、问题&#xff1a; 在S32DS上用PE进行调试报错&#xff1a; Error while launching command: --version 2、解决方法 按下图操作 填入内容&#xff1a; ${cross_prefix}gdb${cross_suffix}...

Day02-DDLDMLDQL(定义,操作,查询)(联合查询,子查询,字符集和校对集,MySQL5.7乱码问题)

文章目录 Day02-DDL&DML和DQL学习目标1. SQL语言的组成2. DDL2.1 数据库结构2.2 表结构2.3 约束2.3.1 主键约束(重要)(1)特点(2) 添加主键(3)删除主键(了解) 2.3.2 自增约束(1)特点(2) 添加自增约束(3)删除自增约束(了解) 2.3.3 非空约束(1)添加非空约束(2) 删除非空约束 2…...

3D高斯泼溅的崛起

沉浸式媒体领域正在以前所未有的速度发展&#xff0c;其中 3D 高斯溅射成为一项关键突破。 这项技术在广泛的应用中看起来非常有前景&#xff0c;并且可能会彻底改变我们未来创建数字环境以及与数字环境交互的方式。 在本文中&#xff0c;我们将通过与摄影测量和 NeRF 等前辈进…...

基于python+vue家政服务系统flask-django-php-nodejs

相比于以前的传统手工管理方式&#xff0c;智能化的管理方式可以大幅降低家政公司的运营人员成本&#xff0c;实现了家政服务的标准化、制度化、程序化的管理&#xff0c;有效地防止了家政服务的随意管理&#xff0c;提高了信息的处理速度和精确度&#xff0c;能够及时、准确地…...

用户中心项目(登录 + 用户管理功能后端)

文章目录 1.登录功能-后端1.思路分析2.完成对用户名和密码的校验1.com/sun/usercenter/service/UserService.java 添加方法2.com/sun/usercenter/service/impl/UserServiceImpl.java 添加方法3.com/sun/usercenter/service/impl/UserServiceImpl.java 新增属性 3.记录用户的登录…...

嵌入式相机WEB,用C直接处理?

以前用HTTP连接相机的时候&#xff0c;以为是相机内部有一个类似tomcat之类的WEB服务器。收到相机命令后&#xff0c;通过链接库执行动作。 昨天想给相机增加一个时间显示&#xff0c;增加的项目一点就跳转到登录。 于是问了之前负责的&#xff0c;说是要后端改。再问嵌入式相…...

LeetCode_31_中等_下一个排列

文章目录 1. 题目2. 思路及代码实现详解&#xff08;Python&#xff09;2.1 两遍扫描 1. 题目 整数数组的一个 排列 就是将其所有成员以序列或线性顺序排列。 例如&#xff0c; a r r [ 1 , 2 , 3 ] arr [1,2,3] arr[1,2,3] &#xff0c;以下这些都可以视作 a r r arr arr…...

huggingface的transformers训练gpt

目录 1.原理 2.安装 3.运行 ​编辑 4.数据集 ​编辑 4.代码 4.1 model init​编辑 forward&#xff1a; 总结&#xff1a; 关于loss和因果语言模型&#xff1a; ​编辑 交叉熵&#xff1a;​编辑 记录一下transformers库训练gpt的过程。 transformers/examples/…...

第六十一回 放冷箭燕青救主 劫法场石秀跳楼-编译安装飞桨paddlepaddle@openKylin+RISCV

卢俊义在水里被张顺抓住&#xff0c;用轿子抬到了梁山。宋江等人下马跪在地上迎接&#xff0c;请他坐第一把交椅。卢俊义宁死不从&#xff0c;大家只好说留他在山寨几天&#xff0c;先让李固带着马车货物回去。吴用对李固说&#xff0c;你的主人已经答应坐第二把交椅了&#xf…...

白话讲人工智能、机器学习、深度学习

人工智能&#xff08;Artificial Intelligence&#xff0c;AI&#xff09; 定义&#xff1a; 想象一个聪明的机器人&#xff0c;它能思考、决策和学习&#xff0c;就像电影里的智能角色那样。人工智能就是努力打造这样的智能实体的学科&#xff0c;它试图模仿、扩展乃至超越人…...

ssm项目(tomcat项目),定时任务(每天运行一次)相同时间多次重复运行job 的bug

目录标题 一、原因 一、原因 debug本地调试没有出现定时任务多次运行的bug&#xff0c;上传到服务器就出现多次运行的bug。&#xff08;war的方式部署到tomcat&#xff09; 一开始我以为是代码原因&#xff0c;或者是linux和win环境不同运行定时任务的方式不一样。 但是自己…...

vue3 + ts +element-plus + vue-router + scss + axios搭建项目

本地环境&#xff1a; node版本&#xff1a;20.10.0 目录 一、搭建环境 二、创建项目 三、修改页面 四、封装路由vue-router 五、element-plus 六、安装scss 七、封装axios 一、搭建环境 1、安装vue脚手架 npm i -g vue/cli 2、查看脚手架版本 vue -V3、切换路径到需…...

二叉树试题解析

一、单项选择题 01.下列关于二叉树的说法中&#xff0c;正确的是( C ). A.度为2的有序树就是二叉树 B.含有n个结点的二叉树的高度为 C.在完全二叉树中&#xff0c;若一个结点没有左孩子&#xff0c;则它必是叶结点 D.含有n个结点的完全二叉树的高度为解析&#xff1a;A 二叉树…...

计算机服务器中了faust勒索病毒怎么办,faust勒索病毒解密工具流程

网络是一把利剑&#xff0c;可以方便企业开展各项工作业务&#xff0c;为企业提供极大的便利&#xff0c;但随着网络技术的不断发展与应用&#xff0c;网络数据安全威胁也在不断增加&#xff0c;给企业的正常生产运营带来了极大困扰&#xff0c;近日&#xff0c;云天数据恢复中…...

初次部署麒麟V10系统需要的配置,快速完成测试环境的搭建

配置麒麟V10 设置“root”登录密码 sudo su -passwd # 设置登录密码允许“root”远程登录 sudo vim /etc/ssh/sshd_configsshd_config # ↓↓↓↓修改的内容↓↓↓↓ PermitRootLogin yes # ↑↑↑↑修改的内容↑↑↑↑重启服务 sudo systemctl restart sshd允许通过图像界…...

DOcker in Docker 原理与实战代码详解

Docker in Docker&#xff08;DinD&#xff09;指的是在Docker容器内部运行另一个Docker守护进程和客户端。这种技术可以用于创建嵌套的Docker环境&#xff0c;例如在持续集成/持续部署&#xff08;CI/CD&#xff09;管道中构建和测试Docker镜像。然而&#xff0c;需要注意的是…...

公司系统中了.rmallox勒索病毒如何恢复数据?

早晨上班时刻&#xff1a; 当阳光逐渐洒满大地&#xff0c;城市的喧嚣开始涌动&#xff0c;某公司的员工们纷纷踏入办公大楼&#xff0c;准备开始新的一天的工作。他们像往常一样打开电脑&#xff0c;准备接收邮件、查看日程、浏览项目进展。 病毒悄然发作&#xff1a; 就在员…...

论文阅读:Forget-Me-Not: Learning to Forget in Text-to-Image Diffusion Models

Forget-Me-Not: Learning to Forget in Text-to-Image Diffusion Models 论文链接 代码链接 这篇文章提出了Forget-Me-Not (FMN)&#xff0c;用来消除文生图扩散模型中的特定内容。FMN的流程图如下&#xff1a; 可以看到&#xff0c;FMN的损失函数是最小化要消除的概念对应的…...

XML Group端口详解

在XML数据映射过程中&#xff0c;经常需要对数据进行分组聚合操作。例如&#xff0c;当处理包含多个物料明细的XML文件时&#xff0c;可能需要将相同物料号的明细归为一组&#xff0c;或对相同物料号的数量进行求和计算。传统实现方式通常需要编写脚本代码&#xff0c;增加了开…...

网络六边形受到攻击

大家读完觉得有帮助记得关注和点赞&#xff01;&#xff01;&#xff01; 抽象 现代智能交通系统 &#xff08;ITS&#xff09; 的一个关键要求是能够以安全、可靠和匿名的方式从互联车辆和移动设备收集地理参考数据。Nexagon 协议建立在 IETF 定位器/ID 分离协议 &#xff08;…...

Ubuntu系统下交叉编译openssl

一、参考资料 OpenSSL&&libcurl库的交叉编译 - hesetone - 博客园 二、准备工作 1. 编译环境 宿主机&#xff1a;Ubuntu 20.04.6 LTSHost&#xff1a;ARM32位交叉编译器&#xff1a;arm-linux-gnueabihf-gcc-11.1.0 2. 设置交叉编译工具链 在交叉编译之前&#x…...

shell脚本--常见案例

1、自动备份文件或目录 2、批量重命名文件 3、查找并删除指定名称的文件&#xff1a; 4、批量删除文件 5、查找并替换文件内容 6、批量创建文件 7、创建文件夹并移动文件 8、在文件夹中查找文件...

阿里云ACP云计算备考笔记 (5)——弹性伸缩

目录 第一章 概述 第二章 弹性伸缩简介 1、弹性伸缩 2、垂直伸缩 3、优势 4、应用场景 ① 无规律的业务量波动 ② 有规律的业务量波动 ③ 无明显业务量波动 ④ 混合型业务 ⑤ 消息通知 ⑥ 生命周期挂钩 ⑦ 自定义方式 ⑧ 滚的升级 5、使用限制 第三章 主要定义 …...

《Playwright:微软的自动化测试工具详解》

Playwright 简介:声明内容来自网络&#xff0c;将内容拼接整理出来的文档 Playwright 是微软开发的自动化测试工具&#xff0c;支持 Chrome、Firefox、Safari 等主流浏览器&#xff0c;提供多语言 API&#xff08;Python、JavaScript、Java、.NET&#xff09;。它的特点包括&a…...

解决Ubuntu22.04 VMware失败的问题 ubuntu入门之二十八

现象1 打开VMware失败 Ubuntu升级之后打开VMware上报需要安装vmmon和vmnet&#xff0c;点击确认后如下提示 最终上报fail 解决方法 内核升级导致&#xff0c;需要在新内核下重新下载编译安装 查看版本 $ vmware -v VMware Workstation 17.5.1 build-23298084$ lsb_release…...

鸿蒙中用HarmonyOS SDK应用服务 HarmonyOS5开发一个医院挂号小程序

一、开发准备 ​​环境搭建​​&#xff1a; 安装DevEco Studio 3.0或更高版本配置HarmonyOS SDK申请开发者账号 ​​项目创建​​&#xff1a; File > New > Create Project > Application (选择"Empty Ability") 二、核心功能实现 1. 医院科室展示 /…...

OPENCV形态学基础之二腐蚀

一.腐蚀的原理 (图1) 数学表达式&#xff1a;dst(x,y) erode(src(x,y)) min(x,y)src(xx,yy) 腐蚀也是图像形态学的基本功能之一&#xff0c;腐蚀跟膨胀属于反向操作&#xff0c;膨胀是把图像图像变大&#xff0c;而腐蚀就是把图像变小。腐蚀后的图像变小变暗淡。 腐蚀…...

Hive 存储格式深度解析:从 TextFile 到 ORC,如何选对数据存储方案?

在大数据处理领域&#xff0c;Hive 作为 Hadoop 生态中重要的数据仓库工具&#xff0c;其存储格式的选择直接影响数据存储成本、查询效率和计算资源消耗。面对 TextFile、SequenceFile、Parquet、RCFile、ORC 等多种存储格式&#xff0c;很多开发者常常陷入选择困境。本文将从底…...