I have added a video tag into my HTML5 page using the Player Framework (http://playerframework.codeplex.com/). I am using the latest version of the Azure Storage Library for my Storage Account. I've seen some alluding to the possibility of HTML5 video playback streaming the file but, in my case, it just seems to download the entire 800MB file before it starts playing. The content type is marked as video/mp4. This happens in the latest Chrome/IE/Edge. Am I missing something here? Are Media Services required for this functionality?
<video id="myVideo" class="pf-video" width="480" height="320" controls="controls" preload="auto">
<source src="https://.../BuildTourTO_mid.mp4" type='video/mp4'>
</video>
Thanks.
Related
I have created a simple live stream using Azure Media Services. I can view it from Azure Media Player but I want to be able to embed the video to my personal website using the <Video></Video> HTML tag. I've been looking for a solution but I can't seem to find one. Is this even possible?
The HTML5 tag does not always support playback of HLS or DASH depending on the platform you are on.
https://caniuse.com/?search=hls
https://caniuse.com/?search=dash
Sounds like you are trying to playback HLS or DASH from Azure Media Services with just an HTML5 video tag and no javascript player framework. That won't work in most browsers.
Review https://howvideo.works/ for background on how HLS and DASH actually work in the browser - and the reason that you need access to a javascript library and the Media Source Extension feature of HTML5 (not always available in all browsers - see https://caniuse.com/mediasource)
I'm trying to use preview url to preview my stream before go live, but always get an error "No compatible source was found for this media". When I start the event, I have no problem playing the actual streaming url, it plays perfectly in the Azure Media player.
And another question, I see a couple video tutorials and see that preview can be used in pass through channels, but I found this in the documentation: "When Live Encoding is enabled, you can now get a preview of the live feed as it reaches the Channel.", this means that only Standard channels can be used to see a preview? By the way, I tested in both channels, pass through and standard and get the same error in preview.
Update:
I'm using Chrome and just for curiosity, I open Azure Media Player in Internet Explorer and finally I can see the live feed in preview. So, what's the problem with Chrome?
you need to enable Flash in Chrome to be able to playback preview URLs from AMS because the previews are only available in the smooth streaming format. Smooth Streaming needs plugins like Flash or Silverlight to playback.
You can enable flash in a couple different ways but most commonly you can just go to content settings and enable it for whatever websites you're using.
I'm developing a Video on Demand feature for a Django project of mine. It's going to be powered by Azure Media Services.
Currently, I'm trying to run an uploaded video via the following code:
<video id="azuremediaplayer" class="azuremediaplayer amp-default-skin amp-big-play-centered" controls autoplay width="640" height="400" poster="" data-setup='{"techOrder": ["azureHtml5JS", "flashSS", "silverlightSS", "html5"], "nativeControlsForTouch": false}'>
<source src="{{ video.streaming_url }}" type="video/mp4" />
<p class="amp-no-js">
To view this video please enable JavaScript, and consider upgrading to a web browser that supports HTML5 video
</p>
</video>
where {{ video.streaming_url }} contains a streaming url of the sort http://example.streaming.mediaservices.windows.net/66193aae-b739-4cb5-b4b9-f4a4a151c791/myproject.ism/manifest.
My problem is that I get the error no compatible source found for the current browser environment (0x10600003). In fact, I get that error when I go to http://ampdemo.azureedge.net/azuremediaplayer.html as well (i.e. an official azure media player demo).
It seems the 0x10600003 error code implies Autoselect failed to find a player. Note that Youtube videos work perfectly in my environment. My OS is Ubuntu 14.04, and the browser is Mozilla Firefoz 41.0.1. A previous unaccepted answer guided the op to install and enable Silverlight. I can't expect all my users to do that. How do I get playback to work?
Azure Media Player is built on 4 different players, a DASH player, a Flash player, the Silverlight player, and the native implemented player for the browser you're watching the video on. These different "Player Techs" playback different protocols supported my Azure Media Services- DASH, Smooth, and HLS.
AMP intelligently decides which player/playback protocol to use for a specific/device or browser by looking at what technologies/features the browser supports. First, it'll check if the browser supports Media Source Extensions. MSE allows the browser to playback adaptive bitrate streams without the use of plugins like Flash and Silverlight, it's supported in most modern browsers, but not always in older versions of those browsers. If MSE is supported,AMP will playback your content using the MPEG-Dash protocol and you're good to go. If MSE isn't supported, AMP will check and see if Flash is installed and then if Silverlight is installed. If either of these are true it will play back using the installed plugin and the Smooth Streaming protocol. If neither of them are installed, it will try to play back via the native html5 video tag implementation of the browser. This is completely dependent on the browser, and most do not support ABR streams natively (except, for example, Safari via HLS)
Your short answer, given this background information, is that because you are using an older version of FF that does NOT support MSE, you need to install either Flash or Silverlight to play back your adaptive bitrate streams.
a few mitigations for you/customers:
1) install Flash/Silverlight
2) download an up-to-date version of FF, we recommend this for sure because MSE is supported in v42 but in v47+ Google Widevine protected content is supported, which means you can playback DRM encrypted content without Silverlight
see Azure Media Player's Compatibility Matrix for more info on what's supported on which browsers.
If you have any more questions, you can email me at ampinfo#microsoft.com, hope this helps!
I just knocked off the content policy and created a new one and it started working again.
I have a media services account with a streaming unit and I have been able to upload a video and dynamically package into various streams. I am trying to have a webpage with the streaming url to be able to serve cross platform iOS, android, desktop etc.. How do I go about it.
PS: I was able to create a page with videojs and progressive download. I am tring to explore the other option with Windows Azure.
Thanks for any help.
Azure Media Services has shipped Azure Media Player which could automatically detect the capability of your browser or device, and request the appropriate streaming format- for instance, it will grab MPEG-DASH stream with EME enabled browser, or HLS for iOS devices. You could give it a try: http://amsplayer.azurewebsites.net/azuremediaplayer.html. Please contact yanmf#microsoft if you want to get into Private Preview for this player. It will be free for use when we launch very soon.
Take a look at JW Player and the Microsoft Media Platform Player Framework. Both offer plenty of playback options for progressive and adaptive streaming to a wide range of browsers and devices.
For desktop : Use OSMF plugin - Adobe + Smooth streaming URL
For iOS : Use HTML5 Video tag+HLS v3 URL
For Android : Use HTML5 Video Tag+HLS v3 URL or Dash.JS with Mpegh Dash URL
For Windows Phone : Use Dash.js + Dash.JS URL
Hope this helps...
Update1:
Azure has came up with their own Media player for streaming which will take care of playing video in all the devices.
For Demo and Test - http://www.aka.ms/azuremediaplayer
For Documentaion - http://azure.microsoft.com/blog/2015/04/15/announcing-azure-media-player/
The bitdash MPEG-DASH player works also out of the box for MPEG-DASH content, here you can see an example stream comming from Azure: http://www.dash-player.com/demo/streaming-server-encoder-support/?mpd=http%3A%2F%2Fsamplescdn.origin.mediaservices.windows.net%2Fe0e820ec-f6a2-4ea2-afe3-1eed4e06ab2c%2FAzureMediaServices_Overview.ism%2Fmanifest(format%3Dmpd-time-csf)&m3u8=undefined&autoplay=true&muted=false&usePoster=true
I have a bit of a problem, I dont know why but I cant render video files on my site.
I made a project where my Videos are inside my asset folder, and it is called by a video tag.
It works on localhost, there are no problems but when I publish it
The images work but the video does not play.
Then I Tried Blob Storage, using Azure Storage Explorer I uploaded my video files in a public Blob. But same thing, it does not load but I can download the video file (I dont get this part)
Lastly I use Media Service which works good but the problem is, the Azure Manager of Media Service sucks, I need to upload tons of video and the UX in Azure does not help at all. there is no batch uploading or what so ever and I need to publish one by one.
So I made a code for it (Upload -> Encode -> Publish) but my biggest problem now is Upload.
The part where I will upload my IassetFile
assetFile.Upload(uploadFilePath);
This always fail with 100mb++ Files, but if it is 20mb++ it works ok.
I'm quite a bind, I dont know anymore what to do.
Can anyone give suggestion on how Can I proceed with this problem, the best case is that
Is there a configuration in azure website where I can activate so I can play videos?
You can convert video files you have already uploaded into blob storage into media services assets. The guidance from Microsoft on how to do this is here: http://msdn.microsoft.com/en-us/library/jj933290.aspx
You should also be able to leverage the raw MP4 blob that is produced as the baseline media asset if you don't wish to utilise smooth streaming or similar services. This asset has a long URL with a SAS access key.