CODEWITHSUNDEEP
htmlazure-storageazure-blob-storageazure-media-services
user1790300
user1790300

Reputation: 1735

Ingesting videos via bulk uploading into Azure media services from HTML5

I am working on a project (web api, Angularjs, HTML5, CSS3) that currently allows a user to upload a video file one at a time by getting a locator from a web api call and upload the video in blocks via chunking using the locator url.

Now I have to provide a page where users can drag and drop videos to an area on a webpage and mass upload all of the video files to Azure media services. It seems like generating a locator for each file to be uploaded and doing one at a time until they are all complete does not seem the most efficient. What is the best option for mass uploading all video files into media services when it needs to be done via html5 with drag and drop?

I found examples detailing how to use the bulk uploading where you are provided with a url to upload to here: https://azure.microsoft.com/en-us/documentation/articles/media-services-dotnet-upload-files/. The problem with this is how would I use this url to upload from html5? The current way I upload a single video is to generate a SAS URL and use chunk uploading to that single url using http method put whereas the url returned from the bulk upload seems to be a url you use for uploading via third party tools, as per the link posted above, instead of html5 using FileReader.

I am really confused about which approach I should be using for this scenario. Key items are that I have to use html5 but allow a user to drag and drop any number of videos that need to all be published to media services at some point in the process. My current problem, in all honesty, is that I have all of these options and am unsure of where to begin.

Upvotes: 4

Views: 300

Answers (1)

Maciej Chałapuk
Maciej Chałapuk

Reputation: 462

It seems like generating a locator for each file to be uploaded and doing one at a time until they are all complete does not seem the most efficient. What is the best option for mass uploading all video files into media services when it needs to be done via html5 with drag and drop?

Uploading one file at a time is probably the best solution as upload speed of a typical user is very limited. Single upload will saturate the bandwidth and there will be minimal TCP overhead (from one connection only).

The problem with this is how would I use this url to upload from html5?

Calling Azzure's REST API (instead of .NET API from the link you provided) directly from JavaScript seems to be a better choice since it eliminates the need to write server-side code. The simplest way of calling REST API from angular is using $http service. You can also operate on higher level of abstraction by using $resource service.

Upvotes: 1

Related Questions