如何解析express.js中反应前端发送的对象?

时间:2018-04-11 17:02:44

标签: javascript reactjs express

所以在我的反应前端,我使用'react-drop-to-upload'模块允许用户拖动文件并上传。我按照npm模块页面上的示例创建了一个名为handleDrop的处理程序。代码如下:

    handleDrop(files) {
      var data = new FormData();

      alert((files[0]) instanceof File);
      files.forEach((file, index) => {
        data.append('file' + index, file);
      });

      fetch('/file_upload', {
        method: 'POST',
        body: data
      });
    }

在我的快递后端,我有以下代码:

app.post('/file_upload', function(req , res){
  var body = '';
  req.on('data', function (data) {
      body += data;
        });
  var post = "";
  req.on('end', function () {
      //post = qs.parse(body);
      console.log(body);
      // this won't create a buffer for me
      //var fileBuffer = new Buffer(body);
      //console.log(fileBuffer.toString('ascii'));
      //pdfText(body,  function(err, chunks) {
          //console.log(chunks);
      //});
  });

  //console.log(typeof post);
});

如果我删除了一个txt文件并在主体上执行控制台登录,它会给我:

------WebKitFormBoundaryqlp9eomS0BxhFJkQ

Content-Disposition: form-data; name="file0"; filename="lec16.txt"
Content-Type: text/plain

The content of my data!
------WebKitFormBoundaryqlp9eomS0BxhFJkQ--

我正在尝试使用pdfText模块,该模块接收pdf文件的缓冲区或路径名,从中将文本提取为文本“块”的数组。我想使用var fileBuffer = new Buffer(body)将body对象转换为缓冲区;但那不行。有人可以帮我弄这个吗?谢谢!

1 个答案:

答案 0 :(得分:1)

您需要一个解析器来处理多部分数据。您可以查看multer

您的示例代码,

app.post('/file_upload', function(req , res){
  var storage = multer.diskStorage({
        destination: tmpUploadsPath
    });
    var upload = multer({
        storage: storage
    }).any();

    upload(req, res, function(err) {
        if (err) {
            console.log(err);
            return res.end('Error');
        } else {
            console.log(req.body);
            req.files.forEach(function(item) {
                // console.log(item);
                // do something with the item,
                const data = fs.readFileSync(item.path);
                console.log(data);
            });
            res.end('File uploaded');
        }
    });
});

要深入理解示例代码,请here。请记住,您将把文件数据作为缓冲区而不是实际数据。