angular-file-upload: cannot upload file with data

Question

ASP.NET Web Api cannot read a stream properly, error message is: "Unexpected end of MIME multipart stream. MIME multipart message is not complete."

This is my angular uploader code:

    vm.fileUploader = new FileUploader({
    url: 'api/FileAPI/Upload', withCredentials: true, method: 'POST',             
});

vm.fileUploader.onCompleteItem = function (fileItem, response, status, headers) {
    vm.data = response;
};

vm.fileUploader.onBeforeUploadItem = function (item) {
    item.formData = [{ folder: vm.folderName }];
}

This is where I read the stream and where the exception is thrown. This method is called from api controller, where I get form-data as a parameter.

    public async Task<IEnumerable<PhotoViewModel>> AddFile(HttpRequestMessage request)
{
    try
    {
        //nothing special in PhotoMultipartFormDataStreamProvider
        var provider = new PhotoMultipartFormDataStreamProvider(this.workingFolder);
        await request.Content.ReadAsMultipartAsync(provider);
        var photos = new List<PhotoViewModel>();
        foreach (var file in provider.FileData)
        {
            var fileInfo = new FileInfo(file.LocalFileName);
            photos.Add(new PhotoViewModel
            {
                Name = fileInfo.Name,
                Size = fileInfo.Length / 1024
            });
        }
        return photos;
    }
    catch(Exception ex)
    {
        throw new Exception("Error uploading file", ex);
    }
}

And here is my request string:

Method: POST, RequestUri: 'http://localhost:49645/api/FileAPI/Upload', Version: 1.1, Content: System.Web.Http.WebHost.HttpControllerHandler+LazyStreamContent, Headers:
{
  Connection: keep-alive
  Accept: */*
  Accept-Encoding: gzip
  Accept-Encoding: deflate
  Accept-Encoding: br
  Accept-Language: sr-RS
  Accept-Language: sr; q=0.8
  Accept-Language: en-US; q=0.6
  Accept-Language: en; q=0.4
  Host: localhost:49645
  Referer: http://localhost:49645/upload
  User-Agent: Mozilla/5.0
  User-Agent: (Windows NT 10.0; Win64; x64)
  User-Agent: AppleWebKit/537.36
  User-Agent: (KHTML, like Gecko)
  User-Agent: Chrome/60.0.3112.113
  User-Agent: Safari/537.36
  Origin: http://localhost:49645
  Content-Length: 791882
  Content-Type: multipart/form-data; boundary=----WebKitFormBoundaryxUFnwtUwHSuA4X5Q
}

When I upload files without additional data, it works fine, but when I add form data, I get this exception. I tried to change headers, content-type, but no luck. I also tried things I read from another questions, but there angular-file-upload is not used.

Tushar Walzade · Accepted Answer · 2017-09-26 06:13:28Z

0

Try this in your onBeforeUploadItem code -

vm.fileUploader.onBeforeUploadItem = function (item) {
    item.formData.push({ folder: vm.folderName });
}

answered Sep 26, 2017 at 6:13

Tushar Walzade

3,8274 gold badges38 silver badges60 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

vpetrovic Over a year ago

No, same exception. I think this is something how angular-file-upload creates this type of request. I always get folderName data in controller, but cannot read file stream

Tushar Walzade Over a year ago

I don't understand .net code, but I think you are going wrong at server side. please search for -"get the body on http post in asp.net", that may help you.

Collectives™ on Stack Overflow

angular-file-upload: cannot upload file with data

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related