油管前端如何隐藏视频播放链接的?

2023-11-25 18:13:52 +08:00
 Moonkin
鄙人不是前端猿,以前一直以为视频都是一个链接指向.mp4 或者.m3u8/.ts 。今天看了 b 站和 YouTube ,发现 F12 network 里面没有请求这些文件。求教这是什么实现原理?有什么关键词或者大概讲一下就行,不用太详细。
2319 次点击
所在节点    程序员
7 条回复
SunsetShimmer
2023-11-25 18:37:12 +08:00
网络请求获取分段视频,请求里能找到,但不会显示成视频,因为格式可能是私有或者包装过的。

Youtube 视频下载的第三方实现: https://github.com/yt-dlp/yt-dlp
a8Fy37XzWf70G0yW
2023-11-25 20:20:10 +08:00
YT 邏輯是這樣的:

1.使用者打開一個頁面要觀看影片
2.播放器根據內容 ID 去重定向伺服器上獲取最近有此內容的 CDN 列表
3.播放器嘗試連接列表中的 CDN ,如成功,則獲取 CDN 上私有格式編寫的相應格式元數據訊息
4.以分段方式,同時嘗試獲取元數據中顯示的影像流和音頻流(如分辨率大於 1080P 獲取的是兩個流)
5.開始載入播放器進行播放,並定期 post 使用者的播放進度到伺服器(這麼做的目的是減少帶寬消耗,並實現自動調節畫質的功能)
estk
2023-11-25 22:26:02 +08:00
m3u8 和 mpd 都是视频分片技术
油管用的好像是 mpd ,可以做到音频和视频分开调节码率
只知道点皮毛和关键词,细节没深究,等大神解答
vituralfuture
2023-11-26 11:06:21 +08:00
blob url 好像通常不会显示在浏览器开发者工具中

另外提到私有格式的,我有一个疑问,私有格式是否影响硬件视频解码?
siknet
2023-11-26 18:03:52 +08:00
油管 1080P 以上的码率才是音视频分开的
SunsetShimmer
2023-11-26 18:48:52 +08:00
@vituralfuture #4 私有格式的核心应该还是标准的视频,交给浏览器之前通过 js 修改一下。
Satelli
2023-11-27 09:40:12 +08:00
@viberconnection
@siknet

1080p 不是限定条件,只是音频 + 视频包在一起的最高限定为 1080p 而已,并且 YouTube 网页版也不再提供 1080p 的单文件音频 + 视频了。以 DASH 方式载入的视频下到 144p 上到 8K 都有的。
https://gist.github.com/MartinEesmaa/2f4b261cb90a47e9c41ba115a011a4aa

@estk HLS 也可以分开调节音频和视频码率。如 https://events-delivery.apple.com/2409nbcxymeynatwojbbrjuhryomtudb/m3u8/vod_index-oXZvssLWyjfQDEQuVuCBHPWDywaNEipk.m3u8

@vituralfuture 要硬件解码需要走平台的硬解 API ,即 Windows 仅限 PlayReady (原生、Edge 、IE ),苹果平台仅限 FairPlay (原生、Safari )。Chrome 只有在 ChromeOS 上才有 Widevine 硬解,否则为软解。

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

https://www.v2ex.com/t/995156

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

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

© 2021 V2EX