Windows Azure als HTML5 Video BLOB Storage verwenden

von Toni Pohl, 2. May 2012 16:27

Wenn man auf einer eigenen Website Videos verwenden möchte, gibt es dazu einige Möglichkeiten. Selber hosten, ein Videoportal wie YouTube od. ähnliches verwenden, oder ... alles ganz anders.

In meinem Fall ging es darum in einem Web, ein Video mit dem HTML5 Video-Tag abzuspielen. Nach dem Konvertieren in die beiden erforderlichen Formate .MP4 und .OGG werden die Files also auf den Webserver geladen und per HTML verlinkt (Code siehe unten).

Nur, was passiert, wenn jetzt viele gleichzeitige Abfragen auf die Webseite kommen? Jedes Video-File ist ein paar Megabyte groß, wie sieht es hier mit Traffic, Last und Verfügbarkeit aus?

Nun, ganz neu gibt es Windows Azure Media Services für Live-Streaming, siehe auch ScottGu: Announcing Windows Azure Media Services. Die Media Services sind allerdings noch im Preview-Status: “To sign up for the preview, click here.”

Als schnelle Möglichkeit bietet es sich also an, mal rasch den Azure BLOB Storage für die Video Files zu verwenden. Gesagt, getan: Video-Dateien in den BLOB Container uploaden und die Website anpassen. Hier der HTML5-Code dafür:

<video width="800" height="250" controls="controls" poster="/img/background.jpg" id="video_einfach">
<source src="<yourappid>.blob.core.windows.net/video/einfach.mp4" type='video/mp4; codecs="avc1.4D401E, mp4a.40.2"' />
<source src="<yourappid>.blob.core.windows.net/video/einfach.ogv" type='video/ogg; codecs="theora, vorbis"' />
Your browser does not support the video tag.
</video>

Hübsch (in Visual Studio) formatiert sieht der HTML5-Code so aus:

html5-video

Je nach Browser wird eine Version des Videos mit dem HTML5-Video-Player ausgeliefert und abgespielt, in IE das MP4-File, in FF das .OGV File…

In IE sieht dieser Versuch dann allerdings so aus:

html5-video-ie-mime-type

In Firefox:

html5-video-ff-mime-type

Das Problem ist der Dateityp. Dieser wird falsch geliefert. Also, was tun?

Die Lösung ist zum Glück einfach. Den entscheidenden Tipp fand ich in Stream HTML5 Video from Azure Blob Storage.

Mit Azure Storage Explorer kann der Content Type einzelner Dateien leicht geändert werden. In meinem Beispiel habe ich zwei Versionen des Videos “einfach.mp4” in den BLOB Storage upgeloadet, das sieht standardmäßig so aus:

azure-storage-explorer-video-default

Nun muss nur der Content Type geändert werden, und zwar von “application/octet-stream” wie folgt:

  • video/ogg
  • video/mp4

Die Bearbeitung erfolgt im Azure Storage Explorer per Doppelklick und Anpassen der File-Eigenschaft (Properties) ContentType. Hier wird “video/mp4” bzw. “video/ogg” eingetragen:

azure-storage-explorer-video-mp4

So sehen dann die korrekten Content Types für MP4 und OGV Videos aus:

azure-storage-explorer-video-content-type-correct

Es funktioniert. Der Browser zeigt beim Reload der Seite den Player an…

html5-video-player-ie

Das Video-File muss natürlich genauso downgeloadet werden, aber immerhin, es belastet nicht den (eigenen) Webserver, sondern kommt aus der Wolke.

Es ist somit eine coole und vor allem rasche Lösung, Azure für simples BLOB Hosting von großen Files und Videos zu verwenden. Noch kein Streaming – aber dafür gibt es ja bald die Azure Media Services!

Tipp: Interessierte können sich schon jetzt für Azure Media Services per E-Mail an mediaservices@microsoft.com anmelden.



Autor:

Add comment

  Country flag

biuquote
  • Comment
  • Preview
Loading

Windows 8 Pro

Windows 8 Pro-Das Handbuch

Neu: Auch als Kindle Version!
Das neue Windows 8 Pro und Windows 8 Enterprise Edition-Handbuch
von Martina Grom, Toni Pohl und Tobias Weltner.
Jetzt im Handel und bei Amazon!

Office 365 für KMUs

Microsoft-Office-365-in-kleinen-Unternehmen-von-Martina-Grom-MVP-Office365

Cloud-Fachwissen ganz einfach!
Office 365 in kleinen Unternehmen
von Martina Grom.
Jetzt im Handel und bei Amazon!
Neu: Kindle-Version!

About

atwork-blog informiert über
IT-News und liefert Tipps & Tricks für IT-Professionals und Developer.
Die Inhalte sind Privatmeinung des jeweiligen Autors.

Follow us also on Twitter:
Do you follow me?
Martina Grom
Toni Pohl

Translate this!


Werbung


Visits in myworldmaps.net

blog.atwork.at worldmap in Azure

Kalender

<<  May 2013  >>
MoTuWeThFrSaSu
293012345
6789101112
13141516171819
20212223242526
272829303112
3456789

View posts in large calendar

Jetzt einkaufen!