Chrome: formData can't be used because browsers can't use on.

[nemosupremo]

I'm not sure if browser support is a goal of this lirbary, but when using this library via Browserify, you cannot make multipart/form requests.

Sample Request

request.put("/v3/uploads", {json:false, formData: {upload: file_handle}})

Error:
Uncaught TypeError: self._form.on is not a function request.js:1134.

It looks like browsers don't support the .on('error') call.

[abhisheksharma0994]

//changes made to line 1134. Please check out .
requestjs.txt

//For further explaination , refer

http://stackoverflow.com/questions/32797573/alternative-to-onerror-this-onerror-bindthis-in-es6

[Anomen]

Same thing for me, using Webpack and Chrome.

[e-monson]

So, is there a workaround for this?

[mkrn]

This came up as an issue with chrome and browserify...
Wonder if anyone solved it.

[daviseford]

Any updates on this? using chrome and webpack

[sohibul]

need the solution too

[dukedougal]

Me too.

[Tommy10802]

Any update on this?
I have same problem with webpack and chrome, is any solution here?
Thx

[alexpi007]

I used multipart option and I set headers option with 'content-type': 'multipart/form-data':

 request(
  {
    method: 'POST',
    uri: urlToCall,
    headers: {
      'content-type': 'multipart/form-data',
    },
    multipart: {
         chunked: false,
         data:[
          {
            'Content-Disposition': 'form-data; name="nameParam1"',
            body :  inputToSend.username
          },
          {
            'Content-Disposition': 'form-data; name="nameParam2"',
            'Content-Type': 'application/json',
            body: JSON.stringify(objJson)
          }
          ]
      },
  },

  function (error, response, body) {
    if (error) {
      console.log("error:" + error);
      }
    console.log("success:" + body);
  }

);

[goodhyun]

@AlessandroPilastrini thanks, this worked as a nice workaround.

[Skeen]

+1

[RasmusMJ]

I used this:

var form = new FormData();
form.append('filename',  name);
form.append('file', new Blob([filecontents]));
var request = new XMLHttpRequest();
request.open("POST", "http://" + serverURL + '/upload');
request.send(form);
request.onload = function()
{
    callback(request.status, request.responseText);
};

[redgeoff]

I played around with many variations of request's multipart configurations and could not get it to work with file data.

I quickly tried looking into the issue and it appears that there is quite a bit of the the _form member in the request object missing. I tried to fake the on event and then moved on to faking a few other missing pieces. I gave up though as it appears there is a lot missing. I'm not sure if the issue is at the request, form-data or browserify layer. I'm a little concerned that that this type of thing isn't under any code coverage.

For now, I've gone ahead and decided to use needle as it just works ;)

[mweibel]

thanks @AlessandroPilastrini for your workaround. That works well.
For reference, if you want to upload binary data (e.g. images), use this:

If you have an HTML5 upload, you can use a FileReader for the File.
Example:

const fileReader = new window.FileReader();
fileReader.onload = function(e) {
  const filename = "somefilename.png";

  request({
    method: 'POST',
    uri: uriToCall,
    headers: { 'Content-Type': 'multipart/form-data'},
    multipart: {
      chunked: false,
      data: [
        {
          'Content-Disposition': `form-data; name="filedata"; filename="${filename}"`,
          body: e.target.result
        }
      ]
    };
  })
};

fileReader.readAsArrayBuffer(binaryData);

[if0109]

Is there a way to upload big size file for browsers?

[nasospsa]

Had the same problem, couldn't find a solution.

Ended up using superagent.
Just sent an object with content-type application/x-www-form-urlencoded

[hansfpc]

Same problem here.

[bbridges11]

I have tried this solution and still run into this error. Is there an updated workaround?

[dafergu2]

I needed to use this to upload files to the server in an electron app. I worked around this error by running the request in the main process rather than the renderer process and using ipc messages to synchronize back and forth.

[ipselon]

@dafergu2, I had the same issue in electron app. But my solution was to get the request module from window scope.

let nodeRequest;
if (window.require) {
  // rendered
  nodeRequest = window.require('request');
} else {
  // main process
  nodeRequest = require('request');
}

....

nodeRequest(requestOptions, (error, response, body) => {
   ...
}

[reconbot]

Request is now in maintenance mode and wont be merging any new features or fixing this issue. Please see #3142 for more information. And #3143 for alternatives to request.