I'm trying to send data (files and json) to the server using fetch with react and redux.
My code is as follows :
export function saveUser(user){
return function(dispatch){
fetch(`${data.ROOT_URL}/save-user/`, {
method: 'post',
// body: How???
})
.then(response => {
if (response.status !== 200) {
console.log('Looks like there was a problem. Status Code: ' + response.status);
return;
}
console.log('You are successfully registered!: ' + response.status);
})
.catch(function (error) {
console.log(error);
});
}
}
And the user data is as follows :
Thus, I have one big objects with json data and files (photos, documents), but I'm not able to send it to the server.
Any suggestions?
EDIT
After adding
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify(user)
The rest of the data is ok, but for the files, where I should get uploaded files, I get only an empty object for the file which is uploaded. If the file isn't uploaded the value of file
is null as it should be.
"files":[
{"file_type":"statutenFile","values":{"active":false,"fileName":"Articles of Association","file":null}},
{"file_type":"blankLetterheadFile","values":{"active":false,"fileName":"Blank letterhead","file":null}},
{"file_type":"companyPhotoFile","values":{"active":false,"fileName":"Company photo","file":null}},
{"file_type":"idCardFile","values":{"active":true,"fileName":"check","file":{}}}
]
The last one idCardFile is uploaded but I get "file":{}