How to abort downloading an audio stream via javascript


#1

I want to stop/abort audio instead of pause, how would this be done?

And can this be done?

Is this the answer?
https://jsfiddle.net/bwa3os2v/323/

Adding this line in, does that do it?

player.src = player.src;


  function playAudio(player, src) {
    player.volume = 1.0;
    player.src = player.src;
    if (player.getAttribute("src") !== src) {
      player.setAttribute("src", src);
    }
    player.play();
  }

#2

Nope, that doesn’t abort an audio stream. From all I’ve seen, it can only be aborted by reloading the page.


#3

That does indeed stop and abort loading the audio, but also immediately starts loading it anew (similar to player.load()). To stop loading it altogether you have to remove the source, like

player.src = ''

… but then you have to use additional scripting to be able to start it again.

PS: Looking at your edited post I just noticed you want to play() it again anyway… so why stop loading the source in the first place?


#4

What about adding this line in?
Does this do it?
player.currentTime = 0;

https://jsfiddle.net/bwa3os2v/327/

  function playAudio(player, src) {
    player.volume = 1.0;
    player.currentTime = 0;
    if (player.getAttribute("src") !== src) {
      player.setAttribute("src", src);
    }
    player.play();
  }

#5

I’m doing something else with it that doesn’t require it to start again.

It wouldn’t be intended to play again.


#6

Really, I didn’t know that.

About that it can only be aborted by reloading the page.


#7

I think this is the official way of stopping though.

player.currentTime = 0;

not this:
player.src = player.src;

https://jsfiddle.net/bwa3os2v/327/


#8

You still have to pause() it first though or it will just play from the beginning (if already playing).


#9

You mean that plus this:

    }
    player.pause();
  }

#10

I have a question.

If I had the code set up in a way that the audio javascript got removed, and then was replaced with another piece of javascript, would the downloading stop from the previous javascript code that is no longer active and has since been terminated?


#11

I’ve just tried that, and the original one still keeps on streaming even though it has nowhere to play.


#12

Maybe as I work on the code it’ll be able to be figured out more easily.


#13

What if the stream was inside the javascript instead of in the html, would that make a difference at all? or maybe it might be able to be terminated more easily.

player.setAttribute("src", "http://hi5.1980s.fm/;");


#14

Can you tell me if this works, if it does I can put these values into the other one.
It might not be good to set it up like that though, using all those values.
https://jsfiddle.net/yLn1ekw0/3/

<button onclick='play()'>Play</button>
<button onclick='pause()'>Pause</button>

<script>
  var url = 'http://46.105.118.14:15500/;';
  var stream = new Audio(url);
  stream.preload = 'none';

  function play() {
    stream.play();
  }

  function pause() {
    stream.pause();
    stream.src = ''
    stream.load();

    stream = null;

    stream = new Audio();
    stream.src = url;
    stream.preload = 'none';
  }

</script>

I added in those property values in the other player:
I think it’s crazy to put all that stuff in there though.
Maybe I wouldn’t need every single one of them,
maybe 1 or a couple is all that’s needed. Unless none
of them do the trick.
https://jsfiddle.net/zcw6tjv9/6/

 function pauseAudio(player) {
    player.src = ''
    player.load();
    player = null;
    player = new Audio();
    player.src = url;
    player.preload = 'none';
    player.pause();
  }

I just found this, not sure if it would work though:

var sourceElement = document.querySelector("source");
var originalSourceUrl = sourceElement.getAttribute("src");
var audioElement = document.querySelector("audio");

function pause() {
    sourceElement.setAttribute("src", "");
    audioElement.pause();
    // settimeout, otherwise pause event is not raised normally
    setTimeout(function () { 
        audioElement.load(); // This stops the stream from downloading
    });
}

function play() {
    if (!sourceElement.getAttribute("src")) {
        sourceElement.setAttribute("src", originalSourceUrl);
        audioElement.load(); // This restarts the stream download
    }
    audioElement.play();
}

I tried to set that one up here:
but not sure what would go in the source element spots.
https://jsfiddle.net/bwa3os2v/343/

  function playAudio(player, src) {
    player.volume = 1.0;
    if (!sourceElement.getAttribute("src")) {
      sourceElement.setAttribute("src", "http://46.105.118.14:15500/;");
      player.load(); // This restarts the stream download
    }
    player.play();
  }


  function pauseAudio(player) {
    sourceElement.setAttribute("src", "");
    player.pause();
    // settimeout, otherwise pause event is not raised normally
    setTimeout(function() {
      player.load(); // This stops the stream from downloading
    });
  }

Got it working here:
https://jsfiddle.net/bwa3os2v/345/

I may have did it wrong because I didn’t add this in cause I couldn’t get it working with it in.
https://jsfiddle.net/bwa3os2v/347/

var sourceElement = document.querySelector("source");
var originalSourceUrl = sourceElement.getAttribute("src");
var audioElement = document.querySelector("audio");

I put this:

var player = document.querySelector("source");
var "http://46.105.118.14:15500/;" = sourceElement.getAttribute("src");
var player = document.querySelector("audio");