Sending a image to backend server

Hey there. I am trying to send a image which i get from the response and send it via fetch to my server.

 UIImagePickerManager.showImagePicker(options, (didCancel, response) => {
        console.log('Response = ', response);
        if (didCancel) {
            console.log('User cancelled image picker');
        }
        else {
            var fileName = response.uri.substring(response.uri.lastIndexOf("/") + 1);
            var fsPath = response.uri;
            var binaryResponse = response.data;
            fetch('http://XXXX/user/avatar', {
                method: 'POST', // default 'POST',support 'POST' and 'PUT'
                headers: {
                    'Authorization': AuthStore.getUserTokenWithBearer()
                },
                body: JSON.stringify({image: fsPath})
            }).then(function (response) {
                console.log(response)
            }).catch(function(error){
                console.log(error);
            });
        }

I know this isn´t a modules issue, but trying to find solution from stackoverflow or any other sources failed. Maybe someone has tried this with this component and success?

[haitaoli]

@ShanthiSenguttuvan grab the url from image picker, then try this:

const xhr = new XMLHttpRequest();

xhr.onload = () => {
  if (xhr.status < 400) {
    // succeeded
  } else {
    const error = new Error(xhr.response);
  }
};

xhr.onerror = (error) => {
};

xhr.open('PUT', uploadURL);
xhr.setRequestHeader('content-type', contentType);
xhr.send({ uri: imageURI });

Update: this is client code for uploading image to your server. If your question is about how to get image content on server side, then you can refer to nodejs documentation.

[yfuks]

Hello ! I don’t really understand what is your problem but i can give you an example, in the folowing example i post an image to cloudinary using fetch, fileUpload is still a good solution !

var _ = require('underscore');
let { UIImagePickerManager: ImagePickerManager } = NativeModules;
var sha1 = require('sha1');

 UIImagePickerManager.showImagePicker(options, (didCancel, response) => {
       console.log('Response = ', response);
       if (didCancel) {
           return console.log('User cancelled image picker');
       }
       var url = 'https://api.cloudinary.com/v1_1/' + cloud_name + '/image/upload';
       var header = {
            method: 'post',
            headers: {
              'Accept': 'application/json',
              'Content-Type': 'application/json'
           }
       };
      var timestamp = Date.now();

      var values = {
       file: 'data:image/png;base64,' + response.data,
       api_key: api_key,
       timestamp: timestamp,
       tags: tags,
       signature: sha1("tags=" + tags + "&timestamp=" + timestamp + api_secret)
     };

     var request = _.extend({
        body: JSON.stringify(values)
     }, header);

     fetch(url, request)
         .then((response) => response.json())
         .then((data) => {
      console.log(data);
    })
    .catch((err) => { console.log(err) });}
}