I've try some solution on stackoverflow about this problem but there is no way out. This is my error on debugger : RED = Image File Details | BLUE = Error
Im using react-native-image-picker and axios on this case. There is my code on sign up (to call API for register user)
const API_HOST = {
url: 'http://skripsibackend.test:8081/api',
};
export const signUpAction =
(dataRegister, photoReducer, navigation) => dispatch => {
Axios.post(`${API_HOST.url}/register`, dataRegister)
.then(res => {
console.log('data success: ', res.data);
if (photoReducer.isUploadPhoto) {
const photoForUpload = new FormData();
photoForUpload.append('files', photoReducer);
Axios.post(`${API_HOST.url}/user/photo`, photoForUpload, {
headers: {
Authorization: `${res.data.data.token_type} ${res.data.data.access_token}`,
'Content-Type': 'multipart/form-data',
},
})
.then(resUpload => {
console.log('success upload: ', resUpload);
})
.catch(error => {
showMessage('Photo Upload Failed ');
console.log('image failed: ', error.response);
});
} else {
() => {};
}
dispatch(setLoading(false));
showMessage('Register Success', 'success');
navigation.replace('SignUpSuccess');
})
.catch(err => {
dispatch(setLoading(false));
console.log('sign up error: ', err.response);
showMessage('Error Sign Up');
});
};
then, this is my photoReducer code :
export const photoReducer = (state = initPhoto, action) => {
if (action.type === 'SET_PHOTO') {
return {
...state,
uri: action.value.uri,
type: action.value.type,
name: action.value.name,
};
}
if (action.type === 'SET_UPLOAD_STATUS') {
return {
...state,
isUploadPhoto: action.value,
};
}
return state;
};
I've try to remove multipart/form-data from content-type, so it can remove the error about "Missing Boundary in multipart/form-data". Yeah, it can remove that error but stil came another error, that is "The File field is required".
As u can see on my error image from debugger, on the RED LINE it was the information about the picture I've upload.
I've test the API to upload photo using postman, and it works. so I think there is no problem on my API. I've stuck for 2 days on this error. Any idea for this one? :)