Why do I need Dash.js to stream MPEG DASH video?

Question

I am new to html 5 adaptive streaming and information, there are quite contradictory ones there. I want to create a test environment on my Windows server, a cloud streaming 2 hours h264 file and play on my local computer with an html5 player.

Question: Why do I need Dash.js to play Mpeg dash video? Is Dash.js something I have to install on the server (seems obvious) or the client (sounds weird)?

Answer 1

DASH video, like any other video, includes two parts: the feed serves for videos, and the player uses them and presents them to the user. I will explain what is needed on both sides.

DASH Video Service

Pieces of DASH video can be delivered via HTTP or HTTPS by any modern web server - Apache, ngnix, IIS and others. On the server side, there is no need for a plug-in or additional software for servicing DASH videos - these are just files, and every web server knows how to serve files. You may need to do some configuration.

Most web servers have a list of the types of MIME files that they are allowed to serve - you usually need to add DASH videos to this list, since the default settings tend to be restrictive for security reasons and do not allow DASH videos to be streamed.

Here is an example web.config for IIS that allows you to serve DASH video:

<?xml version="1.0" encoding="UTF-8"?> <configuration> <system.webServer> <staticContent> <remove fileExtension=".m4s" /> <mimeMap fileExtension=".m4s" mimeType="video/mp4" /> <remove fileExtension=".mpd" /> <mimeMap fileExtension=".mpd" mimeType="application/dash+xml" /> <remove fileExtension=".m4f" /> <mimeMap fileExtension=".m4f" mimeType="video/mp4" /> <remove fileExtension=".m4a" /> <mimeMap fileExtension=".m4a" mimeType="video/mp4" /> </staticContent> </system.webServer> </configuration> 

Different elements of video/mp4 exist, since different DASH encoders name their files differently.

Some DASH players, especially web servers, may also require the server to support resource sharing (CORS) . This is a security mechanism that helps prevent the launch of malicious websites by letting you choose which sites your content can appear on. The exact CORS headers your server must provide are also player-specific. In some situations, additional headers are used and should be explicitly included. I will leave CORS details out of the scope of this answer. Here is a simple IIS configuration example that allows any website to consume submitted videos:

 <?xml version="1.0" encoding="UTF-8"?> <configuration> <system.webServer> <httpProtocol> <customHeaders> <add name="Access-Control-Allow-Origin" value="*" /> </customHeaders> </httpProtocol> </system.webServer> </configuration> 

Play DASH Video

You need a player, obviously. There are various types of players: standalone desktop applications (e.g. VLC), SDKs for players for Android / iOS applications (e.g. ExoPlayer and Microsoft PlayReady Client SDK) and players for websites (e.g. dash.js and Bitdash). In Windows 10, Internet Explorer will even enable the built-in player for DASH videos.

Here is dash.js - this is the player. You post it on your website if you want your site to play video. Other players are available.

Depending on how you want to offer content to the end user, you select a player and, if not a separate player, insert it into your application or website. You provide the url to the player and he will do his job. Plain.

Players on websites require the server to support CORS, but standalone applications or applications hosted on the site do not need it.

Answer 2

Why do you need dash.js to stream MPEG-DASH video

You need this because web browsers do not support DASH, as they are not required to do this. However, web browsers must support Media Source Extensions (MSE). For (newer) versions of browsers that implement MSE, their basic supported media sources, such as MP4, can be supplemented with DASH simply by including Javascript libraries such as dash.js. This is much more flexible (and in the future) than the previous procedure, requiring users to install plug-ins, such as Flash Player, to play non-core media types.

Client side configuration

You also asked if there is dash.js that needs to be installed on the server side or on the client side. Sander wrote about any server-side configuration that might be required for file maintenance, so I’ll add an explanation of how to implement it on the client side.

From the dash.js GitHub Page :

 <script src="http://cdn.dashjs.org/latest/dash.all.min.js"></script> ... <style> video { width: 640px; height: 360px; } </style> ... <body> <div> <video data-dashjs-player autoplay src="http://dash.edgesuite.net/envivio/EnvivioDash3/manifest.mpd" controls></video> </div> </body> 

Please note that if you also want to use Clear Key encryption, you will need to process the video file and dash.all.min.js from a secure context (for example, TLS). And if you want to use the xhtml format rather than the html format, you need to add ="true" after each boolean property in the <video> element.