React Native 上传图片失败

Question

I am struggling from the past 2 days to crack the file/image upload with React Native to MongoDB. I literally read all the related forums but there is no luck. I read couple of forums and they gave a sample example but I wasn't succeeded. Here are the sample codes that I wrote.

Client Side :

 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);

Server Side

 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 } });

Result

Answer 1

Try out the below

      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)