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

如何搭建一个 websocket

news 2026/5/16 3:52:54

环境:

NodeJs
socket.io 4.7.2

安装依赖

yarn add socket.io

创建服务器

引入文件

特别注意: 涉及到 colors 的代码，请采取 console.log() 打印

// 基础老三样
import http from "http";
import fs from "fs";
import { Server } from "socket.io";// 下面2个是我本地开发的,你们可能没有
import colors from "colors-console";
import constant_color from "./colors.js";

createServer

请在当前目录下创建 index.html 文件。【客户端需要连接 socket.io】

<script src="/socket.io/socket.io.js"></script><script>constsocket = io();
</script>

服务端代码：

const server = http.createServer((req, res) => {fs.readFile("./index.html", "utf-8", (err, data) => {if (err) {res.writeHead(500, "utf-8", e);res.end();}res.writeHead(200, {"Content-Type": "text/html"});res.end(data, "utf-8");});
});

websocket

简单判断客户端是否连接，断开。

const io = new Server(server);io.on("connection", socket => {console.succ("User connected.");// 用户断开连接socket.on("disconnect", () => {console.err("User disconnected.");})
});server.listen(3000, "127.0.0.1");

启动服务器

yarn app

在这里插入图片描述

附录

再次提醒：请去除所有 console.err console.succ colors 等有关颜色内容
在这里插入图片描述
项目结构：【它们都是同级目录，最顶层】

D:.
│  app.js
│  colors.js
│  index.html
│  package.json
│  yarn.lock
│
└─node_modules

app.js 代码：

import http from "http";
import fs from "fs";
import { Server } from "socket.io";
import colors from "colors-console";
import constant_color from "./colors.js";// 重写 console.err 
console.err = (...msg) => {let str = "";for (let i = 0; i < msg.length; i++) {str += msg[i] + " ";}console.log(colors(constant_color.red, str));
}// 定义 console.succ
console.succ = (...msg) => {let str = "";for (let i = 0; i < msg.length; i++) {str += msg[i] + " ";}console.log(colors(constant_color.green, str));
}const server = http.createServer((req, res) => {fs.readFile("./index.html", "utf-8", (err, data) => {if (err) {res.writeHead(500, "utf-8", e);res.end();}res.writeHead(200, {"Content-Type": "text/html"});res.end(data, "utf-8");});
});const io = new Server(server);io.on("connection", socket => {console.succ("User connected.");// 用户断开连接socket.on("disconnect", () => {console.err("User disconnected.");})
});server.listen(3000, "127.0.0.1");console.log("Server running at \x1B[36m\x1B[4mhttp://127.0.0.1:3000\x1B[0m");

index.html 代码：

<!DOCTYPE html>
<html lang="zh-CN"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script src="/socket.io/socket.io.js"></script>
</head><body><h1>Hello Friend! 😀</h1><script>const socket = io();</script>
</body></html>

如何搭建一个 websocket

环境: NodeJssocket.io 4.7.2 安装依赖 yarn add socket.io创建服务器引入文件特别注意: 涉及到 colors 的代码，请采取 console.log() 打印 // 基础老三样 import http from "http"; import fs from "fs"; import { Server } from &quo…...

编程日记 2023/10/8 11:28:07

pip常用命令

TOC(pip常用命令) 1.pip 2.where pip 3.pip install --upgrade pip 4.安装这里暂用flask库举例，安装flask库，默认安装最新版： pip install flask指定要安装flask库的版本： pip install flask版本号我们在安装第三方库时可…...

编程日记 2023/10/8 11:27:06

[QT编程系列-43]: Windows + QT软件内存泄露的检测方法

目录一、如何查找Windows程序是否有内存泄露二、如何定位Windows程序内存泄露的原因二、Windows环境下内存监控工具的使用 2.1 内存监测工具 - Valgrind 2.2.1 Valgrind for Linux 2.2.2 Valgrind for Windows 2.2 内存监测工具 - Dr. Memory 2.2.1 特点 2.2.2 安装…...

编程日记 2023/10/8 11:23:02

【Java-LangChain:使用 ChatGPT API 搭建系统-5】处理输入-思维链推理

第五章，处理输入-思维链推理在本章中，我们将专注于处理输入，即通过一系列步骤生成有用地输出。有时，模型在回答特定问题之前需要进行详细地推理。如果您参加过我们之前的课程，您将看到许多这样的例子。有时&#xf…...

编程日记 2023/10/8 11:22:01

java Spring Boot RequestHeader设置请求头，当请求头中没有Authorization 直接400问题解决

我在接口中写了一个接收请求头参数 Authorization 但是目前代理一个问题那就是当请求时请求头中没有这个Authorization 就会直接因为参数不匹配找不到指向这里其实很简单我们设置 value 为我们需要的字段内容 required 是否必填我们设置为 false 就可以了这样没有也…...

编程日记 2023/10/8 11:21:00

[CISCN2019 华北赛区 Day1 Web5]CyberPunk 二次报错注入

buu上做点首先就是打开环境开始信息收集发现源代码中存在?file 提示我们多半是包含我原本去试了试 ../../etc/passwd 失败了直接伪协议上吧 php://filter/readconvert.base64-encode/resourceindex.phpconfirm.phpsearch.phpchange.phpdelete.php 我们通过伪协议全…...

编程日记 2023/10/8 11:19:59

双机并联逆变器自适应虚拟阻抗下垂控制（Droop）策略Simulink仿真模型

💥💥💞💞欢迎来到本博客❤️❤️💥💥 🏆博主优势：🌞🌞🌞博客内容尽量做到思维缜密，逻辑清晰，为了方便读者。 ⛳️座右铭&a…...

编程日记 2023/10/8 11:18:58

8月份，誉天79名学员通过HCIE认证！

八月份，誉天又有79名学员顺利通过了HCIE认证，其中：云计算46人、Datacom14人、云服务8人、存储7人、安全3人、大数据1人。一起祝贺他们吧~...

编程日记 2023/10/8 11:17:57

Quarto 入门教程 (2)：如何使用并编译出不同文档

接着上一期内容：手把手教你使用 Quarto 构建文档 (1)，本文介绍如何使用 Quarto，并编译出文档（PDF，MS Word，html）等。安装根据官方链接，选择适合自己电脑的 Quarto 版本并下载&am…...

编程日记 2023/10/8 11:13:53

【C++设计模式之命令模式:行为型】分析及示例

简介命令模式是一种行为型设计模式，它将请求封装成一个对象，从而使不同的请求可以被参数化、队列化或记录化。这种模式允许请求的发送者和接收者进行解耦，同时提供更高的灵活性和可扩展性。描述命令模式的核心思想是通过命令对象来封装…...

编程日记 2023/10/8 11:11:52

二、Excel VBA 简单使用

Excel VBA 从入门到出门一、Excel VBA 是个啥？二、Excel VBA 简单使用 👋Excel VBA 简单使用 ⚽️1. 如何在Excel中手动编写VBA代码⚽️2. 如何在 Excel 中运行 VBA 代码⚽️3. 如何在Excel中记录VBA代码⚽️4. 如何在Excel中编辑录制的VBA代码⚽️5. 如…...

编程日记 2023/10/8 11:10:51

方式一 final String queryString request.getQueryString(); System.out.println(queryString); //解码 System.out.println(URLDecoder.decode(queryString, StandardCharsets.UTF_8));测试： pageSize25&pageNum1&sort%5B%27id%27%5Ddesc&sort%5B%…...

编程日记 2023/10/8 11:09:49

python入门篇07-数据容器(序列集合字典,json初识)基础(下)

全文目录,一步到位 1.前言简介1.1 专栏传送门1.1.1 上文传送门 2. python基础使用2.1 序列2.1.1 序列定义2.1.2 序列参数解释2.1.3 列表list切片2.1.4 元组tuple切片2.1.5 字符串str切片 2.2 集合定义2.2.1 set集合-基本语法2.2.2 set集合-添加元素.add()2.2.3 set集合- 移除元…...

编程日记 2023/10/8 11:04:45

阿里云服务器公网带宽价格表“按固定带宽”计费模式

阿里云服务器公网带宽计费模式按固定带宽”计费多少钱1M？地域不同带宽价格不同，北京、杭州、深圳等大陆地域价格是23元/Mbps每月，中国香港1M带宽价格是30元一个月，美国硅谷是30元一个月，日本东京1M带宽是25元一个月&am…...

编程日记 2023/10/8 11:00:42

MTK的充电方案—PMIC充电

MTK目前有三套充电方案，主要如下： （1）线性充电——linering charge(PMIC充电） 充9停1，充电电流不能太大，目前最大能做到1.2A； （2）switch charge&#xff08…...

编程日记 2023/10/8 10:59:41

【Overload游戏引擎分析】画场景栅格的Shader分析

Overload引擎地址： GitHub - adriengivry/Overload: 3D Game engine with editor 一、栅格绘制基本原理 Overload Editor启动之后，场景视图中有栅格线，这个在很多软件中都有。刚开始我猜测它应该是通过绘制线实现的。阅读代码发现&#xff0…...

编程日记 2023/10/8 10:58:39