• How to play video using the HTML5 video tag

    Wowza Streaming Engine™ media server software supports delivery of on-demand and live content using HTML5 video and Apple HLS. This article contains instructions for HTML5 playback using the <video> HTML tag in your webpage.

    If you haven't done so already, use Wowza Streaming Engine Manager to set up the default live application to stream HLS video by following one of our live streaming tutorials. You can also use the vod application that's included with Wowza Streaming Engine and installed and configured as part of the Wowza media server installation.

    To test HTML5 video playback, insert one of the code examples below into an HTML webpage and use the HLS stream URL of your live or on demand stream in the <video> tag.

    HTML5 live streaming


    <html>
      <head> 
        <title>HTML5 Live Streaming Test</title> 
      </head> 
      <body> 
        <video width="640" height="400" controls="controls" src="http://[wowza-ip-address]:1935/live/myStream/playlist.m3u8">
        </video> 
      </body> 
    </html>

    HTML5 on demand streaming


    <html>
      <head> 
        <title>HTML5 VOD Streaming Test</title> 
      </head> 
      <body> 
        <video width="640" height="400" controls="controls" src="http://[wowza-ip-address]:1935/vod/mp4:sample.mp4/playlist.m3u8">
        </video> 
      </body> 
    </html>
    Note: HTML5 video playback from Wowza Streaming Engine is supported on Safari for iOS and OS X. Playback is possible, but unreliable, on other browsers and on newer versions of Android (4.2 or later). Your results may vary.

    HTML5 and media extensions

    Using HTML5 video alone has many limitations; however, the addition of the Media Source Extensions (MSE) and Encrypted Media Extensions (EME) specifications adds the benefits of adaptive streaming and playback of protected content, respectively.

    MSE support allows JavaScript to generate streams for media playback using HTML media tags so you can play live or on-demand streams with HTML5. This means browser-independent player technology can be built without the use of plug-in technologies such as Silverlight or Flash, enabling playback features such as adaptive bitrate (ABR), time shifting, ad-insertion, video editing, and multiple audio tracks. Videos are encoded once and then play consistently across modern browsers and most tablets and smartphones.

    Browsers that support HTML5/MSE


    All major browsers support H.264 video and AAC or MP3 audio while some browsers also support other codecs.

    MSE Support Video codecs Audio codecs
    Safari Safari 8 for Mac H.264 AAC, MP3
    Chrome Chrome version 34 and later, on both desktop and Android H.264, VP8, VP9 AAC, MP3, Vorbis, Opus
    Internet Explorer (IE) IE version 11 on Windows 8 and later, on both desktop and Windows phone H.264 AAC, MP3
    Firefox Firefox 37 and later (YouTube only, full support unavailable) H.264, VP8, VP9 AAC, MP3, Vorbis, Opus

    Current versions of the Safari, Chrome, Internet Explorer, and Firefox browsers also support the Encrypted Media Extensions (EME) specifications.

    HTML5/MSE-based players


    The following players stream HTML5 video from Wowza Streaming Engine:


    Additional resources



    Originally Published: For Wowza Streaming Engine on 09-04-2015.

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