React-native-uploader Android Errors

Question

I'm currently trying to debug a react-native package ( react-native-uploader ) I'm using to try and upload a bundle of files (photos). Despite working on ios, the current implementation is returning the following error for android:

Response{protocol=http/1.1, code=405, message=Method Not Allowed, url=${config.apiBase}/load/${this.props.id}/uploadconfirmation}

The error is originating from this line in the package:

Response response = client.newCall(request).execute();

Where the client is:

private final OkHttpClient client = new OkHttpClient()

Where request is:

Request{method=POST, url=${config.apiBase}/load/${this.props.id}/uploadconfirmation, tag=null}

I've successfully made posts to the endpoint using formdata:

    let tData = new FormData();
    const that = this;

    tData.append("confirmation_doc", {
      uri: files[0].filepath,
      type: "image/jpeg",
      name: "confirmation_doc.jpg",
    });    

    axios.post(
      `${config.apiBase}/load/${this.props.id}/uploadconfirmation`,
           tData
    )
    .then(response => {
        Alert.alert(
          "Success",
          "Uploaded Successfully!",
          [{ text: "OK", onPress: () => that.props.close() }],
          { cancelable: false }
        );
    });

I've tried looking through the source code to determine where things are falling apart and it seems like everything is posting as it should (headers look good, method looks good, endpoint looks good). I'm not all too familiar with Java so any input would be appreciated.

Answer 1

HTTP 405 Method Not Allowed ... is a client-side error.

The method received in the request-line is known by the origin server but not supported by the target resource.

if the JavaScript works, but the Java won't... you might be looking for the MultipartBuilder

... in combination with MediaType.FORM .

Answer 2

In order to solve this issue, I had to abandon the react-native-uploader package I had been using. Below is how I managed to resolve the issue:

let tData = new FormData();

this.state.selectedImages.forEach((item, i) => {
  tData.append("doc[]", {
    uri: item.uri,
    type: "image/jpeg",
    name: item.filename || `filename${i}.jpg`,
  });
});

fetch(`${config.apiBase}/load/${this.props.id}/uploadconfirmation`, {
  method: "post",
  headers: {
    Accept: "application/x-www-form-urlencoded",
    Authorization: `Token ${this.props.token}`,
  },
  body: tData,
})
  .then(res => res.json())
  .then(res => {
    Alert.alert(
      "Success",
      "Uploaded Successfully!",
      [{ text: "OK", onPress: () => that.props.close() }],
      { cancelable: false }
    );
  })
  .catch(err => {
    console.error("error uploading images: ", err);
  });