基于WebRTC+SRS+Node.js搭建开源跨端直播平台(累计450+⭐️)

前言

距离上一篇 文章 已经过了三个月了,来简单的总结看看这三个月我都做了些啥~

生态

以上数据统计截止至2023年12月13号

线上地址、源码

前台优化

首页

首页的背景图是可以后台配置的;有的直播间需要SVIP权限,没有的话则播放不了~

分区

加了些小提示(直播中、SVIP、CDN)

进入直播间(后台没有配置直播间背景图)

进入直播间(后台配置了直播间背景图)

移动端界面:

初步支持登录:

直播间信息:

客服(二维码可在后台配置):

后台优化

登录

控制台

直播记录

直播记录主要是做一些数据统计,比如观看数、弹幕数、直播时长等等

直播间列表

直播间列表主要展示或编辑直播间信息,比如开播预览图,直播间背景图,直播间是否可见,是否需要拉流鉴权等等

在线主播/观众

可以在线踢主播/观众

直播配置

可在后台编辑首页背景,客服二维码

用户角色权限(RABC)模块

用户角色权限其实涉及很多东西,这里就简单看看

用户管理

编辑用户角色

角色列表

角色树

编辑角色权限

安卓客户端

首页、分区、排行:

直播间详情、分区详情:

我的已登录/未登录:

直播中心:

为什么既有跨端的flutter和react-native,又有原生的kotlin呢,最主要的原因还是业务需求,一开始是打算用flutter开发的,没有别的意思,单纯的就是试试flutter练练手,后面发现flutter用的dart语言,类型太不习惯了,于是就索性换其他跨端框架,然后就用了react-native,果然用了react-native,感觉就跟普通的前端开发差不多了,也有很多现成的轮子可以用,开发起来贼爽,但是后面发现rn太过于依赖社区插件了,我的需求里用到了一个插件,出现了问题,有兴趣的嗯可以看看这个:issue,然后我自己解决不了,不得不又换回flutter哈哈哈(其实习惯了就好),后面发现flutter有些需求得依赖原生,比如获取系统扬声器的声音,网上搜了一轮发现没有flutter的轮子,就只能是用原生,于是就有了kotlin的版本。

注意:我只用过一门语言(js/ts),因此不管是dart还是kotlin,都是只懂一点皮毛。

加群

参考这里:live.hsslive.cn/about/group

总结、计划

  1. 不知不觉,好像已经好久没有研究过技术了,现在都是为了实现业务而学习。
  2. 继续完善 billd-live,不断提升用户体验。
相关推荐
Jinxiansen02112 分钟前
Vue 3 响应式核心源码详解(基于 @vue/reactivity)
前端·javascript·vue.js
OEC小胖胖5 小时前
去中心化身份:2025年Web3身份验证系统开发实践
前端·web3·去中心化·区块链
vvilkim6 小时前
Electron 进程间通信(IPC)深度优化指南
前端·javascript·electron
用户362757424537 小时前
手撕Pandas:让数据听话的Python神器(不是Excel替代品!)
github
用户3900368855877 小时前
告别Vim卡顿!Neovim如何用现代架构重塑编辑器体验
github
ai小鬼头8 小时前
百度秒搭发布:无代码编程如何让普通人轻松打造AI应用?
前端·后端·github
漂流瓶jz8 小时前
清除浮动/避开margin折叠:前端CSS中BFC的特点与限制
前端·css·面试
用户3228360084478 小时前
GitHub星标破25万!这份开发者路线图让我少走3年弯路
github
用户0811057811778 小时前
Elasticsearch:当数据宇宙遇见超级探针!分布式搜索的魔法揭秘
github
前端 贾公子8 小时前
在移动端使用 Tailwind CSS (uniapp)
前端·uni-app