Multipart form parse error - Invalid boundary in multipart: None

Question

I am very frustrated and could not find the soloution:

I am creating a project using angularjs and nodejs.I get image data from angular side in node js and send this data to further api.I got error

{
  "error": {
    "detail": "Multipart form parse error - Invalid boundary in multipart: None"
  }
}

here is my code in nodejs side:

var request = require('request');
    console.log(req.files);
var data = {

        website:'www.gamail.xom',
        contact_number:'dsdsd',
        services_offered:'dsadasd',
        contact_name:'dasdas',
        provider_category:'exchange',
        email:'kk@gmail.com',
        image:req.files

    }
var api_url = global.common.base_url + 'vcard/1.0.0/visit_card/' + req.param('uuid') +'/';
    request({
        url: api_url,
        method: 'PUT',
        headers: {
            'Content-Type': 'multipart/form-data',
            'Authorization': 'Bearer '+req.cookies.apitoken
        },
        json: data

    }, function(error, response, body) {
        if(response.statusCode == 200 && !error){
            res.end(JSON.stringify(body));
        }else{          
            res.send(response.statusCode, { error: body });
        }
    });
}

In req.files i get

{ image:
   [ { fieldName: 'image[0]',
       originalFilename: 'icon_dd_chart_grey.png',
       path: 'C:\\Users\\karakuma\\AppData\\Local\\Temp\\op74_gLSzPs-_49aT1GF0si
7.png',
       headers: [Object],
       size: 1474,
       name: 'icon_dd_chart_grey.png',
       type: 'image/png' } ] }

How did you manage to solve the problem? Or it remains unsolved? — Loi Nguyen Huynh, Apr 05 '21 at 17:52

score 6 · Answer 1 · edited Oct 02 '17 at 10:45

6

Try defining the content type as follows.

content_type='multipart/form-data; boundary=----WebKitFormBoundary7MA4YWxkTrZu0gW'

I was facing the same issue and it worked for me in python.

edited Oct 02 '17 at 10:45

Axel

3,331
11
35
58

answered Oct 02 '17 at 09:39

Aamir Five

129
1
3

9

Can you explain what's happening here @Aamir – alkadelik Aug 13 '20 at 13:30
9

It could be a true solution but with no word of explanation seems useless – Paullo Nov 18 '20 at 09:41
@Axel could you possibly explain the 'boundary=-----' part of your answer? – dgg Mar 17 '22 at 22:49
@DGG to be honest, I don't have a clue about it. I just made a very simple edit on the answer. But what about https://stackoverflow.com/questions/3508338/what-is-the-boundary-in-multipart-form-data or https://duckduckgo.com/?q=multipart%2Fform-data%3B+boundary%3D----&t=ffab&atb=v267-1&ia=web – Axel Mar 22 '22 at 11:54
@Axel thanks a ton for the helpful links. The SO link/answer by Oscar Mederos explained it really well. Cheers – dgg Apr 01 '22 at 13:59
1

Glad to help you out @DGG! – Axel Apr 01 '22 at 14:53
1

For somebody using `fetch`: this error happens too if you are trying to put this header manually and providing the `FormData` object as the body as well. You only need to give the `FormData` object and fetch will set this header for you automatically. [reference/info](https://github.com/github/fetch/issues/505#issuecomment-293064470) – StandardIO Apr 17 '23 at 04:15

score 5 · Answer 2 · answered Jul 16 '20 at 14:10

I also faced this issue while trying to upload file. For me the issue was the FormData, which was coming as Object instead of FormData instance

So i converted my object to FormData using below code:

const getFormData = object => Object.keys(object).reduce((formData, key) => {
            formData.append(key, object[key]);
            return formData;
        }, new FormData());

And the just executed my post request, in my case using Vue resource:

return Vue.http.post(url,
        getFormData(formData),
        {
            headers: {
                'Content-Type': 'multipart/form-data'
            }
        });

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>

score 4 · Answer 3 · answered Oct 25 '21 at 19:48

There is no need to mention the content type in header, fetch() will detect it's content type by itself.

let formData = new FormData()
formData.append("email", email);
formData.append("password", password);
formData.append("image", image);

const response = await fetch('http://localhost:8000/api/authentication/register/', {
                method: 'POST',
                headers: {'X-CSRFToken': csrftoken}, //django specific
                body: formData,
            });

score 0 · Answer 4 · answered Mar 29 '21 at 21:32

I have been facing this problem in angular 11 connected to Django rest API, I was able to curl with something like this in order to upload a JSON with a form:

curl -X POST -S \
  -H 'Accept: application/json' \
  -u "user:password" \
  -F "name=name" \
  -F "label=mylabel" \
  -F "otherfields=something" \
  -F "photo=@./example.png;type=image/png" \
  http://127.0.0.1:8000/api/v1/item/

But I was getting that exception using my header as httpOptions:

'content-type': 'multipart/form-data',

So I just commented out the content-type and it seems angular is so clever that he creates the header for you and will set the multipart together with the boundaries.

For more information on this: What is the boundary in multipart/form-data?

score 0 · Answer 5 · answered Aug 23 '22 at 09:11

A boundary is just the 'key' to separate the multiple "parts" of a multipart payload. Normally something like '&' is enough to separate the variables but you need something more unique to separate the payloads within the payload comment

You can use any value that not occurs in the data sent.

NOTE: Because boundary delimiters must not appear in the body parts being encapsulated, a user agent must exercise care to choose a unique boundary parameter value.

The simplest boundary delimiter line possible is something like "---", with a closing boundary delimiter line of "-----".

Multipart form parse error - Invalid boundary in multipart: None

5 Answers5