HTML5原生不支持RTSP协议，浏览器video标签仅支持HTTP(S)下的MP4/WebM/Ogg等格式；RTSP需通过服务端转协议（如ffmpeg转fMP4+MediaSource）或WebRTC网关实现播放。
HTML5 原生不支持 RTSP，无论有没有 Node.js 都无法直接播放。浏览器的 标签只认 HTTP(S) 协议下的 MP4、WebM、Ogg 等格式，RTSP 是专为流媒体控制设计的协议，和 HTML5 的媒体加载机制根本不兼容。
为什么不能直接用
这是最常踩的坑：写完发现视频区域空白、控制栏不出现、控制台报 DOMException: The element has no supported sources。原因很直接——浏览器根本没实现 RTSP 解析器，src 属性压根不会尝试发起 RTSP 请求，更不会处理 SDP、RTP 包或 TCP/UDP 传输层协商。
- 所有主流浏览器（Chrome/Firefox/Safari/Edge）均未在
中内置 RTSP 支持 -
MediaSource Extensions (MSE)也不接受原始 RTP 流，它只接受 ISO BMFF（如 fMP4）或 WebM 片段 - WebRTC 的
RTCPeerConnection虽能收 RTP，但需要信令配合、且不对接的srcObject直播流（需手动解码+渲染）
Node.js 的作用是「协议转换」，不是「绕过限制」
Node.js 在这里只是个中转服务端，它本身不赋予浏览器新能力，而是把 RTSP 流实时转成浏览器能吃的格式。常见组合有：
-
ffmpeg + Node.js HTTP server：用ffmpeg -i rtsp://... -f mp4 -movflags +frag_keyframe+empty_moov http://-吐出可播放的 fMP4 流，前端用MediaSource接收 -
Node.js + websocket + wasm 解码器：如h264bsd或mp4box.js，接收 RTP 包后在前端 JS 里软解 H.264 + 封装成 fMP4 片段 -
Node.js + RTSP over WebRTC 网关：比如mediasoup或janus-gateway，把 RTSP 源接入 WebRTC SFU，再用RTCPeerConnection播放
注意：Node.js 不是必须项——你也可以用纯 C 写的 nginx-rtmp-module、GStreamer pipeline、甚至云厂商的转码服务（如 AWS IVS、阿里云 RTS）来替代。
立即学习“前端免费学习笔记（深入）”；
真正可行的最小可行方案（无 Node.js）
如果你只想快速验证能否播通，又不想搭服务，可以试试现成的开源转流工具：
- 用
ffplay -i rtsp://... -vf "scale=640:480" -f mp4 -movflags +frag_keyframe+empty_moov http://127.0.0.1:8080/启一个本地 HTTP 流（需另起终端） - 前端用
MediaSource连接http://localhost:8080/，配合fetch+appendBuffer持续喂数据 - 或直接用
vlc --sout "#http{dst=:8080,access=http,mux=ts}" rtsp://...输出 HLS，前端用hls.js加载http://localhost:8080/index.m3u8
这些都不依赖 Node.js，但都绕不开「服务端转协议」这一环。硬要纯前端？目前只有极少数场景（如 IPC 摄像头自带 WebRTC 接口）能跳过这步。
最容易被忽略的是时间戳对齐和关键帧间隔：RTSP 流若 I 帧稀疏（如 5 秒一帧），前端 MSE 拼接时会卡顿或黑屏；而 ffmpeg 默认不强制插入 I 帧，得加 -g 30 -force_key_frames "expr:gte(t,n_forced*2)" 才稳。
