I was able to upload the image using the react native code given below when I use the localhost url with my php application. However When I host the php application to the server, all the other API's are working from the react native application except the fileupload. When I debug the response received by react native application from the server, it shows as below.
{"name":"avatar.png","type":"","tmp_name":"","error":1,"size":0}
The react-native code used for the file upload is given below.
upload(){
const body = new FormData();
body.append('uid', 1);
body.append('image', {
uri: this.state.avatarSource.uri,
type: this.state.avatarSource.type,
name: this.state.avatarSource.fileName,
size:this.state.avatarSource.fileSize
})
fetch(config.API_URL+"/upload/image/1", {
method: 'POST',
body: body
})
.then(res => res.text())
.then((responseJson) => {
console.log(responseJson);
})
.catch((error) => {
console.log(error);
});
}
addPhotos(){
ImagePicker.showImagePicker(options, (response) => {
console.log('Response = ', response);
if (response.didCancel) {
console.log('User cancelled image picker');
} else if (response.error) {
console.log('ImagePicker Error: ', response.error);
} else {
const source = response;
console.log(source);
this.setState({
avatarSource: source
});
}
});
}
I have tried the following option as well to get the uri and this works in the localhost as above code.
source = { uri: response.uri.replace('file://', '')}
What am I missing here? Do I have to add any configurations or settings in the ios manifest or anywhere else to get this working with remote server?
NOTE: I have tested the remote server code directly with postman and the image uploading is working. Its not working only in the react native application once its hosted.
