问题标签 [media-source]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
188 浏览

javascript - MediaSource API,缓冲奇怪的行为

我正在测试一个使用 MediaSourceAPI 的流式 Web 应用程序。一切正常,但是当我流式传输大文件(即 240MB 或更多)时,视频的缓冲区有一个奇怪的行为。为了更清楚,我附上了三张你可以检查的图片。我的脚本创建了一个 mediaSource 对象,然后它调用 addSourceBuffer ,然后它多次调用 appendBuffer 因为有要附加的块。我认为我没有很好地配置缓冲区,因此 mediaSource API 使用缓冲区长度的默认值。

请问你能帮帮我吗?

访问https://productforums.google.com/forum/#!category-topic/chrome/report-a-problem-and-get-troubleshooting-help/windows8/Stable/0igRzDJQ7ds

0 投票
0 回答
937 浏览

google-chrome - mediaSource API 无法在 Chrome 上运行,但在 Firefox 上运行顺畅

我正在尝试流式传输使用 gstreamer 生成的 WebM 格式视频,并通过 websockets 发送单个帧。webm 文件的典型字节排列是这样的(你可能已经熟悉了)。

我所看到的,当我将 gstreamer 输出重定向到文件接收器时,绝对时间码和相对时间码被正确写入。相同的 gstreamer 管道用于提取字节序列(样本)。然后这些样本通过 websocket 传输并使用 MediaSource API 在客户端接收。

此处描述了我的客户端 javascript 实现。当我在 Firefox 中运行客户端时,视频运行流畅,没有任何故障。但在 Chrome 上,视频会在一段时间后或开始时冻结。

我尝试修改 sourceBuffer.mode = "sequence" 或 "segments",没有一个选项适用于 Chrome,而 Firefox 上的视频源完全不受“sourceBuffer.mode”的任何值的影响。这些模式的描述在这里。(我假设 MediaSource API 在 IE 和 Firefox 上的工作方式相同,因为 Mozilla 网站上没有可用的文档)。

此外,在 Chrome 和 Firefox 中,mediaSource.duration 都是 Infinity/NaN。

无论我尝试哪种方式,chrome 上的实时提要都无法正常工作,而 Firefox 显示的是流畅的视频。任何建议,为什么会发生这种情况?

更新:我升级到 Chrome 版本 41,它提供了有关 chrome://media-internals 的更多详细信息。显示的消息是:

如何修复或计算“append_window_end”???

0 投票
4 回答
4279 浏览

javascript - 从视频中删除 TextTrack

TextTrack有没有一种好方法可以删除通过 JavaScript 添加到 HTML5标记的单个<video>标记?下面的代码是一个如何添加轨道的简单演示,但我还没有找到删除轨道的好方法:

0 投票
2 回答
2949 浏览

javascript - 从 mediasource 源缓冲区动态附加和删除 mpeg-dash 段

我正在使用 HTML5 视频元素编写一个简单的 mpeg-dash 流媒体播放器。我正在创建MediaSource并附加一个SourceBuffer。然后我将破折号片段附加到这个源缓冲区中,一切正常。

现在,我想做的是,我想根据媒体元素的当前时间动态地预取这些片段。这样做时有很多疑问,MediaSource文档没有回答这些疑问。

  1. 是否可以知道 sourceBuffer 一次可以支持多少数据?如果我有一个非常大的视频并将所有片段附加到源缓冲区中,它会容纳所有片段或导致错误或会减慢我的浏览器速度吗?

  2. 如何计算源缓冲区中的片段数?

  3. 如何计算最后一段的呈现时间或结束时间SourceBuffer

  4. 我们如何只删除特定的片段集SourceBuffer并用其他分辨率的片段替换它们?(我想做它来支持自适应分辨率切换运行时间。)

谢谢。

0 投票
1 回答
1865 浏览

chromecast - Chromecast 最大内存大小

Chromecast 接收器的最大视频缓冲区大小是多少?我正在使用 MediaSource 滚动我自己的类似 HLS 的实现,并且需要缓冲区限制。

0 投票
0 回答
313 浏览

javascript - 让 MediaSource 在 Firefox 37.0.1 Ubuntu 14.04 上工作的问题

我在 Ubuntu 14.04 上运行 firefox 37.0.1 版,并且确实将 about:config 的 media.mediasource.enabled 设置为 true。

但我无法让简单的 MediaSource(来自 Media Source Extensions)工作。例如,如果我这样做作为我的 index.html:

我只看到登录到控制台“测试 1”而不是“测试 2”。因此,似乎它可能在上述代码中的 MediaSource 中“卡住”了。是的,如果注释掉“新 MediaSource”行,则打印“测试 2”。知道为什么会这样吗?我的目标是让 MediaSource 功能在这个 Firefox/Ubuntu 组合上运行。

谢谢。

亨利

0 投票
2 回答
2933 浏览

html - 如何识别 html5 媒体元素已停止并等待更多媒体继续播放

我正在使用MediaSourceSourceBuffer播放 html5 视频。我正在按顺序获取 DASH 片段以继续不间断的视频播放。但有时,由于网络状况,SourceBuffer用完数据继续玩。当该数据到达时,播放恢复。但在此期间,视频看起来停滞不前。我想在媒体元素上添加一些视觉指示,它被暂停作为缓冲所需数据。

我尝试在视频上绑定“等待”和“停滞”事件,但没有一个事件被触发。

有没有其他方法可以知道媒体是否已停止以及何时恢复?

谢谢。

0 投票
0 回答
1352 浏览

javascript - 使用 MediaSource api 在 safari 上流式传输 HLS

我想使用媒体源扩展流式传输 HLS 片段。我已经尝试过使用 mpeg-dash 片段(使用 MP4Box 生成)和媒体源扩展。

它可以在 chrome、Windows 8 IE、android chrome 上流畅播放。它也适用于野生动物园,但它没有获得媒体的总持续时间。所以我在 safari 上对 HLS 片段进行了同样的尝试。生成的 HLS 数据有.m3u8文件和其他.ts片段。当我将 .m3u8 文件分配为视频元素的源时:

事情就像魅力一样。但后来我失去了对运输的控制。为了完全控制传输和响应式分辨率更改,我尝试将.ts片段一个一个放入 initializedsourcebuffer中。它在野生动物园中严重失败。但相同的 HLS 片段与exo player. 我的问题是: 1. 如何使用 Media Source Extension 在 safari 上实现 HLS 流。2. 由于 HLS 生成不像 dash 生成那样产生任何init片段,媒体播放器如何理解持续时间和其他元数据?3、如何获取这个HLS的编解码器?或者是否有任何 safari 默认支持并且可以在这里使用的编解码器?

谢谢。

0 投票
1 回答
2172 浏览

javascript - Smooth representation change using Media Source API

I am currently working on DASH player using JavaScript and MediaSource API

Streaming is working fine but I am stuck with changing representation. Probably the most bruteforced way to change representation during playback is about replacing <video> element in HTML document.

Hovewer, I was wondering if there is a simple way to implement adaptation (changing representation) with Media Source API. I've read that single Media Source object can handle many source buffers, but after adding second video buffer an exception is raised.

I am using Chrome 43.0.2357.65m

Exception:

0 投票
2 回答
16308 浏览

ffmpeg - 使用 mp4box 直播短跑内容

我正在尝试使用媒体源扩展 API 将H.264内容流式传输到HTML5 。

以下方法效果很好:

ffmpeg -i rtsp://10.50.1.29/media/video1 -vcodec copy -f mp4 -reset_timestamps 1 -movflags frag_keyframe+empty_moov -loglevel quiet out.mp4

接着: mp4box -dash 1000 -frag 1000 -frag-rap out.mp4

我可以获取MP4Box输出out_dashinit.mp4

但是,这不是直播内容的好方法。

我现在要做的是创建一个单一的管道,以便实时完成,并尽可能减少延迟。使用 FFmpeg,可以将输出重定向到stdout而不是out.mp4抓取内容。我不知道是否可以将 MP4Box 合并到管道中。

  1. MP4Box 可以从不是文件的源中获取输入数据吗?
  2. MP4Box 能否在实时到达时逐步(从文件或其他来源)抓取此类内容?即,如果流停止 1 秒并自动恢复,请稍等片刻。
  3. 同样的问题,但对于输出:它可以输出到不是文件的东西(例如stdout),并且可以逐步这样做,以便每当输出数据准备好时,我就可以将其传输到 Web 客户端,本质上是生成一个永无止境的虚线 MP4。