【问题标题】:reportProgress Angular doesn't work with Web API AspNet?reportProgress Angular 不适用于 Web API AspNet?
【发布时间】:2021-11-08 10:13:18
【问题描述】:

我正在编写任何文件的上传组件,我使用 angular 12 和 ASP.NET Web API,但报告进度不起作用。

我想做这样的事情:https://nemi-chand.github.io/multiple-file-upload-in-angular-using-aspnet-core/

  uploadFile(files: File[]){

    let formData = new FormData()
    formData.append('file', files[0], files[0].name)
    const req = new HttpRequest('POST', `${environment.serviceBaseApp}/UploadFile`, formData, 
    {
      reportProgress: true
    });

    this.http.request(req).subscribe(event => {
      switch (event.type) {
        case HttpEventType.Sent:
          console.log('Request sent!');
          break;
        case HttpEventType.ResponseHeader:
          console.log('Response header received!');
          break;
        case HttpEventType.DownloadProgress:
          const kbLoaded = Math.round(event.loaded / 1024);
          console.log(`Download in progress! ${ kbLoaded }Kb loaded`);
          break;
        case HttpEventType.Response:
          console.log('???? Done!', event.body);
      }
    });
  }
   public class RecepcionController : ApiController
   {

        [HttpPost]
        [Route("api/UploadFile")]
        public HttpResponseMessage UploadFiles()
        {
            //Create the Directory.
            string path = HttpContext.Current.Server.MapPath("~/Uploads/");
            if (!Directory.Exists(path))
            {
                Directory.CreateDirectory(path);
            }

            //Save the File.
            HttpPostedFile postedFile = HttpContext.Current.Request.Files[0];
            string fileName = Path.GetFileName(postedFile.FileName);
            postedFile.SaveAs(path + Path.GetFileName(postedFile.FileName));

            //Send OK Response to Client.
            return Request.CreateResponse(HttpStatusCode.OK, fileName);
        }
    }

【问题讨论】:

    标签: asp.net angular asp.net-mvc asp.net-mvc-4 asp.net-web-api


    【解决方案1】:

    你可能想要UploadProgress而不是DownloadProgress

        case HttpEventType.DownloadProgress: // this should be UploadProgress
              const kbLoaded = Math.round(event.loaded / 1024);
              console.log(`Download in progress! ${ kbLoaded }Kb loaded`);
              break;
    

    【讨论】:

    • 谢谢,它有效。将 downloadProgress 更改为 uploadProgress
    猜你喜欢
    • 2017-11-10
    • 1970-01-01
    • 2019-10-05
    • 1970-01-01
    • 1970-01-01
    • 2018-09-17
    • 1970-01-01
    • 2021-09-28
    • 2019-10-23
    相关资源
    最近更新 更多