Reproducir m3u8

happyday · #1 (**permalink**) 23/04/2015, 10:28

Buenos días amigos.

Me ¿pueden ayudar como hago para poner canales de tv en mi página web?
La dirección de uno de los canales son como estos:
http://200.76.77.237/LIVE/H01/CANAL351/PROFILE03.m3u8

No los e podido reproducir con jwplayer 6 pro, Grind player y entre otros, pero al poner el codigo de media player en la web si los reproduce, pero no carga con el sonido.

Muchas gracias.

NueveReinas · #2 (**permalink**) 23/04/2015, 12:36

Yo no veo nada. De todas formas, ¿has probado con un iframe?

PHPeros · #3 (**permalink**) 23/04/2015, 13:01

No sé si en HTML5 hay algo efectivo para reproducir videos en streaming.

happyday · #4 (**permalink**) 23/04/2015, 13:16

Muchas gracias NueveReinas por respónder. Esa dirección solo se reproduce con los reprodutores de VLC y media player classic.

a la hora de poner iframe me sale este contenido cuándo ingreso a la página:

#EXTM3U
#EXT-X-VERSION:3
#EXT-X-TARGETDURATION:5
#EXT-X-MEDIA-SEQUENCE:203840
#EXTINF:4.004,
PROFILE03-101/1840-20150423T141616.ts
#EXTINF:4.004,
PROFILE03-101/1841-20150423T141620.ts
#EXTINF:4.004,
PROFILE03-101/1842-20150423T141624.ts
#EXTINF:4.004,
PROFILE03-101/1843-20150423T141628.ts
#EXTINF:4.004,
PROFILE03-101/1844-20150423T141632.ts
#EXTINF:4.004,
PROFILE03-101/1845-20150423T141636.ts
#EXTINF:4.004,
PROFILE03-101/1846-20150423T141640.ts
#EXTINF:4.004,
PROFILE03-101/1847-20150423T141644.ts
#EXTINF:4.004,
PROFILE03-101/1848-20150423T141648.ts
#EXTINF:4.004,
PROFILE03-101/1849-20150423T141652.ts
#EXTINF:4.004,

happyday · #5 (**permalink**) 23/04/2015, 13:20

Cita:

Iniciado por PHPeros

No sé si en HTML5 hay algo efectivo para reproducir videos en streaming.

Hola PHPeros.

Me he dedicado por horas en buscar reprodutores para html5, y en ninguno me a servido para reproducir esas direcciones, lo raro hay una página que es esta: http://tutvgratis.tv/

Le gradadesco su ayuda.

GeniosWeb · #6 (**permalink**) 23/04/2015, 21:08

Pregunta, tu servidor soporta streaming?

happyday · #7 (**permalink**) 23/04/2015, 21:11

Hola GeniosWeb.

El servicio donde estoy alojado es en 3ix.com:
http://www.3ix.org/one_dollar_web_hosting.php

En las especificaciones no me dice nada si solo soporta.

GeniosWeb · #8 (**permalink**) 24/04/2015, 00:42

Bueno, deberías preguntarles a ellos, pero ese debe ser el problema. Los servidores comunes no suelen permitir streaming, podes reproducir videos, pero no streaming.

Una cosa es poner un video .mp4 o .avi, que se muestra como un video dentro de la página web pero primero se descarga completamente a la computadora y otra cosa es cargar un reproductor en el navegador que esté continuamente conectado con el servidor descargando paquetes de datos uno tras otro y uniendolos en el navegador para reproducirlo como un video continuo. Asique primero tendrías que averiguar sobre el servidor y despues ver bien que es lo que querés hacer. Saludos

franciscomarin · #9 (**permalink**) 24/04/2015, 05:32

A ver, una cosa es que la página del HOSTING de la web soporte streaming y otra distinta es donde apunta ese archivo.

Si ese archivo lo único que enlazar es al servidor del STREAMING no hay ningún problema con que ese archivo esté alojado en el hosting. Lo único que se hace es descargar ese archivo y crear "una conexión" con el cliente y el servidor de streaming, pero es una conexión directa, el servidor del hosting ya no pinta nada aquí.

happyday · #10 (**permalink**) 24/04/2015, 06:26

Hola franciscomarin

Este es el código de una de las opciones que estoy usando:

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>HTML5 MediaElement - HLS</title>

<script src="../build/jquery.js"></script>
<script src="../build/mediaelement-and-player.min.js"></script>
<script src="testforfiles.js"></script>
<link rel="stylesheet" href="../build/mediaelementplayer.min.css" />
</head>
<body>

<h1>MediaElementPlayer.js</h1>

<h2>HLS Wrapper</h2>

<code><pre>
<video width="640" height="360" id="player1" preload="none">


<source type="application/x-mpegURL" src="http://200.76.77.237/LIVE/H01/CANAL435/PROFILE03.m3u8" />

</video>
</pre></code>

<video width="640" height="360" id="player1">


<source type="application/x-mpegURL" src="http://200.76.77.237/LIVE/H01/CANAL435/PROFILE03.m3u8" />

</video>

<span id="player1-mode"></span>

<h3> Test Videos </h3>
<div> The following videos should stream correctly. Each time an
issue is reported with a sample playlist, it will be added in the list
and verified after bugfixing </div>
<ul id="streamlist">
</ul>

Check with your own Playlist ! <a href="http://kb2.adobe.com/cps/142/tn_14213.html">beware of Cross Domain Policy</a><br>
<input id="userInput" value="http://200.76.77.237/LIVE/H01/CANAL435/PROFILE03.m3u8?" size="80"> <button onclick="userSubmit()">Load and Play</button><br>
<p>

<script type="text/javascript" src="hls_streams.js"></script>
<script type="text/javascript">

function listStreams(list, container) {
for(var i=0; i<list.length; i++) { var entry = document.createElement("li");
entry.innerHTML = "<a href='#' onclick='return loadStream(\""+list[i].file+"\")'>"+list[i].title+"</a>";
document.getElementById(container).appendChild(ent ry);
}
}
listStreams(teststreams, "streamlist");

function userSubmit() {
loadStream(document.getElementById('userInput').va lue);
}
function loadStream(url) {
$('video')[0].player.setSrc(url);
$('video')[0].player.play();
}

</script>

<script>

$('video').mediaelementplayer({
success: function(media, node, player) {
$('#' + node.id + '-mode').html('mode: ' + media.pluginType);
}
});

</script>

</body>
</html>

Tengo con sus archivos y lo mismo con jwplayer 6 pro, video-js, flowplayer y GrindPlayer y nada de nada.

Saludos.

happyday · #11 (**permalink**) 24/04/2015, 06:33

franciscomarin.

Se me olvidaba decirle que con el codigo de fuente de windows media classics si los reproduce, pero el problema es que el sonido se va y dura en restablecerse:

<OBJECT id="VIDEO" width="400" height="370" CLASSID="CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6" type="application/x-oleobject">
<PARAM NAME="URL" VALUE="http://200.76.77.237/LIVE/H01/CANAL444/PROFILE03.m3u8?">
<PARAM NAME="SendPlayStateChangeEvents" VALUE="True">
<PARAM NAME="AutoStart" VALUE="True">
<PARAM NAME="stretchToFit" VALUE="True">
<PARAM name="uiMode" value="full">
<PARAM name="PlayCount" value="1">
<PARAM NAME="AutoRewind" VALUE="0">
<embed type="application/x-mplayer2" pluginspage="http://www.microsoft.com/Windows/MediaPlayer/" name="mediaplayer1" autostart="true" width="400" height="370" transparentstart="1" SHOWSTATUSBAR="1" loop="0" controller="true" src="http://200.76.77.237/LIVE/H01/CANAL444/PROFILE03.m3u8?" stretchToFit="true" ></embed>
</OBJECT>