• How to do pre-roll and playlist for iOS (a client-side work-around)

    Below is a client-side (browser-based) solution for pre-roll and playlists for iOS devices. This works for VOD to live, or VOD to VOD. (It did not work in my test for live to VOD.) Switching from one video or stream to another with different audio encoding will not work. The transitions are not seamless, there is a couple moments of load time.

    VOD pre-roll for live stream
    <html>
    <head>
    <title>Pre-roll</title>
    <script>
    function end(e)
    {
    var video = document.getElementById("video1");
    video.src = "http://[wowza-address]:1935/live/myStream/playlist.m3u8&quot;
    video.load();
    video.play();
    }
    </script>
    </head>
    <body>
    <video src="http://[wowza-address]:1935/vod/sample.mp4/playlist.m3u8" controls onended="end(event)" id="video1">
    </video>
    </body>
    </html>
    VOD Playlist
    <html>
    <head> 
      <title>Playlist</title>
    <script>
    var videos="sample2.mp4,sample3.mp4".split(",");
    next=-1;
    
    function end(e)
    {
    var video = document.getElementById("video1");
    
    if (++next==videos.length)
    	return;
    
    video.src = "http://192.168.1.7:1935/vod/"+videos[next]+"/playlist.m3u8";
    video.load();
    video.play();
    }
    </script>
    </head>
    
    <body>
    <video src="http://192.168.1.7:1935/vod/sample.mp4/playlist.m3u8" controls onended="end(event)" id="video1">
    </video>
    
    </body>
    </html>


    If you're having problems or want to discuss this article, post in our forum.