複数のストリームを使用したWebオーディオ

Question

RESTfulベースのWebサービス経由でオーディオをストリーミングしようとしています。私のオーディオファイルには、2つの異なるAAC 228 Kbpsステレオトラックが含まれています。 1つは英語で、もう1つはスペイン語です。

私のGETリクエストは、オーディオファイルに問題はありません。ただし、ファイルの最初のソース（この場合はスペイン語）がデフォルトになります。

最終的には、ブラウザを使用して必要に応じてオーディオソースを切り替えることができるようにしたいと思います。私はすでに、ほとんどのブラウザが現在HTML5を通じて利用可能なaudioTracks APIをサポートしていないことを認識しており、私はエンドユーザをIEまたはEdgeに制限したくないと思っています。

これは、ウェブオーディオAPIを使用して手動でストリームを試して操作することになります。

私の現在のHTMLをテストするための単なる再生ボタンです。これは、最初のオーディオストリーミングのために働く

var context; 

window.addEventListener('load', init, false); 
function init() { 
    try { 
     // Fix up for prefixing 
     window.AudioContext = window.AudioContext||window.webkitAudioContext; 
     context = new AudioContext(); 
    } 
    catch(e) { 
     alert('Web Audio API is not supported in this browser'); 
    } 
} 

var onError = function() { 
    $log.info("ERROR"); 
} 

$scope.audioActions = function() { 
    var request = new XMLHttpRequest(); 
    request.open('GET', 'http://localhost...', true); 
    request.responseType = 'arraybuffer'; 

    // Decode asynchronously 
    request.onload = function() { 
     context.decodeAudioData(request.response, function(buffer) { 
      $log.info(buffer) 

      var source = context.createBufferSource(); 
      source.buffer = buffer; 
      source.connect(context.destination); 
      source.start(0); 
     }, onError); 
    } 

    request.send(); 
}; 

を、私は<audio>タグを使用した場合と同じように動作します：次のように

<md-button class="md-raised" ng-click="audioActions()">Audio options</md-button> 

私の現在の.jsです。

バッファ内のオーディオストリームを切り替える方法はありますか？

以下は私のファイルに-i ffmpegのからダンプされています：

[mov,mp4,m4a,3gp,3g2,mj2 @ 0000000000ea6920] stream 0, timescale not set 
Input #0, mov,mp4,m4a,3gp,3g2,mj2, from 'E:\ServerFiles\tmp\audioExample.m4a': 
    Metadata: 
    major_brand  : M4A 
    minor_version : 0 
    compatible_brands: M4A mp42isom 
    creation_time : 1982-08-11T07:52:37.000000Z 
    title   : Test 
    artist   : Audio Example 
    album_artist : Audio Example 
    album   : Example 
    genre   : Test 
    track   : 1/20 
    disc   : 1/1 
    compilation  : 0 
    gapless_playback: 0 
    date   : 2017-08-16T08:00:00Z 
    account_id  : 
    rating   : 0 
    account_type : 0 
    season_number : 0 
    episode_sort : 0 
    media_type  : 1 
    purchase_date : 2017-08-16 15:59:27 
    sort_album  : Audio Example 
    composer  : Example 
    Duration: 00:02:59.00, start: 0.000000, bitrate: 160 kb/s 
    Stream #0:0: Audio: aac (HE-AAC), 48000 Hz, stereo, fltp (default) 
    Stream #0:1: Audio: aac (HE-AAC), 48000 Hz, stereo, fltp 

Answer 1

あなたは、現時点では求めているものを行うための最も簡単な方法は、MediaSourceの拡張機能を使用することです。 https://developer.mozilla.org/en-US/docs/Web/API/MediaSource

基本的に、データをバッファして、ブラウザにチャンクをデコードさせます。他の何かに切り替えるには、他のストリームからチャンクをデコードするだけです。

あり、より良い例はここにある：今https://developers.google.com/web/fundamentals/media/mse/basics