2

I'm using the ng2-file-upload package hitting an ASP.NET Core backend.

https://github.com/valor-software/ng2-file-upload

Using the base example, trying to test a large file upload ~50MB.

The file eventually uploads, but no progress/chunk action is happening. It basically uploads all at once after sitting a while.

What do I need to change to get progress/chunk upload?

ng2 component:

import { Component, OnInit } from '@angular/core';
import { FileUploader } from 'ng2-file-upload';

@Component({
    selector: 'fileupload',
    templateUrl: './fileupload.component.html'
})
export class FileUploadComponent implements OnInit {

    public uploader: FileUploader = new FileUploader({ url: '/api/purchaseorder/upload' });

    ngOnInit() {

        this.uploader.onCompleteItem = (item: any, response: any, status: any, headers: any) => {

            console.log("ImageUpload:uploaded:", item, status);
        };
    }

    public hasBaseDropZoneOver: boolean = false;
    public hasAnotherDropZoneOver: boolean = false;

    public fileOverBase(e: any): void {
        this.hasBaseDropZoneOver = e;
    }

    public fileOverAnother(e: any): void {
        this.hasAnotherDropZoneOver = e;
    }
}

asp.net mvc controller/action:

    public ActionResult Upload(IFormFile file)
    {
        if (file == null || file.Length == 0)
        {
            return NoContent();
        }

        // handle file here

        return Ok();
    }
aherrick
  • 19,799
  • 33
  • 112
  • 188

1 Answers1

1

When you ask for IFormFile to be passed into the action as a parameter, it will need to load the entire file before the action can be processed. Instead pull the IFormFile from the current request like so:

public ActionResult Upload()
{
    foreach (IFormFile file in Request.Form.Files)
    {
        if (file == null || file.Length == 0)
        {
            return NoContent();
        }

        // handle file here
        var stream = file.OpenReadStream();
    {

    return Ok();
}
defect833
  • 275
  • 7
  • 22