Question

我正在尝试将带有EXPO Picker图像的图像上传到Node.js服务器。问题是我从未收到图像。我尝试了很多绝望的事情：（

这是我的代码：

本机

  postImage = async (image) => {
    const photo = {
      uri: image.uri,
      type: "image/jpg",
      name: "photo.jpg",
    };

    const form = new FormData();

    form.append("test", photo);

    axios.post(
      url,
      {
        body: form,
        headers: {
          'Content-Type': 'image/jpeg',
        }
      }
    )
    .then((responseData) => {
      console.log("Succes "+ responseData)
    })
    .catch((error) => {
      console.log("ERROR " + error)
    });
  }

  pickImage = async () => {
    const result = await ImagePicker.launchImageLibraryAsync({
      // mediaTypes: ImagePicker.MediaTypeOptions.All,
      // allowsEditing: true,
      // aspect: [4, 3],
      quality: 1
    });

    if (!result.cancelled) {
      try {
        await this.postImage(result);
      } catch (e) {
        console.log(e);
      }

      this.setState({ image: result.uri });
    }
  };

它始终有效。

这里是nodejs代码

const express = require("express");
const bodyParser = require("body-parser");
const cors = require("cors");
const multer = require('multer');
const fs = require("fs");

const app = express();
const upload = multer({ 
  dest: "upload/",
});

// app.use(upload.single("test"));

app.use(bodyParser.urlencoded({ extended: false }));
app.use(bodyParser.json());
app.use(cors());
app.listen(8080, () => {
  console.log("running ...")
})

app.post("/upload", upload.single("photo.jpg"), async (req, res) => {
  console.log("body =>", req.body);
  console.log('files => ', req.files);
  console.log("file =>", req.file);

  // const oldpath = req.body.;
  // const newpath = '/Users/mperrin/test/test-native/test-upload-photo/server/lol.jpg';

  // fs.rename(oldpath, newpath, (err) => {
  //   if (err) {
  //     throw err;
  //   }

  //   res.write('File uploaded and moved!');
  //   res.sendStatus(200);
  // });

  res.sendStatus(200);
});

我总是在控制台中看到它，但我不知道该怎么做...

body => {
  body: { _parts: [ [Array] ] },
  headers: { 'Content-Type': 'image/jpeg' }
}

目前仅创建文件夹“ upload”。我不知道在哪里可以找到文件，我想我确实丢失了一些东西，但我不知道该怎么办。

感谢帮助人员！

Answer 1

我之前从未使用过multer，但是在快速浏览文档之后，看来您需要在标题中使用与节点侧帖子中期望的名称相同的名称

现在，您的标题中有

    name: 'photo.jpg'

以及您节点中的以下内容

    upload.single("test")

您的帖子正在查找名称为“ test”而不是“ photo.jpg”的东西，而您正在发送“ photo.jpg”

尝试一下，让我知道它的进展。

编辑：我的错误，您可能添加了名称：“测试”

到此处的标题，而不是在照片对象中：

    axios.post(
          url,
          {
            body: form,
            headers: {
              'Content-Type': 'image/jpeg',
            }
          })

如何将图像从React Native上传到Node.js？

1 个答案: