CODEWITHSUNDEEP
javascripthtmlazurevideo-streamingmpeg-dash
user2986042
user2986042

Reputation: 1270

MPEG-DASH Adaptive Streaming with HTML5 is not working in windows Chrome/Mozilla

I am completely new in MPEG-DASH Adaptive Streaming . I am trying to create a Video player with dash.js in browser . I have referenced some of the useful MPEG-DASH Adaptive Streaming documents . Those links are

With the above documents , i have created a sample HTML file .

<!DOCTYPE html>
<html>
<head>
    <title>Adaptive Streaming in HTML5</title>
    <style>
        video {
        width: 640px;
        height: 360px;
        }
    </style>
</head>
<body>
    <div>
        <h1>Adaptive Streaming with HTML5</h1>
        <video id="videoplayer" controls></video>
    <div>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>    
    <!-- DASH-AVC/265 reference implementation -->
    <script src="https://cdn.dashjs.org/latest/dash.all.min.js"></script>
    <script>
    <!--setup the video element and attach it to the Dash player-->
            (function(){
                var url = "https://dash.akamaized.net/envivio/EnvivioDash3/manifest.mpd";
                var player = dashjs.MediaPlayer().create();
                player.initialize(document.querySelector("#videoPlayer"), url, true);
            })();
    </script>
</body>
</html>

But after running on chrome (Version 63.0.3239.132 (Official Build) (64-bit)) and mozilla (version 57.0 (64-bit)) , I couldn't see any video playing in this player . This is the output screenshot

enter image description here

I am trying to run locally on my browser . Will it make any problem ? After clicking play button , i couldn't see any video on that . In Mozilla browser i can see following

[dash.js 2.6.4] MediaPlayer has been initialized

The character encoding of the HTML document was not declared. 
The document will render with garbled text in some browser configurations if the document contains characters from outside the US-ASCII range. 
The character encoding of the page must be declared in the document or in the transfer protocol.

But the script https://cdn.dashjs.org/latest/dash.all.min.js is working fine too . Also when i add https://dash.akamaized.net/envivio/EnvivioDash3/manifest.mpd URL in https://reference.dashif.org/dash.js/1.4.0/samples/dash-if-reference-player/index.html video player , it is working fine .

Actually what is i am missing here ? Any suggestions or help ?

Upvotes: 4

Views: 7197

Answers (2)

Perry
Perry

Reputation: 312

HLS is automatically supported by HTML5, but MPEG-DASH is not. This means that some browsers or apps cannot play MPEG-DASH video streams, even on non-Apple devices.

Read HLS vs Dash in this link

Upvotes: 1

Aaron Chen
Aaron Chen

Reputation: 9950

Attribute values are case-sensitive in HTML documents.

So, this would work if you change the <video> element to:

<video id="videoPlayer" controls></video>

Upvotes: 6

Related Questions