Question

我们有一个视频流平台，用户可以在其中播放实时视频流并将其与一组演示幻灯片同步。要在iOS上显示广播，我们使用的是HTTP直播。为了在iOS上的流中正确显示幻灯片，我们正在收听Apple的Quicktime Javascript API提供的qt_timedmetadataupdated事件。这个方法在这里描述：

http://www.wowza.com/forums/content.php?355-How-to-debug-timed-data-events-%28ID3-tags%29-from-Apple-HLS-streams-in-iOS-devices

但是，在iOS8中，此方法不再有效，因此我们正在尝试寻找替代解决方案。

有没有人知道我们该如何做到这一点？

我设法做的唯一进展是检查带内元数据文本轨道＆＃34;如下所述：

https://github.com/videojs/videojs-contrib-hls#in-band-metadata

我已使用flowplayer和flashls plugin设置了下面的示例测试页：

http://jsbin.com/vohicoxegi/1/edit?html,js,output

在代码中，我创建了一个间隔，每隔500毫秒检查一个文本轨道是否存在kind属性为metadata。我注意到当向流中注入一些定时元数据时，会创建其中一个文本轨道。但问题是我无法访问定时元数据中的数据，我需要正确地同步（前面提到的）幻灯片。

请注意，我只关注直播。播放现有媒体文件不是问题。

Answer 1

铁迈克的解决方案几乎是正确的。当跟踪事件发生时，您必须将其mode属性设置为hidden，否则cuechange事件将无法触发。这是一个完整的例子：

$(videoElement)[0].textTracks.addEventListener('addtrack', function(addTrackEvent) {
  var track = addTrackEvent.track;
  track.mode = 'hidden';

  track.addEventListener('cuechange', function(cueChangeEvent) {
    // do what you want with the cueChangeEvent
  });
});

Answer 2

我认为文本轨道是要走的路。之前我也使用过qt_timedmetadataupdated，并在ios8上很好地工作了这样：

$(videoElement).textTracks.addEventListener('addTrack', function(addTrackEvent) {
  var track = addTrackEvent.track;
  track.addEventListener('cuechange', function(cueChangeEvent) {
    and so on...
  })
})

HTTP Live Streaming：如何在iOS8中使用Javascript监听作为ID3标签嵌入的定时元数据？

2 个答案: