Request.prototype.form = function (form) { var self = this if (form) { if (!/^application\/x-www-form-urlencoded\b/.test(self.getHeader('content-type'))) { self.setHeader('content-type', 'application/x-www-form-urlencoded') } self.body = (typeof form === 'string') ? self._qs.rfc3986(form.toString('utf8')) : self._qs.stringify(form).toString('utf8') return self } // create form-data object self._form = new FormData() self._form.on('error', function(err) { err.message = 'form-data: ' + err.message self.emit('error', err) self.abort() }) return self._form }
发现了request调用了另一个库form-data，先通过self.form()创建出一个formData对象，再遍历options里的formData项，递归地将内容通过formData的append方法放进去，也就是说是formData实现了post文件，于是乎，我在axios中插入formData，形成了方案三：
方案三：
let data = fs.createReadStream(__dirname + '/test.jpg') let form = new FormData() form.append('type','image') form.append('media',data,'test.jpg') axios.post(url,form).then((response)=>{ console.log(response.data) }) .catch(e=>{console.log(e)})
但是，事实告诉我，我还是悲剧了，请求打印出来是这样的：
=============================================== { method: 'POST', url: 'https://www.jb51.net/', header: { accept: 'application/json, text/plain, */*', 'content-type': 'application/x-www-form-urlencoded', 'user-agent': 'axios/0.14.0', host: '127.0.0.1:3000', connection: 'close', 'transfer-encoding': 'chunked' } } ===============================================
再次content-type还是不对，于是我再去翻axios的文档和issue，发现，默认设置的content-type就是application/x-www-form-urlencoded，于是我判断，一定还是要手动设置headers的
于是，基于方案三，我又添加了和改动了这两行形成了方案四：
方案四
let header = { 'content-type': 'multipart/form-data' } axios.post(url,form,{headers:header}).then((response)=>{ console.log(response.data) })
但结果还是不理想，直接设置content-type是不行的，因为要将待发送文件绑定，就一定会有boundary出现，另外在方案三和方案四的请求中，出现了transfer-encoding这个值，关于这个chunked,可以参考MDN和这篇文章
一边google一边看文档的我，发现formData的文档中出现过form.getHeaders()的写法，于是方案五出现了：
方案五
let data = fs.createReadStream(__dirname + '/test.jpg') let form = new FormData() form.append('type','image') form.append('media',data,'test.jpg') axios.post(url,form,{headers:form.getHeaders()}).then((response)=>{ console.log(response.data) }) .catch(e=>{console.log(e)})
但是结果表明，这样还是不行，现在的请求是这样：
=============================================== { method: 'POST', url: 'https://www.jb51.net/', header: { accept: 'application/json, text/plain, */*', 'content-type': 'multipart/form-data; boundary=--------------------------171407872885673042671614', 'user-agent': 'axios/0.14.0', host: '127.0.0.1:3000', connection: 'close', 'transfer-encoding': 'chunked' } } ===============================================
但是我目前项目需求是，不使用chunked而采用content-length的方法来传输，这意味着，我要想办法搞到form的长度
在成功案例中，使用requests，于是我翻看了部分源码： 在request/request.js里出现了
function setContentLength () { if (isTypedArray(self.body)) { self.body = new Buffer(self.body) } if (!self.hasHeader('content-length')) { var length if (typeof self.body === 'string') { length = Buffer.byteLength(self.body) } else if (Array.isArray(self.body)) { length = self.body.reduce(function (a, b) {return a + b.length}, 0) } else { length = self.body.length } if (length) { self.setHeader('content-length', length) } else { self.emit('error', new Error('Argument error, options.body.')) } } }
它采用Buffer来计算长度，然后添加到headers中去
然后看看在axios里是如何做的： axios/lib/adapters/http.js里出现了
if (data && !utils.isStream(data)) { if (utils.isArrayBuffer(data)) { data = new Buffer(new Uint8Array(data)); } else if (utils.isString(data)) { data = new Buffer(data, 'utf-8'); } else { return reject(createError( 'Data after transformation must be a string, an ArrayBuffer, or a Stream', config )); } // Add Content-Length header if data exists headers['Content-Length'] = data.length; }
下文并没有出现else，所以，当data是stream的时候，并没有自动设置content-length
所以，我需要在formData.getHeaders()后，再添加一个content-length的key
想要计算长度，自然想到去看看源码，于是在form-data/lib/form_data.js中出现了惊喜: