err: [AxiosError: Request failed with status code 400]
I have run react native app on virtual machine or physical machine and it gives error.
I run the application on ip localhost
Client using Axios and FormData
const App = () => {
const baseUrl = "http://192.168.3.222:5000/"
const [singleFile, setSingleFile] = useState();
const uploadVideo = async () => {
if (singleFile != null) {
console.log({ singleFile })
console.log('Uri: ', singleFile.uri)
const formdata = new FormData();
formdata.append('video', singleFile);
console.log(formdata);
axios({
method: "POST",
url: `${baseUrl}uploadvideo`,
headers: {
'Content-Type': 'multipart/form-data; ',
},
data: formdata,
})
.then(res => console.log(res.data))
.catch(err => console.log("err: ", err));
} else {
alert('Please Select File first');
}
};
const selectFile = async () => {
try {
console.log("btn selectfile click")
const res = await DocumentPicker.pickSingle({
type: [DocumentPicker.types.allFiles],
presentationStyle: 'fullScreen',
copyTo: 'cachesDirectory'
});
setSingleFile(res);
} catch (err) {
setSingleFile(null);
if (DocumentPicker.isCancel(err)) {
alert('Canceled');
} else {
alert('Unknown Error: ' + JSON.stringify(err));
throw err;
}
}
};
Server using Flask in python
@app.route('/uploadvideo', methods=['POST'])
def upload2():
video = request.files['video']
video.save('data/training_data/video/' + video.filename)
return video.filename
when i send request from Postman no error occurs.
2
Answers
headers: { 'Content-Type': 'multipart/form-data', },
not
headers: { 'Content-Type': 'multipart/form-data; ', },
I think you should change ‘Content-Type’ of your request’s header to ‘application/json’