javascript - Batched Media Upload to Azure Blob Storage through WebApi -


my web app allows users upload media one-at-a-time using following:

var fd = new formdata(document.forms[0]); fd.append("media", blob); // blob image/video $.ajax({     type: "post",     url: '/api/media',     data: fd }) 

the media gets posted webapi controller:

    [httppost, route("api/media")]     public async task<ihttpactionresult> uploadfile()     {         if (!request.content.ismimemultipartcontent("form-data"))         {             throw new httpresponseexception(httpstatuscode.unsupportedmediatype);         }          string mediapath = await _mediaservice.uploadfile(user.identity.name, request.content);          return ok(mediapath);     } 

which along lines of:

 public async task<string> uploadfile(string username, httpcontent content)  {    var storageaccount = new cloudstorageaccount(new storagecredentials(accountname, accountkey), true);    cloudblobclient blobclient = storageaccount.createcloudblobclient();    cloudblobcontainer imagescontainer = blobclient.getcontainerreference("container-" + user.userid);    var provider = new azurestoragemultipartformdatastreamprovider(imagescontainer);    await content.readasmultipartasync(provider);    var filename = provider.filedata.firstordefault()?.localfilename;    // etc  } 

this working great individual uploads, how go modifying support batched uploads of multiple files through single streaming operation returns array of uploaded filenames? documentation/examples on seem sparse.

public class azurestoragemultipartformdatastreamprovider : multipartformdatastreamprovider {     private readonly cloudblobcontainer _blobcontainer;     private readonly string[] _supportedmimetypes = { "images/png", "images/jpeg", "images/jpg", "image/png", "image/jpeg", "image/jpg", "video/webm" };      public azurestoragemultipartformdatastreamprovider(cloudblobcontainer blobcontainer) : base("azure")     {         _blobcontainer = blobcontainer;     }      public override stream getstream(httpcontent parent, httpcontentheaders headers)     {         if (parent == null) throw new argumentnullexception(nameof(parent));         if (headers == null) throw new argumentnullexception(nameof(headers));          if (!_supportedmimetypes.contains(headers.contenttype.tostring().tolower()))         {             throw new notsupportedexception("only jpeg , png supported");         }          // generate new filename every new blob         var filename = guid.newguid().tostring();          cloudblockblob blob = _blobcontainer.getblockblobreference(filename);          if (headers.contenttype != null)         {             // set appropriate content type uploaded file             blob.properties.contenttype = headers.contenttype.mediatype;         }          this.filedata.add(new multipartfiledata(headers, blob.name));          return blob.openwrite();     } } 

assuming azurestoragemultipartformdatastreamprovider similar same class mentioned on this blog, processing multiple files if there multiple files in request.

so need change uploadfile return ienumerable<string> , change controller have mediapath such.

so mediaservice have:

var filenames = provider.filedata.select(x => x.localfilename).tolist(); ; return filenames; 

and controller have:

var mediapaths = await _mediaservice.uploadfile(user.identity.name, request.content); return ok(mediapaths); 

Comments

Popular posts from this blog

javascript - Create a stacked percentage column -

Optimising Firebase database by automatically overwriting data -

javascript - Angular UI-Grid customTemplate directive causing rows to load slowly/? -