寻求方案,解决 WEB 端,循环播放固定的视频播放带来的大量的流量消耗问题。

2023-12-18 13:41:22 +08:00
 leyfung

寻求方案,解决 WEB 端,循环播放固定的视频播放带来的大量的流量消耗问题。

问题产生:可视化大屏中有视频播放功能,每天会一直播放,消耗大量的流量。

需求:减少流量的消耗。

目前的方案:使用浏览器缓存,设置视频缓存过期时间。

有不有更好的方案?因为浏览器有缓存大小的限制,视频循环播放一轮之后,缓存会被清理。

8741 次点击
所在节点    程序员
79 条回复
sub166
2023-12-18 20:04:16 +08:00
浏览器高版本的话可以试试 opfs
zeusho871
2023-12-18 20:11:12 +08:00
有的网站发现你视频在后台 它给你播放音频 不加载视频 等于他视频和音频是不同的流
Tokin
2023-12-18 21:46:06 +08:00
多大的视频内容,试试存到 IndexDB ?
kaneg
2023-12-18 21:53:43 +08:00
浏览器限制的是一个域名下的缓存大小,能不能切割成多个文件,分布在多个域名下,每个域名下不要超出限制,当然这个方案需要你能控制服务器的域名。
dcdlove
2023-12-19 08:29:17 +08:00
浏览器缓存都没弄明白还说有大小限制,真是服了
xuanbg
2023-12-19 08:34:41 +08:00
@leyfung 一个视频分几段存本地存储空间不行吗
cherryas
2023-12-19 09:10:14 +08:00
多少年前就有的成熟方案,外接个硬件控制。你非要纯技术解决
vultr
2023-12-19 09:26:45 +08:00
你加个本地 cdn 服务器就好了,反正都用上大屏了,本地也应该有电脑的,配置个 cdn 就行了。
cijiugechu
2023-12-19 10:06:24 +08:00
把视频切成几块 Blob 或 ArrayBuffer 后存 IndexdDB 里,IndexedDB 几乎没有大小限制
iosyyy
2023-12-19 10:10:16 +08:00
@54xavier 又刷到这个贴了 这么多人在这推荐什么 electron 是没做过项目吗..还是没上过班啊 这玩应是能随便改的?
dode
2023-12-19 11:02:08 +08:00
@leyfung 新的 api 接口授权后可以读本地文件夹
Huelse
2023-12-19 11:02:43 +08:00
原生 video 标签和视频响应头中加 Cache-Control 不就可以了,还能有啥?
dode
2023-12-19 11:04:57 +08:00
前端实现多个视频播放组件,轮流播放,隐藏切换布局,
qsnow6
2023-12-19 11:14:45 +08:00
@Huelse #72 +1 通过 Response cache 控制应该是最简单的
hongchends1
2023-12-19 11:15:44 +08:00
可以本地起个 server 或者 打包成应用
suke119
2023-12-19 13:42:33 +08:00
推荐本地化磁盘文件的 api ,最差就纯内存那就 MEMFS+Wasm.. 1 个 G 视频绰绰有余,有单独的 memfs npm 包,不过我因为视频有其他操作直接用的 ffmpeg 的
```
await ffmpeg.writeFile('input.mp4', inpf);
//读取视频数据

let memfsData = ffmpeg.FS('readFile', 'suke.mp4');

//创建虚拟 URL

this.transcodeUrl = URL.createObjectURL(new Blob([memfsData.buffer], { type: "video/mp4" }));

```
leyfung
2023-12-19 16:02:49 +08:00
经过测试,可以使用 indexedDB 存储比较大的视频文件,感谢各位的耐心解答
leyfung
2023-12-20 09:01:02 +08:00
@leyfung #77 用的 yux-storage 是一个基于 HTML5 IndexedDB 封装的 Web 本地数据离线存储库。https://github.com/yued-fe/yux-storage 阅文前端团队开发的
uyoungco
2023-12-27 14:50:32 +08:00
前几天看了帖子没觉得什么,今天这也让我遇到了 感谢 op ,我学习了

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://yangjunhui.monster/t/1001322

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX