-1

estoy tratando de crear una aplicación web para reproducir mi contenido .M3U8 en Streaming, pero no encuentro la forma de reproducirlo. Si utilizo HTML5 y vídeo, solamente me deja cargar .MP4 pero no reproduce mi streaming .M3U8 como lo pueden hacer o . La cuestión está en si se conoce algún servicio gratuito que me permita lograr mis objetivos.

1 respuesta 1

1

El tag video de HTML debería de funcionar con m3u8 si no hay bloqueo de CORS y cosas del streaming. Sin embargo sé que puede ocasionar problemas en ocasiones específicas.

Acá te comparto un par de reproductores que uso personalmente, cada uno con sus propias virtudes.

1. Clappr - Web Oficial

Para mi, este es el mejor y más completo reproductor por todas las opciones y plugins que te deja agregar y utilizar a tu gusto.

2. JW Player - Web Oficial

JW es muy bonito estéticamente, pero también funcional, no tiene nada que envidiarle a Clappr. No estoy muy seguro, pero creo que también posee PLugins y demás funcionalidades (como skins) para personalizarlo.

Te adjunto ejemplos funcionales de esos dos reproductores

Ejemplo - Codepen Clappr

<head>
  <script type="text/javascript"
      src="https://cdn.jsdelivr.net/npm/clappr@latest/dist/clappr.min.js">
  </script>
</head>
<body>
  <div id="player"></div>
  <script>
    var player = new Clappr.Player({source: "https://5b50404ec5e4c.streamlock.net/8030/8030/chunklist.m3u8", parentId: "#player"});
  </script>
</body>

Ejemplo - Codepen JW Player

<head>
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" crossorigin="anonymous">
</head>
<body>
  <script src="https://jwpsrv.com/library/FfMxTl3oEeSEiiIACxmInQ.js"></script>   
       <div id="aRzklaXf">Loading the player...</div>
       <script type="text/javascript">
       var playerInstance = jwplayer("aRzklaXf");
       playerInstance.setup({
        "file": "https://5b50404ec5e4c.streamlock.net/8030/8030/chunklist.m3u8",
        "height":"560",
        "width":"50%",
        stretching: "bestfit",
        "image": "#",
        "mediaid": "player",
        "mute": false,
        "autostart": false,
            "cast": {
                "appid": "player",
                "logo": "https://i.ibb.co/Tgk2YrC/Logo.png",
            },
       });
    </script>
    <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-ho+j7jyWK8fNQe+A12Hb8AhRq26LrZ/JpcUGGOn+Y7RsweNrtN/tE3MoK7ZeZDyx" crossorigin="anonymous"></script>
</body>

Aidicionalmente, y como todo mundo podría dar fé, la palabra de una sola persona no es ley, es decir, para mi los anteriores pueden ser los mejores reproductores, pero para alguien más pueden ser los peores.

Hay un par de opciones más como:

Flowplayer - Web Oficial

Bitmovin Player - Web Oficial

DASH Js Player - Web Oficial

HLS JS Player - Web Oficial

Espero que mi respuesta sea de ayuda, si tienes dudas adicionales, estaré encantado de ayudar.

4
  • Se te agradece el aporte pero he de comentarte que las preguntas basadas en opiniones o recomendaciones terminan cerrada pues no se ajustan al formato del sitio
    – BetaM
    el 30 oct. 2020 a las 18:47
  • Hola @BetaM soy nuevo en el sitio, sin embargo la pregunta tiene algún tiempo de estar publicada, por eso me decidí a responder. Gracias por la aclaración el 30 oct. 2020 a las 18:48
  • Te comento que así pueden quedar en tanto son votadas para terminar cerradas por lo que ya te comenté
    – BetaM
    el 30 oct. 2020 a las 18:49
  • Comprendo, muchas gracias por hacérmelo saber. el 30 oct. 2020 a las 18:50

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.