Web Audio API reprise à partir de la pause

Oskar réponse et ayke commentaire sont très utiles, mais j'ai été absent un exemple de code. J'ai donc écrit un: http://jsfiddle.net/v3syS/2/ j'espère que cela aide.

var url = 'http://thelab.thingsinjars.com/web-audio-tutorial/hello.mp3';

var ctx = new webkitAudioContext();
var buffer;
var sourceNode;

var startedAt;
var pausedAt;
var paused;

function load(url) {
    var request = new XMLHttpRequest();
    request.open('GET', url, true);
    request.responseType = 'arraybuffer';
    request.onload = function() {
        ctx.decodeAudioData(request.response, onBufferLoad, onBufferError);
    };
    request.send();
};

function play() {
    sourceNode = ctx.createBufferSource();
    sourceNode.connect(ctx.destination);
    sourceNode.buffer = buffer;
    paused = false;

    if (pausedAt) {
        startedAt = Date.now() - pausedAt;
        sourceNode.start(0, pausedAt / 1000);
    }
    else {
        startedAt = Date.now();
        sourceNode.start(0);
    }
};

function stop() {
    sourceNode.stop(0);
    pausedAt = Date.now() - startedAt;
    paused = true;
};

function onBufferLoad(b) {
    buffer = b;
    play();
};

function onBufferError(e) {
    console.log('onBufferError', e);
};

document.getElementById("toggle").onclick = function() {
    if (paused) play();
    else stop();
};

load(url);

OriginalL'auteur imbrizi

L'absence d'un haut-pause fonctionnalité dans le WebAudio API semble comme une erreur majeure pour moi. Peut-être, dans l'avenir, il sera possible de le faire à l'aide de l'prévues MediaElementSource, ce qui vous permettra de brancher un élément (prise en charge de pause) de Web Audio. Pour l'instant, la plupart des solutions de contournement semblent être fondées sur la mémorisation de temps de lecture (tel que décrit dans le imbrizi de réponse). Une telle solution a des problèmes lors de la boucle des sons (la mise en oeuvre de la boucle instantanés ou pas?), et quand vous vous permettent de modifier dynamiquement le playbackRate de sons (comme la fois une incidence sur le timing). Une autre, tout aussi hack-ish et techniquement incorrect, mais beaucoup plus simple solution de contournement, vous pouvez utiliser est:

source.playbackRate = paused?0.0000001:1;

Malheureusement, 0 n'est pas une valeur valide pour playbackRate (qui serait en fait la pause le son). Toutefois, pour de nombreuses raisons pratiques, certains de très faible valeur, comme 0.000001, est assez proche, et qu'il ne produira aucun son audible.

OriginalL'auteur jonas echterhoff

En 2017, à l'aide de ctx.currentTime fonctionne bien pour garder la trace du point dans la chanson. Le code ci-dessous utilise un bouton (songStartPause) qui permet de basculer entre un play & bouton pause. J'ai utilisé des variables globales pour des raisons de simplicité. La variable musicStartPoint assure le suivi de ce moment, vous êtes dans la chanson. La musique de l'api permet de suivre de temps en secondes.

Définir votre initiale musicStartPoint à 0 (début de la chanson)

var ctx = new webkitAudioContext();
var buff, src;
var musicLoaded = false;
var musicStartPoint = 0;
var songOnTime, songEndTime;
var songOn = false;

songStartPause.onclick = function() {

  if(!songOn) {
    if(!musicLoaded) {
      loadAndPlay();
      musicLoaded = true;
    } else {
      play();
    }

    songOn = true;
    songStartPause.innerHTML = "||"  //a fancy Pause symbol

  } else {
    songOn = false;
    src.stop();
    setPausePoint();
    songStartPause.innerHTML = ">"  //a fancy Play symbol
  }
}

Utilisation du ctx.currentTime pour soustraire le temps de la fin de la chanson à partir de quand ça a commencé, et l'ajout de ce laps de temps si loin que vous étiez dans la chanson initialement.

function setPausePoint() {
  songEndTime = ctx.currentTime;
  musicStartPoint += (songEndTime - songOnTime);
}

De chargement/fonctions de lecture.

function loadAndPlay() {
  var req = new XMLHttpRequest();
  req.open("GET", "//mymusic.com/unity.mp3")
  req.responseType = "arraybuffer";
  req.onload = function() {
    ctx.decodeAudioData(req.response, function(buffer) {
      buff = buffer;
      play();
    })
  }
  req.send();
}

function createBuffer() {
      src = ctx.createBufferSource();
      src.buffer = buff;
    }


function connectNodes() {  
  src.connect(ctx.destination); 
}

Enfin, la fonction de lecture dit la chanson de commencer à l'musicStartPoint (et à jouer immédiatement), et définit également la songOnTime variable.

function play(){
  createBuffer() 
  connectNodes();
  songOnTime = ctx.currentTime;
  src.start(0, musicStartPoint);
}

*Note: je sais, ça peut paraître un nettoyant pour le jeu de songOnTime dans la fonction de clic, mais je suppose que cela a du sens pour saisir le code de temps aussi proche que possible de la src.démarrer, juste comme la façon dont nous prenons le temps de pause aussi proche que possible de la src.stop.

OriginalL'auteur user3597313

Pour chrome fixer, chaque fois que vous voulez jouer du son, de la définir comme:

if(audioCtx.state === 'suspended') {
    audioCtx.resume().then(function() {
      audio.play();
   });  
}else{
     audio.play();
}

OriginalL'auteur Pan Bouradas