👩🏽‍🚒网页播放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 的就这中方法,希望对你有所帮助
Ubuntu/Linux 多开线程运行不同服务js生成目录并实现目录节点跟随滚动高亮