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

【问题标题】：How to upload images from react native to an express backend?如何将图像从 React Native 上传到 Express 后端？
【发布时间】：2018-03-28 07:01:33
【问题描述】：

我按照这个示例将图像上传到我的后端。 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
  })

我用于快递后端的代码是：

 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(file) 行打印

{ 字段名：'照片'， originalname: '一个空瓶子.jpg', 编码：'7bit'， mimetype: '图像/jpeg' }

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

req.file 返回未定义。

【问题讨论】：

标签： express react-native multer expo

【解决方案1】：

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

【讨论】：