基于Vue3 + WebRtc + Node + SRS + FFmpeg搭建的直播间
billd 直播间,目前实现了类似 bilibili 的 Web 在线直播功能,即你(房主)可以发布直播,别人进入你的直播间后能看到你的直播内容;而你也可以作为观众,进入别人的直播间看别人的直播内容。
- 原生 webrtc 推拉流
- srs webrtc 推流,
webrtc
或http-flv
或hls
拉流 - OBS推流
- 用户模块(qq 登录)
- 支付模块(支付宝当面付)
- 订单模块
- 商品模块
- 适配移动端
- 在线后台
首页
进入直播间
发起直播
排行榜
首页
分区列表
进入直播间
- 从零搭建迷你版 b 站 web 直播间(Vue3+WebRTC+Node+SRS),公开课一:项目功能介绍 1
- 从零搭建迷你版 b 站 web 直播间(Vue3+WebRTC+Node+SRS),公开课一:项目功能介绍 2
- 从零搭建迷你版 b 站 web 直播间(Vue3+WebRTC+Node+SRS),公开课二:本地运行项目 1
- 从零搭建迷你版 b 站 web 直播间(Vue3+WebRTC+Node+SRS),公开课二:本地运行项目 2
- 前端相关:vue3 以及相关技术栈
- 后端相关: nodejs 以及相关技术栈、socket.io
- webrtc 相关: webrtc 相关 api(RTCPeerConnection)、coturn
- 流媒体服务器相关: srs、 ffmpeg
- 数据库相关: mysql、redis
- docker 相关:docker
- 获取项目代码
git clone https://github.com/galaxy-s10/billd-live.git
- 安装依赖
建议使用 node 版本:16.16.0
pnpm i
更新 billd 相关依赖:
pnpm i billd-utils@latest billd-scss@latest billd-html-webpack-plugin@latest billd-deploy@latest
- 运行
npm run start
- 打包
npm run build
https://live.hsslive.cn/about/faq
不通过 npm 安装 flv.js,因为安装了 flv.js 后,,应该是我的 vscode 用了 vscode 的 ts 版本(ts 的 5.x 版本),用回工作区(也就是项目里面安装的 ts 的 4.9 的版本)的 ts 版本就没事了?import flvJs from 'flv.js'
会导致 vscode 的 ts 错乱。因此直接下载 flv.min.js 使用。
Chrome 版本 114.0.5735.133(正式版本) (arm64),调试移动端的时候,此时的地址栏是:http://localhost:8000/h5/3?liveType=srsHlsPull,使用模拟的安卓设备,点击播放没问题(播放的 hls),但是换成模拟一个苹果设备(任意苹果设备都行,iphone6,7,8,X,12 Pro 等等),点击播放都会报错:VIDEOJS: ERROR: (CODE:4 MEDIA_ERR_SRC_NOT_SUPPORTED) The media could not be loaded, either because the server or network failed or because the format is not supported.
Firefox 版本 114.0.2 (64 位),调试移动端时,此时的地址栏是:http://localhost:8000/h5/3?liveType=srsHlsPull,模拟安卓、苹果设备都能正常播放,但是小概率会报 blob 解码,但刷新就又好了
Safari 版本:版本 16.5.1 (18615.2.9.11.7),开发===>响应式设计模式,模拟任何苹果设备,都能正常播放,并且行为和实际的苹果手机行为一致(苹果手机有的 bug,在电脑的 Safari 调试的时候也有。但电脑的 Firfox 和 Chrome 调试时没有,实际上电脑的 Firfox 和 Chrome 调试时应该也要出现这个 bug)
https://live.hsslive.cn/about/team
https://live.hsslive.cn/sponsors
如果你对该项目感兴趣或有想法,欢迎进群或添加我的微信:
配置:macbookpro 2020 m1,8 核 CPU,16G 内存
- 操作系统:mac os 13.3.1
- node 版本:16.16.0
- pnpm 版本:8.6.3
- docker 版本:20.10.24, build 297e128
- mysql 版本:基于 docker,镜像:mysql:8.0
- srs 版本:基于 docker,镜像:registry.cn-hangzhou.aliyuncs.com/ossrs/srs:5
- ffmpeg 版本:5.1.2
配置:4 核 CPU,4G 内存,8M 带宽(广州)
- 操作系统:CentOS Linux release 8.2.2004
- nginx 版本:1.22.1
- node 版本:v16.19.1
- pnpm 版本:8.6.3
- docker 版本:23.0.1, build a5ee5b1
- redis 版本:基于 docker,镜像:redis:7.0
- mysql 版本:基于 docker,镜像:mysql:8.0
配置:2 核 CPU,2G 内存,带宽 30M(香港)
- 操作系统:Alibaba Cloud Linux release 3 (Soaring Falcon)
- node 版本:v16.20.0
- pnpm 版本:8.6.3
- pm2 版本:5.3.0
- docker 版本:24.0.2, build cb74dfc
- srs 版本:基于 docker,镜像:registry.cn-hangzhou.aliyuncs.com/ossrs/srs:5
- ffmpeg 版本:6.0