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

浏览器WEB播放RTSP

news 2025/11/1 15:54:37

注意：浏览器不能直接播放RTSP，必须转换后都能播放。这一点所有的播放都是如此。

参考

https://github.com/kyriesent/node-rtsp-stream

GitHub - phoboslab/jsmpeg: MPEG1 Video Decoder in JavaScript

相关文件方便下载

https://download.csdn.net/download/quantum7/90459890

安装node/npm
安装ffmpeg

sudo apt install -y ffmpeg

服务器：安装node-rtsp-stream

npm install node-rtsp-stream

服务器：启动

如果没有RTSP流或访问不到，可以自己模拟一个。具体参考：

文件app.js

Stream = require('node-rtsp-stream')
stream = new Stream({name: 'name',streamUrl: 'rtsp://10.0.2.15:8554/test.264',wsPort: 9999,ffmpegOptions: { // options ffmpeg flags'-stats': '', // an option with no neccessary value uses a blank string'-r': 30 // options with required values specify the value after the key}
})

启动

node app.js

新建index.html

<!DOCTYPE html>
<html>
<head><title>JSMpeg Stream Client</title><style type="text/css">html, body {background-color: #111;text-align: center;}</style></head>
<body><canvas id="video-canvas"></canvas><script type="text/javascript" src="jsmpeg.min.js"></script><script type="text/javascript">var canvas = document.getElementById('video-canvas');var url = 'ws://localhost:9999/';var player = new JSMpeg.Player(url, {canvas: canvas});</script>
</body>
</html>

直接打开index.html，就能播放。

========================================================================

下面是前端方案。

前端：搭建服务器

Ubuntu搭建最简单WEB服务器-CSDN博客

复制jsmpeg.min.js/index.html

默认工作目录是/var/www/html

测试

如果发现不能播放：

检查流是否正常，能否访问（比如在虚拟机中可能就无法访问外部流）。

流是否已结束（此时可以重启服务器，赶紧刷新）。

其他方案

node-rtsp-stream

node-media-server

rtsp-streaming-server

fluent-ffmpeg

浏览器WEB播放RTSP

注意：浏览器不能直接播放RTSP，必须转换后都能播放。这一点所有的播放都是如此。参考 https://github.com/kyriesent/node-rtsp-stream GitHub - phoboslab/jsmpeg: MPEG1 Video Decoder in JavaScript 相关文件方便下载 https://download.csdn.net…...

编程日记 2025/3/7 5:49:00

将PDF转为Word的在线工具

参考视频：外文翻译文章目录一、迅捷PDF转换器二、Smallpdf 一、迅捷PDF转换器二、Smallpdf...

编程日记 2025/3/7 5:47:59

03. 对象的创建，存储和访问原理

文章目录 01. 对象创建1.1 创建过程概览1.2 类加载检查1.3 为对象分配内存1.4 将内存空间初始化为零值1.5 设置对象的必要信息1.6 总结 02. 对象的内存布局2.1 对象头区域2.2 实例数据区域2.3 对齐填充区域2.4 总结 03. 对象的访问定位其他介绍01.关于我的博客注：读…...

编程日记 2025/3/7 5:45:56

机器学习-GBDT算法

目录一. GBDT 核心思想二. GBDT 工作原理 **(1) 损失函数优化** **(2) 负梯度拟合** **(3) 模型更新** 三. GBDT 的关键步骤四. GBDT 的核心优势 **(1) 高精度与鲁棒性** **(2) 处理缺失值** **(3) 特征重要性分析** 五. GBDT 的缺点 **(1) 训练…...

编程日记 2025/3/7 5:43:54

redis基础结构

title: redis基础结构 date: 2025-03-04 08:39:12 tags: redis categories: redis笔记 Redis入门 （NoSQL, Not Only SQL） 非关系型数据库关系型数据库：以表格的形式存在，以行和列的形式存取数据，一系列的行和列被…...

编程日记 2025/3/7 5:40:52

【keil】一种将STM32的armcc例程转换为armclang的方式

【keil】一种将所有armcc例程转换为armclang的方式改的原因第一步下载最新arm6第二步编译成功第三步去除一些warning编译成功我这边用armclang去编译的话，主要是freertos中的portmacro.h和port.c会报错改的原因我真的服了，现在大部分的单片机例程都…...

编程日记 2025/3/7 5:38:50

计算机视觉算法实战——表面缺陷检测（表面缺陷检测）

✨个人主页欢迎您的访问 ✨期待您的三连 ✨ ✨个人主页欢迎您的访问 ✨期待您的三连 ✨ ✨个人主页欢迎您的访问 ✨期待您的三连✨ 1. 引言表面缺陷检测是计算机视觉领域中的一个重要研究方向，旨在通过图像处理和机器学习技术自动检测产品表面的缺陷&…...

编程日记 2025/3/7 5:36:48

window下的docker内使用gpu

Windows 上使用 Docker GPU需要进行一系列的配置和步骤。这是因为 Docker 在 Windows 上的运行环境与 Linux 有所不同，需要借助 WSL 2（Windows Subsystem for Linux 2）和 NVIDIA Container Toolkit 来实现 GPU 的支持。以下是详细的流程：一、环境准备 1.系统要求 Window…...

编程日记 2025/3/7 5:35:47

Modbus协议（TCP）

从今开始，会详细且陆续整理各类的通信协议，以便在需要且自身忘记的情况下，迅速复习。如有错误之处，还请批评指正。一、Modbus协议的简述 Modbus协议作为应用层协议，基于主从设备模型，主设备负责请求消息&…...

编程日记 2025/3/7 5:34:45

虚拟系统配置实验报告

一、实验拓扑图二、实验配置要求一： 虚拟系统： 设置管理： 进行信息配置 R1配置虚拟系统配置 a： b： c： 测试 a–>b： 检测...

编程日记 2025/3/7 5:33:44

Agentic系统：负载均衡与Redis缓存优化

摘要本文在前文Agentic系统的基础上，新增负载均衡（动态调整线程数以避免API限流）和缓存机制（使用Redis存储搜索结果，减少API调用）。通过这些优化，系统在高并发场景下更加稳定高效。代码完整可…...

编程日记 2025/3/7 5:32:43

28-文本左右对齐

给定一个单词数组 words 和一个长度 maxWidth ，重新排版单词，使其成为每行恰好有 maxWidth 个字符，且左右两端对齐的文本。你应该使用 “贪心算法” 来放置给定的单词；也就是说，尽可能多地往每行中放置单词。必要时可…...

编程日记 2025/3/7 5:31:41

建筑兔零基础自学python记录39|实战词云可视化项目——章节分布10（上）

这次我们来制作《红楼梦》各章节的分布情况： 源代码： import pandas as pd import numpy as np import matplotlib.pyplot as pltdf_hlm pd.read_csv("hlm.txt", names["hlm_texts"]).dropna()df_hlm df_hlm[~df_hlm.hlm_texts.s…...

编程日记 2025/3/7 5:30:40

Impacket工具中的横向渗透利器及其使用场景对比详解

在渗透测试中，横向移动（Lateral Movement）是指攻击者在获得一个系统的控制权限后，通过网络进一步渗透到其他系统的过程。Impacket 是一款强大的渗透测试工具集，提供了多种实现横向渗透的脚本，常见的工具包括…...

编程日记 2025/3/7 5:29:38

基于java，SpringBoot和Vue的医院药房药品管理系统设计

摘要随着医疗行业信息化的快速发展，高效、精准的医院药房药品管理对于提升医疗服务质量和医院运营效率至关重要。本文基于 Java 语言，采用 SpringBoot 框架和 Vue 框架进行医院药房药品管理系统的设计与研究。该系统以 SpringBoot 作为后端开发框架&am…...

编程日记 2025/3/7 5:28:37

MQ保证消息的顺序性

在消息队列（MQ）中保证消息的顺序性是一个常见的需求，尤其是在需要严格按顺序处理业务逻辑的场景（例如：订单创建 → 支付 → 发货）。一、消息顺序性被破坏的原因生产者异步/并行发送：消息可能…...

编程日记 2025/3/7 5:26:35

cmake、CMakeLists.txt、make、ninja

文章目录一、概念0.cmake官网1.什么是cmake2.为什么使用cmake3.CMakeLists.txt 二、CMakeLists.txt语法：如何编写CMakeLists.txt，语法详解(0)语法基本原则(1)project关键字(2)set关键字(3)message关键字(4)add_executable关键字(5)add_subdirectory关键…...

编程日记 2025/3/7 5:25:31

数据结构与算法计算机组成八股

文章目录数据结构与算法数组与链表的区别堆的操作红黑树定义及其原理计算机组成int和uint的表示原码反码补码移码的定义？为什么用补码？ 数据结构与算法数组与链表的区别堆的操作红黑树定义及其原理计算机组成 int和uint的表示原码反码补码移…...

编程日记 2025/3/7 5:23:29

RoboBrain：从抽象到具体的机器人操作统一大脑模型

25年2月来自北大、北京智源、中科院自动化所等的论文“RoboBrain: A Unified Brain Model for Robotic Manipulation from Abstract to Concrete”。目前的多模态大语言模型（MLLM） 缺少三项必备的机器人大脑能力：规划能力，将复杂…...

编程日记 2025/3/7 5:22:27

算法之前缀和与滑动窗口与背包问题的差异(子数组之和为k问题)

文章目录使用前缀和哈希表560.和为K的子数组525.连续数组2588.统计美丽子数组数目子数组的定义是原来的数组当中连续的非空的序列，而我们的背包问题的选与不选的情况，对应的是这个非连续的情况,那么这种情况就要注意当然啦，对于线性的时间内…...

编程日记 2025/3/7 5:19:23

// 导出async function exportExcel(fileName "共识调整.xlsx") {// 所有数据const exportData await getAllMainData();// 表头内容let fitstTitleList [];const secondTitleList [];allColumns.value.forEach(column > {if (!column.children) {fitstTitleL…...

编程新知 2025/10/27 0:07:53

【解密LSTM、GRU如何解决传统RNN梯度消失问题】

解密LSTM与GRU：如何让RNN变得更聪明？ 在深度学习的世界里，循环神经网络（RNN）以其卓越的序列数据处理能力广泛应用于自然语言处理、时间序列预测等领域。然而，传统RNN存在的一个严重问题——梯度消失&#…...

编程新知 2025/8/3 16:10:07

unix/linux，sudo，其发展历程详细时间线、由来、历史背景

sudo 的诞生和演化，本身就是一部 Unix/Linux 系统管理哲学变迁的微缩史。来，让我们拨开时间的迷雾，一同探寻 sudo 那波澜壮阔（也颇为实用主义）的发展历程。历史背景：su的时代与困境 ( 20 世纪 70 年代 - 80 年代初) 在 sudo 出现之前，Unix 系统管理员和需要特权操作的…...

编程新知 2025/10/21 3:46:44