【问题标题】:React Native Failed Upload ImageReact Native 上传图片失败
【发布时间】:2020-04-01 06:36:35
【问题描述】:

过去两天我一直在努力破解使用 React Native 上传到 MongoDB 的文件/图像。我从字面上阅读了所有相关的论坛,但没有运气。我阅读了几个论坛,他们给出了一个示例,但我没有成功。这是我编写的示例代码。

客户端:

const { uri } = await this.camera.takePictureAsync(options);

let formData = new FormData();
formData.append('file', {
  uri: uri.replace("file:///", ""),
  type:'image/jpg', name:'userProfile.jpg',
});

const rawResponse = await fetch('http://192.168.1.5:9000/api/contrats/upload', {
  method: 'POST',
  body: formData,
  headers: {
    Accept: 'application/json',
    'Content-Type': 'multipart/form-data; charset=utf-8',
    },
});


const content = await rawResponse.json();

console.log(content);

服务器端

var storage = multer.diskStorage({
  destination: (req, file, cb) => {
    
 
    cb(null, __basedir + '/resources/static/assets/uploads');
    
  },
  filename: (req, file1, cb) => {
    console.log("file : ", file);
    let name = file.originalname || file.name;
    let extension = name.substr((~-name.lastIndexOf(".") >>> 0) + 2);
    let filename = generateId() +"."+ extension;                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                       nsion;
    cb(null, filename)

  },


});

var upload = multer({
  storage: storage,
  limits: {
    fileSize: 1024 * 1024 * 5
  }
});

结果

【问题讨论】:

  • 不要删除文件前缀的第三个斜杠。只需替换 file://
  • @AbdumutalAbdusamatov 我遇到了同样的错误!!
  • @AbdumutalAbdusamatov 请你帮我解决这个问题?

标签: javascript node.js react-native expo multer


【解决方案1】:

试试下面的

      let body = new FormData();
       let filename = uri.split('/').pop();
       body.append('file',  {uri:uri, name:filename, type:'image/jpg', });
       const header = {
           'Accept': 'application/json',
           'content-type': 'multipart/form-data',
         }
           fetch("http://192.168.1.5:9000/api/contrats/upload", {
               method: 'POST',
               headers: header,
               body:body,
           }).then(response => response.json())
            .then(res => console.log(res))
            .catch(err => console.log("err", err)

【讨论】:

  • 上帝保佑你@harisu,你拯救了我的一天。谢谢你^_^
猜你喜欢
  • 2018-06-08
  • 2017-06-29
  • 2018-11-24
  • 1970-01-01
  • 1970-01-01
  • 2014-10-25
  • 1970-01-01
  • 2019-03-26
  • 1970-01-01
相关资源
最近更新 更多