🗒️网页播放rtsp视频流

type
status
date
slug
summary
tags
category
icon
password

前言

目前我所用过的四种方法可以实现网页播放 rtsp 视频流，在各大浏览器做了测试，基本都能显示。以下这些都可以在各大主流浏览器上播放，但我并没有深入了解，全是一些 demo，所以此文仅供参考

方法

目前这四种方法几乎都是流码实现网页播放功能,话不多说，如下：
  • RTSPtoWebRTC
  • VLC
  • ffmpeg+jsmpeg+node
  • rtsp 转 m3u8

一、RTSPtoWebRTC

安装 go 环境（下载地址）。建议默认安装，如果没默认可能要配置环境变量。下载安装后查看是否全局使用：
有相关信息就证明安装成功。一般 go 需要换源，国内速度太慢，或者说根本访问不了，建议换源（下面命令）
1、开启 Go 的 MODULE 支持：
2、软件源替换：
装好 Go 所需的环境变量后，下载 RTSPtoWebRTC ，下载完成后，修改 confing.json 中的 url 就行
notion image
运行命令：
如果是在 cmd 运行命令会报错，因为 Windows 下不支持。改为 Git.bash 运行就可以了， 如果没有 Git, 可以点击 下载，我相信大多会有的，毕竟是常用。测试运行是否成功，网页打开链接(如果你端口没改的话)：
打开后会看到视频播放，如果没成功请去其它博文看一下怎么使用吧，本人是成功显示的，这个还算比较简单的 demo

二、VLC

下载 VLC，建议用 32 位的，64 位没成功过，点击 下载，下载完成后打开 【媒体】---【打开网络串流】，输入 rtsp 地址后，选择播放旁边那个小箭头【串流】--【下一个】，把文件选项改为 http 后再点击【添加】，输入一个你记得住的地址，如：video,端口号默认即可。填完后点击【下一个】，勾选【激活转码】，把配置文件改为【Video - Theora + Vorbis（OGG）】---【下一个】，勾选【串流所有基本流】---【流】，这样就可以了，看不懂的可以百度以下这个，毕竟这个有很多的图文教程，这里我就懒得传图了。如果想看图文教程的推荐看这篇 文章。经过测试，ie 写法如下(其它浏览器不支持这种写法)：
其它浏览器正常写法

三、ffmpeg+jsmpeg+node

第一步是先安装 ffmpeg，并设置环境变量（/bin 目录），点击 下载，看设置环境变量是否成功(cmd)：
有一大堆东西就证明成功了，接下来就是下载脚本 jsmpeg，点击 下载，下载完成之后打开安装依赖包：
安装完成后依次安装 websocket 和 http-server ,依次输入如下命令：
这里并不打算全局安装 websocket ，全局安装运行会报找不到该模块，所以这里选择安装在该目录下的依赖包中就行。接下来启动服务：
  • supersecret 是密码
  • 8081 是 ffmpeg 推送端口
  • 8082 是前端 webSocket 端口
运行后在开一个新窗口，输入:
最后启动项目
浏览器打开 demo

四、rtsp 转 m3u8

参考上面第三安装 ffmpeg 和 http-server，在你自己的 demo 中创建一个叫 hls 的文件夹，运行（cmd):
使用 video.js 播放 m3u8 文件，头部引入：
html
script

结尾

目前我所能够实现网页播放 rtsp 的就这中方法，希望对你有所帮助
Echarts使用心得div根据屏幕缩放进行比例缩放