Chrome won't play Icecast streaming link

Question

So I have this code that opens my ''player'' that I made myself. But when player is opened no sound comes out, it never happened before. What could be the reason. When opened with Chrome no sound comes no matter how player is opened, whatever it would be pop up, or link pasted into url bar.Do you have any idea.?

You can check my player here: http://newfm.ddns.me:12/m.player.html

Html code for pop up:

 <html>
 <head>
 <style>
 <!--Image is used instead of text, to link page-->
   a {
   background: url(https://image.ibb.co/cxnuMU/playbutton.png) center no-    repeat;
display: block;

width: 44px;
height: 45px;
}

</style>
</head>
<!--Link to the page and size page should be opened in-->
<a href="#"     onClick="window.open('http://newfm.ddns.me:12/m.player.html','pagename','resizable,height=640,width=370'); return false;"></a>

The thing that sends sound in this player is that "play button". Could it be that I need to add SSL to my stream url?

Html code for play button :

<div class="ex1">

<a id="play-pause-button" class="fa fa-pause"></a>
<script       src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0/jquery.min.js"></script>

<script>
var audio = new Audio("http://newfmplayer.ddns.net:8000/newfm128.m3u");

$('#play-pause-button').on("click",function(){
if($(this).hasClass('fa-play'))
{
 $(this).removeClass('fa-play');
 $(this).addClass('fa-pause');
 audio.play();
}
else
{
 $(this).removeClass('fa-pause');
 $(this).addClass('fa-play');
 audio.pause();
 }
});

audio.onended = function() {
 $("#play-pause-button").removeClass('fa-pause');
 $("#play-pause-button").addClass('fa-play');
 };

 </script>


 <style media="screen" type="text/css">
 @import url(https://cdnjs.cloudflare.com/ajax/libs/font-     awesome/4.6.3/css/font-awesome.min.css);
 #play-pause-button{
 font-size: 50px;
 cursor: pointer;
 color: black;
 position: relative;
 left: 150px;
 top: 480px;
 }
 </style>


 </div>

</body></html>

I also tested just tested if it would work with simple code :

  <audio controls>
  <source src="http://newfmplayer.ddns.net:8000/newfm128.m3u"   type="audio/mpeg">
  </audio>

And it didn't work either.

score 1 · Answer 1 · edited Oct 14 '18 at 18:54

1

Your link points to the m3u playlist file. For an <audio> element to work you need to point to the stream directly, not to its playlist file.

In this case this means to drop the '.m3u' at the end.

edited Oct 14 '18 at 18:54

Mr Lister

45,515
15
108
150

answered Oct 13 '18 at 19:55

TBR

2,790
1
12
22

score 0 · Accepted Answer · answered Oct 17 '18 at 00:34

@TBR's answer is correct, but I wanted to elaborate a bit on it to explain.

Way back in the day, before HTML5 audio, before decent Flash-based players, there needed to be a way to click a link a browser and launch the audio player installed on the system. (Sure, there were plugins, but having to have a different plugin for every site was annoying! Plus, it wasn't desirable to leave your browser open while listening.)

An easy way to do this is to link to a playlist file. This is a very small file that essentially just contains the URLs to the actual streams. A typical M3U playlist looks like this:

#EXTM3U

#EXTINF:-1, Stream Title
http://example.com/stream

Traditionally, when links would point to this playlist file, they would open it immediately in the player registered to handle M3U playlists. From there, the player would parse the playlist and connect directly to the URL, http://example.com/stream in this case.

Today, we can load the audio streams directly in-browser with the <audio> tag. The browser's <audio> tag doesn't use playlist files though. It needs the stream URLs as-is.

In your example, the URL for the actual stream is http://newfmplayer.ddns.net:8000/newfm128.

In your own self-answer, you're trying to add fake extensions and such. These are not necessary. You shouldn't use them. Anyone who told you to use them was just trying to hack around some broken player software... and poorly.

Chrome won't play Icecast streaming link

2 Answers2