如何将图像从 React Native 上传到 Express 后端？

Question

我按照这个例子将图片上传到我的后端。 https://github.com/expo/image-upload-example

我在 RN 申请中使用的代码是：

  let formData = new FormData();

  formData.append('name',this.state.name);
  formData.append('description',this.state.description);
  formData.append('price',this.state.price);
  formData.append('oprice',this.state.oprice);

  let fileArr = (this.state.image).split('.');
  let type = fileArr[fileArr.length -1]
  let uri = this.state.image


  formData.append('photo',{uri, name: `${this.state.name}.${type}`, type: `image/${type}`});
  console.log(formData);

  AsyncStorage.getItem('jwt', (err, token) => {

  fetch('http://192.168.1.83:8000/ShopRouter/deal', {
    method: 'POST',
    headers: {
      Accept: 'application/json',
      Authorization: token,
      'Content-type': false
    },
    body: formData
  })

我用于 express 后端的代码是：

 app.post('/ShopRouter/deal', passport.authenticate('jwt2', {session:false}), function(req,res) {
    upload(req, res, function(err) {
        if (err) {
            console.log(err);
        }

        console.log(req.file);
        console.log(req.files);
        console.log(req.photo);


        console.log(req.body.name);
        console.log(req.body.description);

我的 Multer 配置是：

var storage = multer.diskStorage({
  destination: function (req, file, cb, err){
    console.log(file)
    if (err){
      console.log(err)
     }
   cb(null, './uploads/')
  },
 filename: function (req, file, cb) {
   console.log(file)
   cb(null, file.originalname + '-' +Date.now())
  }
 });
  var upload = multer({ storage: storage }).single('photo');

行console.log（文件）打印

{ 字段名: 'photo', 原名：'An empty bottle .jpg', 编码：'7bit'，模仿类型：'image/jpeg'}

我不确定为什么后端在没有图像 uri 的情况下接收到这个，上传文件夹中没有保存任何内容

req.file 未定义。

Answer 1

我通过将图像上传到 s3 解决了这个问题

如何将图像从 React Native 上传到 Express 后端？

How to upload images from react native to an express backend?

express

multer

react-native

expo