如何在DASH内容的
我已经在网页中使用<video>
标签嵌入了DASH视频。这个内容有多个音轨。我想支持音轨更改。
我用audioTracks[i].enable
功能来选择音轨。但音轨并没有改变。如何在DASH内容的<video>标记中启用音轨更改?
if (selected == i) {
audioTracks[i].enable = TRUE;
}
- 这是正确的方式?
- 有没有其他方法可以改变DASH(.mpd)内容的音轨?
通过音轨改变,我的意思是发起一个音轨改变事件,可以传播到更低的水平。不是为了实现轨道变化本身。
我试过进一步,
audioLanguage和郎视频标签的属性作为document.getElementById(id).lang = selectedIndex;
和document.getElementById(id).audioLanguage = selectedIndex;
即使这似乎没有工作。
更加清楚的是,正如@Svenskunganka的回答中所提到的,audioTracks[i].enable=TRUE;
在使用的版本中不受支持。
那么,有什么替代方法可以做audioTracks[i].enable=TRUE
呢。
我不想实现跟踪更改功能。这里的要求是仅指示浏览器的跟踪改变。
EDIT
:
正如我们在https://www.w3schools.com/tags/av_prop_audiotracks.asp中所见。该属性在chrome中不受支持。那么指示该轨道必须改变的另一种方式是什么?
有没有其他办法?或者audioTrack是唯一的方法(据我所知,迄今为止)?
Audio Track API尚未完全实现跨浏览器。见caniuse for Audio Track。您的问题很可能是您使用Chrome或Firefox进行测试。
Chrome has implemented it但尚未宣布何时将着陆。
它在Firefox 33中实现,但默认情况下未启用,必须通过用户首选项进行切换。 Gecko似乎也有一些问题无法执行多轨回放,这就是为什么此功能已被禁用了很长时间(Firefox在编写本文时为57版本)。
谢谢。好吧,我正在使用铬。它不支持音轨。有没有其他方法可以用来支持音轨更改?我的意思是没有使用audioTrack? – LearningC
@LearningC我不完全确定,但有一种名为BitMovin的产品似乎已经[专门解决MPEG-DASH的问题](https://bitmovin.com/multi-language-multi-audio/)。问题是[他们的玩家的JavaScript代码](https://bitmovin-a.akamaihd.net/bitmovin-player/stable/7/bitmovinplayer.js?ver=4.8)被严重混淆,所以很难找到他们是如何解决它而不会颠倒混淆。 – Svenskunganka
,您可以要求使用fetch()
或XMLHttpRequest()
的.mpd
文件,使用.text()
或.responseText
阅读application/dash+xml
响应为文本,该文本传递给DOMParser()
实例.parseFromString()
创建#document
,迭代document.documentElement
Period
元素的子节点,使用.querySelector()
来得到Representation
子节点,然后得到BaseURL
子节点Representation
,其中的URL是.textContent
具有路径,至少在被引用的文件,在同一目录的文件。
我们还可以选择视频网址,使用Promise.all()
加载和播放视频和进行能力音轨调用HTMLMediaElement.captureStream()
,我们.clone()
并传递给Promise
构造resolve()
,在链.then()
呼叫.addTrack()
在MediaStream()
实例每个轨道,然后将<video>
.srcObject
设置为包含音频和视频轨道的MediaStream
。
const video = document.querySelector("video");
const mediaStream = new MediaStream();
const url = "https://dash.akamaized.net/dash264/TestCases/10a/1/"
const mpd = "iis_forest_short_poem_multi_lang_480p_single_adapt_aaclc_sidx.mpd";
const avc = [];
video.oncanplay = video.play;
fetch(`${url}${mpd}`)
.then(response => response.text())
.then(text => {
const parser = new DOMParser();
const xml = parser.parseFromString(text, "application/xml");
const period = xml.documentElement;
const tracks = period.querySelectorAll("AdaptationSet");
for (let track of tracks) {
const representation = track.querySelector("Representation");
const {textContent:currentTrack} = representation.querySelector("BaseURL");
console.log(currentTrack);
// filter for specific track here, for example
// where "english" is included within `.textContent` of node
if (/english/i.test(currentTrack) || /avc/.test(currentTrack)) {
avc.push(`${url}${currentTrack}`);
}
}
Promise.all(avc.map(media => {
return new Promise(resolve => {
let v = document.createElement("video");
v.src = media;
v.volume = 0.5;
v.muted = true;
v.oncanplay =() => {
v.play();
resolve({
currentMedia:v
, stream:v.captureStream().clone().getTracks()[0]
})
}
})
}))
.then(tracks_ => {
for (let {stream, currentMedia} of tracks_) {
mediaStream.addTrack(stream);
currentMedia.muted = false;
}
video.srcObject = mediaStream;
})
})
<video controls></video>
@LearningC查看更新后的帖子 – guest271314
谢谢。据我了解,这显式设置音频文件链接作为视频标签的src。如果是这样的话,那就像实施一项赛道改变一样。但我不想这样做。我需要发起赛道更改事件。这对于所有DASH内容都是通用的。甚至可能是HLS。这似乎将音频文件设置为视频标签的src吧?如果是这样,那很好吗?因为音频和视频是mpd中的2个独立文件。 – LearningC
该方法捕获'.mpd'文件中列出的文件流,然后将每个流的MediaStreamTrack添加到单个'MediaStream'中,该MediaStream被设置在一个'
你所说的 “音轨变化” 呢?你在编码过程中提供了曲目的名字吗? – guest271314
@ guest271314我正在尝试播放http://dash.akamaized.net/dash264/TestCases/10a/1/iis_forest_short_poem_multi_lang_480p_single_adapt_aaclc_sidx.mpd。这个内容有多个音频朗支持。因此,在这里改变音频朗我在使用audioTracks [i]。启用 – LearningC
你可以解析'application/dash + xml''文档',看帖子 – guest271314