Отслеживание загрузки файла корзины Amazon S3 из Net Core с Angular 8 FrontEnd

Question

Я пытаюсь загрузить файл из Angular 8 Frontend ->. Net Core Controller Backend -> S3 Bucket

Мне нужно отслеживать ход загрузки, чтобы прогресс Панель может отображаться пользователю.

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

        const uploadReq = new HttpRequest('POST', `api/upload/uploadfile`, formData, {
            reportProgress: true,
        });
        this.http.request(uploadReq).subscribe(event => {
            if (event.type === HttpEventType.UploadProgress)
                this.progress = Math.round(100 * event.loaded / event.total);
                if (this.progress == 100) {
                    this.uploaded = true;
                    this.error = false;
                }
            else if (event.type === HttpEventType.Response)
                this.message = event.body.toString();
               
        });
    }

На основном контроллере. net я подключаюсь к s3

[HttpPost("uploadfile"), DisableRequestSizeLimit]
  

  public ActionResult UploadFile()
        {
      
            try
            {
            IAmazonS3 client = new AmazonS3Client("xxx", "xxx",RegionEndpoint.USWest2);
            var file = Request.Form.Files[0];

            //string destPath = "folder/sub-folder/test.txt"; // <-- low-level s3 path use /
            PutObjectRequest request = new PutObjectRequest()
            {
                InputStream = file.OpenReadStream(),
                BucketName = "vtcleaner",
                Key = file.FileName // <-- in S3 key represents a path  
            };

            PutObjectResponse response =  client.PutObjectAsync(request).Result;

            return Json("Upload Successful.");
            }
            catch (System.Exception ex)
            {
                return Json("Upload Failed: " + ex.Message);
            }
        // Hello
        }
    }

Чтобы отслеживать прогресс, я планирую использовать следующий подход

1. Используйте API низкого уровня из s3 https://docs.aws.amazon.com/AmazonS3/latest/dev/LLuploadFileDotNet.html

2. Постоянно отслеживайте UploadPartProgressEventCallback и передайте значение в Angular

Это правильный подход? Поскольку вызов будет асинхронным c методом, как отслеживать переменную прогресса?

Answer 1

К сожалению, вы должны сообщать веб-интерфейсу об изменении прогресса. Итак, вы должны сделать своего рода «запрос» к своему интерфейсу. Это не поддерживается обычным REST, но вы можете использовать SignalR для этого предложения. Для получения информации о предложении загрузки применима ваша идея.