issues with uploading image file react native {"isTrusted": false} - ANDROID

Viewed 442

I am working with the above issue that has had me stymied for hours on Android. I am using: XMLHTTPRequest to upload an image file to my server. I have verified using document explorer in android that the image actually exists at the given uri.

I get xhr object as:

      {"DONE": 4, "HEADERS_RECEIVED": 2, "LOADING": 3, "OPENED": 1, "UNSENT": 0, "_aborted":
             false, "_cachedResponse": undefined, "_hasError": true, "_headers": {"accept": 
    "application/json", "authorization": "Bearer **********", "content-type": "multipart/form-data", "x-tenant": "EOG"}, 
"_incrementalEvents": false, "_lowerCaseResponseHeaders": {}, "_method": "POST", "_requestId": null, "_response": "Unrecognized FormData part.", "_responseType": "",
         "_sent": true, "_subscriptions": [], "_timedOut": false, "_trackingName": "unknown", "_url": 
        "*************/uploadFile", "readyState": 4, "responseHeaders": undefined, "status": 0, 
        "timeout": 0, "upload": {}, "withCredentials": true}

I noticed in the above object: "_response": "Unrecognized FormData part."

My code looks like:

   const {pic, kyc_document, kyc_identifier, kyc_expiry_date, ssn} = data;
    let xhr = new XMLHttpRequest();
    xhr.open(
      'POST',
      'https://**********/upload',
      true,
    );
    xhr.setRequestHeader('Authorization', `Bearer ${token}`);
    xhr.setRequestHeader('Content-Type', 'multipart/form-data');
    xhr.setRequestHeader('x-tenant', 'EOG');
    xhr.setRequestHeader('Accept', 'application/json');

    xhr.onerror = function (error) {
      console.log(xhr);
      console.log('ERROR -----------', error);
      console.log(pic);
    };
    let formData = new FormData();

    formData.append('kyc_type', 'identity');
    formData.append('kyc_document', kyc_document);
    formData.append('kyc_meta_data', {issuing_state: state});
    formData.append('kyc_identifier', kyc_identifier);
    formData.append('kyc_expiry_date', kyc_expiry_date);
    formData.append('kyc_file', {
        uri: pic.uri,
        type: 'image/jpeg',
        name: 'Id',
      });
    }
    try {
      xhr.send(formData);
    } catch (e) {
      console.log(e);
    }
  }
};

This is returning {"isTrusted": false}

The uri looks like "uri": "file:///data/user/0/com.mon.app/cache/Camera/e6c2ae90-a9a8-43aa-9e36-62c73a76f2ef.jpg"

my package details are:

"react": "16.11.0",
"react-native": "0.62.2",
0 Answers
Related