0

我正在尝试将 MP4 视频从 Angular 8 上传到 WebAPI，但问题是我不确定如何将 MP4 视频从 Angular 传输到 Webapi，以便我将视频上传到 AZure 存储。下面是我的代码。

后端 Web API 代码

public class VideoFilesController : ApiController
    {
        private readonly MultipartFormDataStreamProvider streamProvider;
        public async void Post([FromBody]VideoFileRequest videoFileRequest)
        {
            await Request.Content.ReadAsMultipartAsync(streamProvider);

            string connectionString = ConfigurationManager.ConnectionStrings["StorageConnection"].ConnectionString;
            BlobHttpHeaders blobHttpHeaders = new BlobHttpHeaders()
            {
                ContentType = "video/mp4"
            };

            BlobContainerClient container = new BlobContainerClient(connectionString, ConfigurationManager.AppSettings["destContainer"]);
            container.CreateIfNotExists(PublicAccessType.Blob);

            //lines modified
            var blockBlob = container.GetBlobClient(videoFileRequest.fileName);
            using (var fileStream = System.IO.File.OpenRead(@"C:\LocalBlobs\UpdateMP4File.mp4"))
            {
                blockBlob.Upload(fileStream);
            }

        }


    }

文件上传 HTML 代码

<form  name="VideoFileEditorForm" #f="ngForm"
        (ngSubmit)="save(file.files)">

    <div>
      <label [class.col-md-3]="isViewOnly" [class.col-md-3]="!isViewOnly" class="col-form-label" for="file">Select a MP4 file to upload</label>
        <input #file type="file" multiple (change)="upload(file.files)" />
      </div>
  <button  type="submit" class="btn btn-primary">
           Save Video file to Azure
          </button>
        </div>
</form>

打字稿代码 

 upload(files) {
      if (files.length === 0)
        return;
      const formData = new FormData();
      for (let file of files)
        formData.append(file.name, file);
    }

private save(files) {

        if (files.length === 0)
        return;

        const formData = new FormData();
            for (let file of files)
        formData.append(file.name, file);

return this.http.post<T>("https://localhost:44396/api/VideoFiles", formData).pipe<T>(
      catchError(error => {
        return this.handleError(error, () => this.getNewVideoFileEndpoint(videoFileObject));
      }));

所以，有人可以检查我的代码并推荐我如何将这个 Mp4 视频从 angular 传递到 webapi，以便我上传到 Azure。谢谢

4

0 回答 0