写在前面

很多通过摄像头拿到的视频流格式都是Rtsp协议的， 比如：海康威视摄像头。 在现代的浏览器中， 已经不支持直接播放Rtsp视频流，而且，海康威视提供的本身的webSdk3.3.0视频插件有很多问题， 比如：视频插件没有dom树的概念， 且总是浮动在所有元素的最上层。 所以， 通过转流方式进行在网页上播放视频是替代官网sdk的一种尝试。

需求

1. 捕捉用户登录和关闭页签的动作,用于统计实时在线人数
2. 系统管理员可以查看到当前实时在线人数列表

效果

获课》aixuetang.xyz/5739/

Vue3+Django4全栈开发：从构建到部署的完整实践指南

前言

为什么要代理 WebSocket？

maven依赖

SpringBoot2.0对WebSocket的支持简直太棒了，直接就有包可以引入

	<dependency>  
           <groupId>org.springframework.boot</groupId>  
           <artifactId>spring-boot-starter-websocket</artifactId>  
       </dependency> 

一、Vite是什么？

首先，讲下Vite名字的由来，Vite实际上是法语中快的意思，所以顾名思义，这个工具就是为了给我们带来更快的开发体验，它是一个面向现代浏览器，基于ECMA标准的ES Module实现的一个更轻更快的Web应用开发工具

二、Vite为什么快

1、问题背景

前几天想在Vue项目里加个群聊功能，结果跟想象完全不一样。以前用JQuery写过，直接连就行，现在改成Vue老是各种报错。网上看到有人说vue-native-websocket库不错，就试试看。装了才知道，光配环境就得搞清楚 Vuex 怎么对接。

在现代Web应用中，实时数据交互和推送是一个非常关键的功能。WebSocket作为一种在单个TCP连接上进行全双工通信的协议，使得服务器与客户端之间的数据传输更加高效、实时。本文将详细介绍如何在Vue3框架下利用WebSocket实现双向实时通讯。

WebSocket简

WebSocket允许服务端主动向客户端发送数据，无需客户端发起请求，从而实现了低延迟、高效率的数据交换。它通过HTTP升级协议握手来建立持久性的连接，并使用帧（frame）的形式传输数据。