How to send multiple data at once using Fetch Blob react native?

问题:

I'm using react-native-fetch-blob module to handle image upload, I currently pass only the image data to the POST method, but is there any way to extend this by passing a custom data object?

In the server side, it reads the image data base64, I crop & resize the image and return the image URL to my app. With that image URL i have to do another HTTP POST to the server with the form data + the image URL I just got.

I was wondering if there's any chance to send all the data (including image data) at once instead of doing 2 separate POST requests.

Here's the code:

uploadFile([           { name: 'uploaded_picture',             type: 'image/png',             filename: 'picture.png',             data: this.state.imageUploadData           }         ]) 

This is the uploadFile implementation, which is the one that gives you as an example in the module page.

import RNFetchBlob from 'react-native-fetch-blob'; Constants = require('../utils/constants');  let uploadFile = (data) => {   return RNFetchBlob.fetch('POST', Constants.UPLOAD_URL, {     Authorization : "Bearer access-token",     'Content-Type' : 'multipart/form-data',   }, data); }  module.exports = uploadFile; 

And here, I handle the server side request:

app.route('/upload')     .post(function (req, res, next) {         var fstream;         var serverObject = server.address();         var serverUrl = serverObject.address + ':' + serverObject.port;          console.log(req);         req.pipe(req.busboy);         req.busboy.on('file', function (fieldname, file, filename) {             console.log("Uploading: " + filename);              //Path where image will be uploaded             var filename = new Date().getTime() + '_' + filename;             fstream = fs.createWriteStream(__dirname + '/public/images/' + filename);             file.pipe(fstream);             fstream.on('close', function () {                 console.log("Upload Finished of " + filename);                 gm(__dirname + '/public/images/' + filename)                 .resize('400', '300', '^')                 .gravity('Center')                 .crop('400', '300')                 .write(__dirname + '/public/images/' + filename, function(err) {                   if (!err) {                       console.log('Resized image successfully: ' + filename);                       res.json(                         {                             image_url: 'http://' + serverUrl + '/images/' + filename                         });                        // Instead of sending a response back with image URL, I would like to save my formData directly here.                   }                 });             });         });     } ); 

Any suggestion on how can I achieve this with FetchBlob? I know I can pass multiple files/data because it's an array, but I wouldn't have access to that imageURL anymore, right? So that wouldn't fit my needs.

Thanks in advance.

文章来源: How to send multiple data at once using Fetch Blob react native?