WebSocket是h5定义的,双向通信,节省资源,更好的及时通信

浏览器和服务器之间的通信更便利,比http的轮询等效率提高很多,

WebSocket并不是权限的协议,而是利用http协议来建立连接

websocket必须由浏览器发起请求,协议是一个标准的http请求,格式如下

GET ws://example.com:3000/chat HTTP/1.1
Host: example.com
Upgrade: websocket
Connection: Upgrade
Sec-WebSocket-Key: dGhlIHNhbXBsZSBub25jZQ==
Sec-WebSocket-Version: 13
Origin: https://example.com:3000

关键字段解释:‌

‌Upgrade: websocket‌:表示客户端希望升级到 WebSocket 协议。
‌Connection: Upgrade‌:确认协议升级。
‌Sec-WebSocket-Key‌:一个 Base64 编码的随机值(16字节),用于握手验证。
‌Sec-WebSocket-Version‌:指定 WebSocket 协议版本(通常为 13)。
‌Origin‌(可选):用于跨域控制,服务器可据此决定是否允许连接。

服务器响应(Server Handshake Response)‌
服务器返回 ‌HTTP 101 Switching Protocols‌ 状态码,确认协议升级:

Copy Code
HTTP/1.1 101 Switching Protocols
Upgrade: websocket
Connection: Upgrade
Sec-WebSocket-Accept: s3pPLMBiTxaQ9kYGzzhZRbK+xOo=



‌关键字段解释:‌

‌Sec-WebSocket-Accept‌:服务器将客户端的 Sec-WebSocket-Key 与固定 GUID 258EAFA5-E914-47DA-95CA-C5AB0DC85B11 拼接后,进行 SHA-1 哈希并 Base64 编码,返回此值供客户端验证。

握手成功后,通信将脱离 HTTP,转为基于帧的 WebSocket 协议。

为什么websocket连接可以实现双工通信,而http不可以呢?实际上上,http是建立在tcp之上的,tcp本身就实现了双工通信,但http协议的请求--应答机制限制了全双工通信。websocket连接建立以后,其实只是简单规定了一下:咱们接下来的通信就不使用http了,咱们直接互发数据吧。

安全的websocket连接机制和https类似,首先,浏览器用wss://创建websocket连接,会先通过https创建安全连接,然后,该https升级为websocket连接,底层通信仍然走的是安全的SSL/TLS

uniapp使用websocket,需实现心跳‌:防止因网络空闲导致连接断开

let timer;
const socketTask = uni.connectSocket({ url: 'wss://example.com' });socketTask.onOpen(() => {timer = setInterval(() => {socketTask.send({ data: 'ping' });}, 30000);
});socketTask.onClose(() => {clearInterval(timer);
});

 Node.js 服务端设置 WebSocket 跨域:(关键在于 ‌握手阶段对 Origin 头的验证)

const WebSocket = require('ws');// 允许的 Origin 白名单
const allowedOrigins = ['https://your-frontend-domain.com','http://localhost:3000'
];const wss = new WebSocket.Server({port: 8080,verifyClient: (info) => {const origin = info.origin || info.req.headers.origin;if (!allowedOrigins.includes(origin)) {console.log(`拒绝来自 ${origin} 的跨域请求`);return false; // 阻止握手}return true; // 允许连接}
});wss.on('connection', (ws) => {console.log('客户端已连接');
});

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/diannao/80715.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Kaamel白皮书:IoT设备安全隐私评估实践

1. IoT安全与隐私领域的现状与挑战 随着物联网技术的快速发展,IoT设备在全球范围内呈现爆发式增长。然而,IoT设备带来便捷的同时,也引发了严峻的安全与隐私问题。根据NSF(美国国家科学基金会)的研究表明,I…

php安装swoole扩展

PHP安装swoole扩展 Swoole官网 安装准备 安装前必须保证系统已经安装了下列软件 4.8 版本需要 PHP-7.2 或更高版本5.0 版本需要 PHP-8.0 或更高版本6.0 版本需要 PHP-8.1 或更高版本gcc-4.8 或更高版本makeautoconf 安装Swool扩展 安装官方文档安装后需要再php.ini中增加…

服务器传输数据存储数据建议 传输慢的原因

一、JSON存储的局限性 1. 性能瓶颈 全量读写:JSON文件通常需要整体加载到内存中才能操作,当数据量大时(如几百MB),I/O延迟和内存占用会显著增加。 无索引机制:查找数据需要遍历所有条目(时间复…

Android四大核心组件

目录 一、为什么需要四大组件? 二、Activity:看得见的界面 核心功能 生命周期图解 代码示例 三、Service:看不见的劳动者 两大类型 生命周期对比 注意陷阱 四、BroadcastReceiver:消息传递专员 两种注册方式 广播类型 …

「Mac畅玩AIGC与多模态01」架构篇01 - 展示层到硬件层的架构总览

一、概述 AIGC(AI Generated Content)系统由多个结构层级组成,自上而下涵盖交互界面、API 通信、模型推理、计算框架、底层驱动与硬件支持。本篇梳理 AIGC 应用的六层体系结构,明确各组件在系统中的职责与上下游关系,…

[MERN 项目实战] MERN Multi-Vendor 电商平台开发笔记(v2.0 从 bug 到结构优化的工程记录)

[MERN 项目实战] MERN Multi-Vendor 电商平台开发笔记(v2.0 从 bug 到结构优化的工程记录) 其实之前没想着这么快就能把 2.0 的笔记写出来的,之前的预期是,下一个阶段会一直维持到将 MERN 项目写完,毕竟后期很多东西都…

互斥量函数组

头文件 #include <pthread.h> pthread_mutex_init 函数原型&#xff1a; int pthread_mutex_init(pthread_mutex_t *restrict mutex, const pthread_mutexattr_t *restrict attr); 函数参数&#xff1a; mutex&#xff1a;指向要初始化的互斥量的指针。 attr&#xf…

互联网的下一代脉搏:深入理解 QUIC 协议

互联网的下一代脉搏&#xff1a;深入理解 QUIC 协议 互联网是现代社会的基石&#xff0c;而数据在其中高效、安全地传输是其运转的关键。长期以来&#xff0c;传输层的 TCP&#xff08;传输控制协议&#xff09;一直是互联网的主力军。然而&#xff0c;随着互联网应用场景的日…

全球城市范围30米分辨率土地覆盖数据(1985-2020)

Global urban area 30 meter resolution land cover data (1985-2020) 时间分辨率年空间分辨率10m - 100m共享方式保护期 277 天 5 时 42 分 9 秒数据大小&#xff1a;8.98 GB数据时间范围&#xff1a;1985-2020元数据更新时间2024-01-11 数据集摘要 1985~2020全球城市土地覆…

【Vue】单元测试(Jest/Vue Test Utils)

个人主页&#xff1a;Guiat 归属专栏&#xff1a;Vue 文章目录 1. Vue 单元测试简介1.1 为什么需要单元测试1.2 测试工具介绍 2. 环境搭建2.1 安装依赖2.2 配置 Jest 3. 编写第一个测试3.1 组件示例3.2 编写测试用例3.3 运行测试 4. Vue Test Utils 核心 API4.1 挂载组件4.2 常…

数据湖的管理系统管什么?主流产品有哪些?

一、数据湖的管理系统管什么&#xff1f; 数据湖的管理系统主要负责管理和优化存储在数据湖中的大量异构数据&#xff0c;确保这些数据能够被有效地存储、处理、访问和治理。以下是数据湖管理系统的主要职责&#xff1a; 数据摄入管理&#xff1a;管理系统需要支持从多种来源&…

英文中日期读法

英文日期的读法和写法因地区&#xff08;英式英语与美式英语&#xff09;和正式程度有所不同&#xff0c;以下是详细说明&#xff1a; 一、日期格式 英式英语 (日-月-年) 写法&#xff1a;1(st) January 2023 或 1/1/2023读法&#xff1a;"the first of January, twenty t…

衡量矩阵数值稳定性的关键指标:矩阵的条件数

文章目录 1. 定义2. 为什么要定义条件数&#xff1f;2.1 分析线性系统 A ( x Δ x ) b Δ b A(x \Delta x) b \Delta b A(xΔx)bΔb2.2 分析线性系统 ( A Δ A ) ( x Δ x ) b (A \Delta A)(x \Delta x) b (AΔA)(xΔx)b2.3 定义矩阵的条件数 3. 性质及几何意义3…

4月22日复盘-开始卷积神经网络

4月24日复盘 一、CNN 视觉处理三大任务&#xff1a;图像分类、目标检测、图像分割 上游&#xff1a;提取特征&#xff0c;CNN 下游&#xff1a;分类、目标、分割等&#xff0c;具体的业务 1. 概述 ​ 卷积神经网络是深度学习在计算机视觉领域的突破性成果。在计算机视觉领…

【网络原理】从零开始深入理解TCP的各项特性和机制.(三)

上篇介绍了网络原理传输层TCP协议的知识,本篇博客给大家带来的是网络原理剩余的内容, 总体来说,这部分内容没有上两篇文章那么重要,本篇知识有一个印象即可. &#x1f40e;文章专栏: JavaEE初阶 &#x1f680;若有问题 评论区见 ❤ 欢迎大家点赞 评论 收藏 分享 如果你不知道分…

解决qnn htp 后端不支持boolean 数据类型的方法。

一、背景 1.1 问题原因 Qnn 模型在使用fp16的模型转换不支持类型是boolean的cast 算子&#xff0c;因为 htp 后端支持量化数据类型或者fp16&#xff0c;不支持boolean 类型。 ${QNN_SDK_ROOT_27}/bin/x86_64-linux-clang/qnn-model-lib-generator -c ./bge_small_fp16.cpp -b …

使用Three.js搭建自己的3Dweb模型(从0到1无废话版本)

教学视频参考&#xff1a;B站——Three.js教学 教学链接&#xff1a;Three.js中文网 老陈打码 | 麒跃科技 一.什么是Three.js&#xff1f; Three.js​ 是一个基于 JavaScript 的 ​3D 图形库&#xff0c;用于在网页浏览器中创建和渲染交互式 3D 内容。它基于 WebGL&#xff0…

PostgreSQL WAL 幂等性详解

1. WAL简介 WAL&#xff08;Write-Ahead Logging&#xff09;是PostgreSQL的核心机制之一。其基本理念是&#xff1a;在修改数据库数据页之前&#xff0c;必须先将这次修改操作写入到WAL日志中。 这确保了即使发生崩溃&#xff0c;数据库也可以根据WAL日志进行恢复。 恢复的核…

git提交规范记录,常见的提交类型及模板、示例

Git提交规范是一种约定俗成的提交信息编写标准&#xff0c;旨在使代码仓库的提交历史更加清晰、可读和有组织。以下是常见的Git提交类型及其对应的提交模板&#xff1a; 提交信息的基本结构 一个标准的Git提交信息通常包含以下三个主要部分&#xff1a; Header‌&#xff1a;描…

FastAPI系列06:FastAPI响应(Response)

FastAPI响应&#xff08;Response&#xff09; 1、Response入门2、Response基本操作设置响应体&#xff08;返回数据&#xff09;设置状态码设置响应头设置 Cookies 3、响应模型 response_model4、响应类型 response_classResponse派生类自定义response_class 在“FastAPI系列0…