Node.js - 使用 XHR 进行强大的上传

2024-05-29

我尝试实现一个简单的 XHR 上传到 Node.js(通过强大 https://github.com/felixge/node-formidable)。问题是如果我设置

xhr.setRequestHeader("Content-Type", "multipart/form-data");

节点给我错误:

Error: bad content-type header, no multipart boundary

如果我将边界设置为随机字符串,则不会发生任何情况。浏览器只是挂在 POST 上并等待服务器响应。

关键是,如果我将 formidable 与常规同步 POST 一起使用,一切都会正常工作。

有人尝试过使用强大 https://github.com/felixge/node-formidable与 XHR 上传?


我想到了。我在客户端犯了一个小错误。

这里是使用 Formidable 上传 XHR 的工作示例

You 不需要设置任何边界或特殊标题。

Client

var formData = new FormData();
var xhr = new XMLHttpRequest();

var onProgress = function(e) {
  if (e.lengthComputable) {
    var percentComplete = (e.loaded/e.total)*100;
  }
};

var onReady = function(e) {
 // ready state
};

var onError = function(err) {
  // something went wrong with upload
};

formData.append('files', file);
xhr.open('post', '/up', true);
xhr.addEventListener('error', onError, false);
xhr.addEventListener('progress', onProgress, false);
xhr.send(formData);
xhr.addEventListener('readystatechange', onReady, false);

Server

app.post('/up', function(req, res) {
  var form = new formidable.IncomingForm();
  form.uploadDir = __dirname + '/tmp';
  form.encoding = 'binary';

  form.addListener('file', function(name, file) {
    // do something with uploaded file
  });

  form.addListener('end', function() {
    res.end();
  });

  form.parse(req, function(err, fields, files) {
    if (err) {
      console.log(err);
    }
  });
});
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Node.js - 使用 XHR 进行强大的上传 的相关文章

随机推荐