如何在DASH內容的<video>標記中啓用音軌更改？

Question

我已經在網頁中使用<video>標籤嵌入了DASH視頻。這個內容有多個音軌。我想支持音軌更改。
我用audioTracks[i].enable功能來選擇音軌。但音軌並沒有改變。

if (selected == i) { 
    audioTracks[i].enable = TRUE; 
} 

1. 這是正確的方式？
2. 有沒有其他方法可以改變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是唯一的方法（據我所知，迄今爲止）？

Answer 1

Audio Track API尚未完全實現跨瀏覽器。見caniuse for Audio Track。您的問題很可能是您使用Chrome或Firefox進行測試。

Chrome has implemented it但尚未宣佈何時將着陸。
它在Firefox 33中實現，但默認情況下未啓用，必須通過用戶首選項進行切換。 Gecko似乎也有一些問題無法執行多軌回放，這就是爲什麼此功能已被禁用了很長時間（Firefox在編寫本文時爲57版本）。

Answer 2

，您可以要求使用fetch()或XMLHttpRequest()的.mpd文件，使用.text()或.responseText閱讀application/dash+xml響應爲文本，該文本傳遞給DOMParser()實例.parseFromString()創建#document，迭代document.documentElementPeriod元素的​​子節點，使用.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>