gpt4 book ai didi

html - 播放带 HTML 视频标签的 m3u8 文件

转载 作者:技术小花猫 更新时间:2023-10-29 11:38:52 25 4
gpt4 key购买 nike

我正在尝试使用 HTTP Live Streaming (HLS) 将视频流式传输到我的计算机和 iPhone。在阅读了 Apple 的“HTTP 直播流概述”以及“为 iPhone 和 iPad 创建和部署 HTTP 直播流媒体的最佳实践”之后,我有点卡住了。

我获取了源文件(一个 mkv)并使用 ffmpeg 将文件编码为 MPEG-TS 格式和 Apple 推荐的设置以及 Baseline 3.0 配置文件:

ffmpeg -i "example.mkv" -f mpegts -threads:v 4 -sws_flags bicubic -vf "scale=640:352,setdar=16/9,ass=sub.ass" -codec:v libx264 -r 29.970 -b:v 1200k -profile:v baseline -level:v 3.0 -movflags faststart -coder 1 -flags +loop -cmp chroma -partitions +parti8x8+parti4x4+partp8x8+partb8x8 -me_method hex -subq 6 -me_range 16 -g 239 -keyint_min 25 -sc_threshold 40 -i_qfactor 0.71 -b_strategy 1 -qcomp 0.6 -qmin 10 -qmax 51 -qdiff 4 -direct-pred 1 -fast-pskip 1 -af "aresample=48000" -codec:a libvo_aacenc -b:a 96k -ac 2  -y "output.ts"

不用担心。我用了 pre-compiled segmenting tool分割视频并构建 .m3u8 播放列表。生成的文件如下所示:

#EXTM3U
#EXT-X-TARGETDURATION:10
#EXTINF:10,
http://localhost/media/stream/stream-1.ts
#EXTINF:10,
http://localhost/media/stream/stream-2.ts
#EXTINF:10,
http://localhost/media/stream/stream-3.ts
#EXT-X-ENDLIST

我对照一些 Example Playlist Files for use with HTTP Live Streaming 进行了检查,而且我没有看到任何问题。我还尝试在 VLC 中播放 .m3u8 文件,效果非常好。

我创建了一个 HTML 页面来播放该文件:

<html lang="en">
<head>
<meta charset=utf-8/>
</head>
<body>
<div id='player'>
<video width="352" height="288" src="stream.m3u8" controls autoplay>
</video>
</div>
</body>
</html>

并且此页面在我的 iPhone 上的 Chrome、Safari 中无法使用。 w3schools 上的 html5 视频标签示例在我的电脑上运行良好,上面提到的苹果官方概述提供了一个与我的页面非常相似的 HTML 示例。然而,当我访问我自己的 .m3u8 页面时,我的视频播放器完全没有响应。

最佳答案

答案可能有点晚,但您需要在视频标签中提供 MIME 类型属性:type="application/x-mpegURL"。我用于 16:9 流的视频标签如下所示。

<video width="352" height="198" controls>
<source src="playlist.m3u8" type="application/x-mpegURL">
</video>

关于html - 播放带 HTML 视频标签的 m3u8 文件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19782389/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com