angular + nodejs中通过http.post的formData答案

【问题标题】：formData through http.post in angular + nodejsangular + nodejs中通过http.post的formData
【发布时间】：2018-02-08 11:52:10
【问题描述】：

当我想通过 http.post 将一些数据从我的 angular 客户端传递到我的 node.js 服务器时，我遇到了一个问题。

事情就是这样，使用 JSON.stringify(my text) 传递文本可以正常工作，但鉴于我想传递一个文件 + 我的文本，我想使用 formData。

当我尝试在服务器端取回数据时，我的 req.body 为空，我无法检索数据。

这是我的客户端代码：

[...]
var formData = new FormData();
        formData.append('name', product.name);
        formData.append('benefits_detail', product.benefits_detail);
        formData.append('sections', product.sections);
        formData.append('image', product.image);   // image is my file

            return this.http.post('http://localhost:3000/product', formData, {headers: headers}).map(........)

然后是我的服务器，我尝试取回我的数据：

router.post('/', function (req, res, next) {

    console.log('req.body');
    console.log(req.body);
    console.log(req.body.formData);

...

这里的 console.log 是空的，就像显示：{}

有人可以帮忙吗？

谢谢你

【问题讨论】：

标签： node.js angular http-post

【解决方案1】：

您似乎没有使用任何正文解析中间件，这是必需的。

来自Express documentation for req.body

包含在请求正文中提交的数据键值对。默认情况下，它是未定义的，并在您使用 body-parser 和 multer 等正文解析中间件时填充。

尝试使用body-parser

【讨论】：

【解决方案2】：

要将图像上传到服务器，您可以尝试使用Ng File Upload 指令。它有一个指令来选择 HTML 中的文件，然后将文件上传到服务器。如果您已经在选择图片，我相信您可以使用 JS 中的 Uploading 部分来发送图片（从未尝试过在 HTML 中使用没有文件选择器的 Upload，但它应该可以工作）。

但是，此解决方案需要您发送两个请求，一个用于数据，另一个用于图像。

【讨论】：