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

简单了解一下：NodeJS的WebSocket网络编程

news 2026/4/6 4:13:43

NodeJS的webSocket网络编程。

那什么是WebSocket呢？WebSocket是HTML5提供的一种浏览器和服务器进行通信的网络技术。两者之间，只需要做一个握手动作，就可以在浏览器和服务器之间开启一条通道，就可以进行数据相互传输。

实现WebSocket网络编程，分为三个步骤：

  1. 创建WebSocket服务器
  2. 创建WebSocket客户端
  3. 服务器和客户端通信

创建WebSocket服务

在NodeJS创建WebSocket，需要借助http模块的createServer：

const fs = require("fs");
const http = require("http");
const Ws = require("ws").Server;const service = http.createServer((request, response) => {if (request.url == '/') {fs.readFile("./index.html", (err, data) => {if (err) { return };response.writeHead(200, { "Content-Type": "text/html" });response.end(data);});}
})
service.listen(34421, () => {console.log("监听地址：http://127.0.0.1:34421")
})let wsServer = new Ws({ server: service });
wsServer.on("connection", function (socket) {console.log("连接成功");socket.on("message", msg => {console.log("客户端信息", msg)socket.send("客户端发送的信息：" + msg + "," + new Date().getTime())})
})

WebSocket服务器端有这些事件：

  1. connection：客户端连接服务器
  2. disconnect：客户端断开连接
  3. message：获取客户端发送的信息
  4. error：发生错误

WebSocket客户端

这里的客户端就是前端页面：

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body><script>const ws = new WebSocket("ws://127.0.0.1:34421")ws.onopen = () => {ws.send("hello")}ws.onmessage = (ev) => {console.log("ev", ev)}</script>
</body></html>

前后端都启动后，打开前端页面的控制台，效果如下：

在这里插入图片描述
后端的日志：

在这里插入图片描述
这就是NodeJS的WebSocket网络编程

相关文章：

简单了解一下：NodeJS的WebSocket网络编程

NodeJS的webSocket网络编程。 那什么是WebSocket呢&#xff1f;WebSocket是HTML5提供的一种浏览器和服务器进行通信的网络技术。两者之间&#xff0c;只需要做一个握手动作&#xff0c;就可以在浏览器和服务器之间开启一条通道&#xff0c;就可以进行数据相互传输。 实现WebS…...

编程日记 2023/10/25 4:13:56

目标检测技术概述

什么是目标检测&#xff1f; 在计算机视觉众多的技术领域中&#xff0c;目标检测&#xff08;Object Detection&#xff09;也是一项非常基础的任务&#xff0c;图像分割、物体追踪、关键点检测等通常都要依赖于目标检测。在目标检测时&#xff0c;由于每张图像中物体的数量、…...

编程日记 2023/10/25 4:10:51

软件设计原则-开闭原则讲解以及代码示例

开闭原则 一&#xff0c;介绍 1.前言 开闭原则&#xff08;Open-Closed Principle&#xff0c;OCP&#xff09;是面向对象设计中的一条重要原则&#xff0c;它由Bertrand Meyer在其著作《面向对象软件构造》中提出&#xff0c;并成为SOLID原则之一。 开闭原则的核心思想是&…...

编程日记 2023/10/25 4:09:50

分类预测 | MATLAB实现SSA-CNN-GRU-Attention数据分类预测（SE注意力机制）

分类预测 | MATLAB实现SSA-CNN-GRU-Attention数据分类预测&#xff08;SE注意力机制&#xff09; 目录 分类预测 | MATLAB实现SSA-CNN-GRU-Attention数据分类预测&#xff08;SE注意力机制&#xff09;分类效果基本描述模型描述程序设计参考资料 分类效果 基本描述 1.MATLAB实现…...

编程日记 2023/10/25 4:08:49

LeetCode--180 连续出现的数字

文章目录 1 题目描述2 结果示例3 解题思路3.1 MySQL 代码 4 知识拓展 1 题目描述 Logs表: ---------------------- | Column Name | Type | ---------------------- | id | int | | num | varchar | ----------------------在 SQL 中&#xff0c;id …...

编程日记 2023/10/25 4:07:48

面试算法34：外星语言是否排序

题目 有一门外星语言&#xff0c;它的字母表刚好包含所有的英文小写字母&#xff0c;只是字母表的顺序不同。给定一组单词和字母表顺序&#xff0c;请判断这些单词是否按照字母表的顺序排序。例如&#xff0c;输入一组单词[“offer”&#xff0c;“is”&#xff0c;“coming”…...

编程日记 2023/10/25 4:05:44

常用docker命令 docker_cmd_sheet

查看所有docker 容器 docker ps 查看 特定docker容器 比如con1 docker ps | grep con1 查看镜像 docker images 拉取镜像 docker pull imageXXX 打标签 docker tag imageXXX:1.4.0 镜像名冒号tag 按照docker-compose.yml 启动容器&#xff0c;在有docker-compose…...

编程日记 2023/10/25 4:04:42

算法进阶——数组中的逆序对

题目 在数组中的两个数字&#xff0c;如果前面一个数字大于后面的数字&#xff0c;则这两个数字组成一个逆序对。输入一个数组,求出这个数组中的逆序对的总数P。并将P对1000000007取模的结果输出。 即输出P mod 1000000007 数据范围&#xff1a;对于 50% 的数据, size≤104 对…...

编程日记 2023/10/25 4:03:39

hackmyvm之gift

hackmyvm是一个平台&#xff0c;包含了大量靶机&#xff0c;类似于vulnhub、hackthebox等平台&#xff0c;你可以在上面下载靶机&#xff0c;进行渗透测试练习&#xff0c;非常适合热爱黑客技术或从事渗透测试的人员。 &#xff08;这段解释参考这篇文章&#xff09; 下载安装…...

编程日记 2023/10/25 4:02:32

1024，向着“顶尖程序员“迈进

10月24日&#xff0c;对每个程序员而言&#xff0c;都是一个具有特殊意义的日子。1024这个数字&#xff0c;不再只是计算机存储容量的基础单位&#xff0c;更是我们向着技术巅峰进发的象征。 回顾我的程序员之路&#xff0c;那是一个不断学习、不断成长的过程。起初是对编程充…...

编程日记 2023/10/25 4:01:31

Arcgis 数据操作

在进行数据操作的时候&#xff0c;需要注意坐标系要一致&#xff0c;这是前提。 数据类型 文件地理数据库&#xff1a;gbd 个人地理数据库&#xff1a;mdb &#xff08;Mircosoft Access&#xff09; 矢量数据&#xff1a;shp 推荐使用gbd数据&#xff0c;效率会更高。 采…...

编程日记 2023/10/25 3:59:29

YoloV7改进策略：SwiftFormer，全网首发，独家改进的高效加性注意力用于实时移动视觉应用的模型，重构YoloV7

文章目录 摘要论文：《SwiftFormer：基于Transformer的高效加性注意力用于实时移动视觉应用的模型》1、简介2、相关研究3、方法3.1、注意力模块概述3.2、高效的加性注意力3.3、SwiftFormer 架构4、实验4.1、实现细节4.2、基线比较4.3、图像分类4.4、目标检测和实例分割4.5、语义…...

编程日记 2023/10/25 3:58:28

Day07 Stream流递归Map集合Collections可变参数

Stream 也叫Stream流&#xff0c;是Jdk8开始新增的一套API (java.util.stream.*)&#xff0c;可以用于操作集合或者数组的数据。 Stream流大量的结合了Lambda的语法风格来编程&#xff0c;提供了一种更加强大&#xff0c;更加简单的方式操作 public class Demo1 {public stati…...

编程日记 2023/10/25 3:56:26

8.JavaScript-注释

题记 javascript注释 单行注释 <!DOCTYPE html> <html> <head> <meta charset"utf-8"> <title>实例</title> </head> <body><h1 id"myH1"></h1> <p id"myP"></p>…...

编程日记 2023/10/25 3:54:23

知识分享|分段函数线性化及matlab测试

目录 1 使用0-1变量将分段函数转换为线性约束 2 连续函数采用分段线性化示例 3 matlab程序测试 4 matlab测试结果说明 5 分段线性化应用 1 使用0-1变量将分段函数转换为线性约束 2 连续函数采用分段线性化示例 3 matlab程序测试 clc;clear all; gn10;tn1; x_pfsdpvar(1, t…...

编程日记 2023/10/25 3:53:21

ant target的depends属性

ant的target使用depends属性指明对其它target的依赖。可以依赖多个target&#xff0c;被依赖的多个target之间用逗号分隔。 ant会确保被依赖的target首先执行&#xff0c;然后再执行本target。 ant尽量按照depends属性中指明的target出现的顺序来执行&#xff08;从左到右&…...

编程日记 2023/10/25 3:52:20

【三维重建】DreamGaussian：高斯splatting的单视图3D内容生成（原理+代码）

文章目录 摘要一、前言二、相关工作2.1 3D表示2.2 Text-to-3D2.3 Image-to-3D 三、本文方法3.1生成式 高斯 splitting3.2 高效的 mesh 提取3.3 UV空间的纹理优化 四. 实验4.1实施细节4.2 定性比较4.3 定量比较4.4 消融实验 总结&#xff08;特点、局限性&#xff09; 五、安装与…...

编程日记 2023/10/25 3:51:19

如何使用Flutter开发执行操作系统shell命令的工具

简介 Flutter是一种由Google开发的移动应用程序开发框架&#xff0c;它允许开发人员使用单个代码库构建高性能、高质量的移动体验。而Android终端命令行工具则允许用户在Android手机上运行类似于Linux的操作系统命令。本文的目的是介绍如何在Flutter应用中开发一个Android终端命…...

编程日记 2023/10/25 3:50:18

西山居 游戏研发工程师实习生 面经

西山居实习面经 面试时长&#xff1a;26min&#xff08;两个面试官交替问&#xff09; 1、自我介绍 2、你平常怎么学习的 3、你实习接受加班么 4、说一下Unity的生命周期&#xff0c;Start和Awake哪里不同 5、Unity中Update与FixedUpdate的区别&#xff0c;怎么设置Fixed…...

编程日记 2023/10/25 3:49:17

YOLOv8训练自己的数据集+改进方法复现

yolov8已经出来好几个月了&#xff0c;并且yolov8从刚开始出来之后的小版本也升级好几次&#xff0c;总体变化不大&#xff0c;个别文件存放位置发生了变化&#xff0c;以下以最新版本的YOLOv8来详细学习和使用YOLOv8完成一次目标检测。 一、环境按照 深度学习环境搭建就不再…...

编程日记 2023/10/25 3:48:15

【面板数据】A股上市公司研发投入数据（2000-2024年）

数据简介&#xff1a;作为评估企业创新能力与可持续发展潜力的关键维度&#xff0c;上市公司研发投入呈现显著的行业差异化特征&#xff0c;但总体保持稳健增长态势。随着信息披露监管要求的持续强化&#xff0c;研发投入透明度已成为提升企业市场信誉的重要抓手。值得注意的是…...

编程新知 2026/4/6 4:05:58

从GCC到Nginx：一文搞定Linux开发环境搭建（附1.13.7版本编译避坑指南）

从GCC到Nginx&#xff1a;Linux开发环境全栈配置实战 在Linux系统上搭建完整的开发环境&#xff0c;尤其是Web服务器环境&#xff0c;是每个开发者必须掌握的技能。不同于简单的软件安装&#xff0c;这涉及到工具链配置、依赖管理、编译优化等一系列复杂操作。本文将带你从零开…...

编程新知 2026/4/6 1:52:03

号令天下：守财数字能量号组413与313能守财吗

在数字能量学的体系中&#xff0c;延年磁场是主导守财的核心能量&#xff0c;天医磁场主打招财纳福&#xff0c;生气磁场侧重拓展人脉&#xff0c;二者并不具备直接的守财属性。像 413、313 这类组合&#xff0c;核心作用集中在招财聚财方面&#xff0c;守财能力相对薄弱&#…...

编程新知 2026/4/6 1:35:48

为什么80%AI率降完后还有残留？根本原因在这

你用了降AI工具&#xff0c;处理前90%&#xff0c;处理后17%。 17%达标了&#xff0c;但还是有AI率残留。或者更糟&#xff0c;处理后22%&#xff0c;还是没过。 为什么工具处理后AI率不能降到0%&#xff1f;残留从哪来&#xff1f;怎么进一步处理&#xff1f; 残留AI率的三…...

编程新知 2026/4/6 1:15:39

OpenClaw个人财务助手：Qwen3-14B分析消费记录生成报表

OpenClaw个人财务助手&#xff1a;Qwen3-14B分析消费记录生成报表 1. 为什么需要AI财务助手 上个月整理支付宝账单时&#xff0c;我盯着密密麻麻的消费记录发了半小时呆。餐饮、购物、交通的金额混在一起&#xff0c;根本分不清钱到底花在哪里。手动分类300多条记录后&#x…...

编程新知 2026/4/6 1:03:34

QT无边框窗口圆角化实战：用paintEvent和样式表两种方法，打造你的专属UI（附完整代码）

QT无边框圆角窗口开发指南&#xff1a;从原理到实战的深度解析 在当今追求极致用户体验的桌面应用开发领域&#xff0c;无边框圆角窗口已经成为现代化UI设计的标配元素。从音乐播放器的沉浸式界面到社交软件的柔和视觉风格&#xff0c;圆角设计不仅能够降低用户的视觉疲劳&…...

编程新知 2026/4/6 0:22:51

EC数据下载和可视化产品python实现

欧洲中期天气预报中心&#xff08;ECMWF&#xff0c;European Centre for Medium-Range Weather Forecasts&#xff09;是全球顶尖的气象研究和业务预报中心之一。其发布的数据&#xff0c;常被业内简称为“EC数据”&#xff0c;因高精度与高稳定性&#xff0c;是全球气象预报、…...

编程新知 2026/4/5 23:56:22

别再死记硬背了！用这3个真实场景，彻底搞懂Koa中间件的洋葱模型

用三个实战案例拆解Koa中间件的洋葱模型 当你第一次听说Koa的"洋葱模型"时&#xff0c;是不是也和我一样&#xff0c;脑子里浮现出一个奇怪的画面&#xff1a;一个请求像剥洋葱一样&#xff0c;一层层往里钻&#xff0c;然后又一层层往外冒&#xff1f;但真正开始写代…...

编程新知 2026/4/5 23:38:14

智能工具助力论文答辩：精选10款AI应用（含爱毕业aibiye）与权威模板分析

工具对比速览表 工具名称 核心功能 适用场景 特色优势 Aibiye 智能成文、文献查找、数据分析 社科/金融/理工类论文 融合多模型架构&#xff0c;精准把握高校规范 Aicheck 初稿生成、大纲定制、图表插入 快速完成初稿需求 全学科覆盖&#xff0c;20-30分钟极速生成 …...

编程新知 2026/4/5 23:23:39

AppML 参考手册

AppML 参考手册 引言 AppML（Application Markup Language）是一种用于创建移动应用程序的标记语言。它提供了一种简单、高效的方式来定义应用程序的结构和功能。本手册旨在为开发者提供关于AppML的全面指南，包括其基本概念、语法规则、常用元素以及最佳实践。 AppML 概述 …...

编程新知 2026/4/5 22:45:08