i am trying to send data to server with Form-Data and axios but it sends undefined values
for detecting that i tried to log all values in server and log formdata in client but server logged undefined values and client logged empty object here is my code
Client:
handleFormSubmission(e) {
e.preventDefault();
var Data = new FormData();
Data.append('image', this.fileRef.current.files[0])
Data.append('name', this.state.name);
Data.append('time', this.state.time);
Data.append('portion', this.state.portion);
Data.append('ingredients', JSON.stringify(this.state.ingredients));
Data.append('method', this.state.method);
Data.append('level', this.state.level);
Data.append('tags', JSON.stringify(this.state.tagsToSend));
axios.post('/api/post-recipe', Data, {
headers: {
'Content-Type': 'multipart/form-data'
}
}).then(res => res.data)
.then(data =>{
console.log(data.dish)
})
.catch(err => {
if(err.response){
if(err.response.data.redirect === true){
window.location.replace(err.response.data.location)
}
if(err.response.data.message){
alert(err.response.data.message)
}
}
})
}
And Server:
//multer part
const storage = multer.diskStorage({
destination: (req, file, callback) => {
const userPath = path.join(imgStoragePath, req.userId);
fs.mkdir(
userPath,
() => callback(null, userPath)
)
},
filename: (req, file, callback) => {
const filenameParts = file.originalname.split('.');
const ext = filenameParts.pop();
const basename = filenameParts.join('.');
const additionalPath = Date.now() + '' + uuid() + '' +
Math.floor(Math.random() * (2000 - 500)) + 500;
callback(null, basename + '-' + additionalPath + '.' + ext);
}
})
const upload = multer({
storage,
limits: '1mb',
})
//route handling (i have validation in comments because there are some bugs too and i am concentrated on this problem)
router.post('/', upload.single('image'), async (req, res) => {
try {
const {
name,
time,
portion,
ingredients,
method,
level,
tags
} = req.body
const { filename } = req.file;
/* if (!req.file) {
return res.status(409).send({
message: 'გთხოვთ აირჩიოთ მინიმუმ 1 ფოტო'
})
}
if (name.trim().length < 1) {
return res.status(409).send({
message: 'მიუთითეთ კერძის სახელი'
})
}
if (time.trim().length < 1) {
return res.status(409)({
message: 'მიუთითეთ მომზადების დრო'
})
}
if (!numberToTest.test(time)) {
return res.status(409).send({
message: 'დრო ჩაწერეთ ციფრების საშუალებით'
})
}
if (portion.trim().length < 1) {
return res.status(409).send({
message: 'მიუთითეთ პორციის რაოდენობა'
})
}
if (!numberToTest.test(portion)) {
return res.status(409).send({
message: 'პორცია ჩაწერეთ ციფრების საშუალებით'
})
}
JSON.parse(ingredients).map(({
ingredient,
quantity
}) => {
if (ingredient.trim().length < 1 || quantity.trim().length < 1) {
return res.status(409).send({
message: 'მიუთითეთ ინგრედიენტები სრულად'
})
}
})
if (method.trim().length < 20) {
return res.status(409).send({
message: '"მომზადების მეთოდი"-ს ველში უნდა იყოს მინიმუმ 20 ასო'
})
}
if (!level == 'მარტივი' || level == 'საშუალო' || level == 'რთული') {
return res.status(409).send({
message: 'მიუთითეთ კერძის მომზადების სირთულე'
})
}
if (JSON.parse(tags).length < 1) {
return res.status(409).send({
message: 'მიუთითეთ მინიმუმ 1 მონიშვნა (თეგი)'
})
}
/*fs.readFile('../tags.json', 'utf8', function (err, content) {
if (err) {
return res.status(500).send({
message: err.message
})
}
const decodedContent = JSON.parse(content)
if (!decodedContent.tags.includes(JSON.parse(tags))) {
return res.status(409).send({
message: 'მიუთითეთ ჩვენს მიერ შემოთავაზებული მონიშვნები (თეგები)'
})
}
})*/
/* var duplicateTagsGuard = Object.create(null);
for (var co = 0; co < tags.length; co++) {
let val = tags[co];
if (val in duplicateTagsGuard) {
return res.status(409).send({
message: 'ნუ გამოიყენებთ ერთ მონიშვნას (თაგს) რამდენჯერმე'
})
}
duplicateTagsGuard[val] = true
}
*/
const user = await User.findById(req.userId, '-password -_id -email -loginAttmepts -lockUntil').lean();
const dish = await Dish.create({
author: user.username,
name: name,
time: time,
portion: portion,
ingredients: JSON.parse(ingredients),
method: method,
level: level,
tags: JSON.parse(tags),
createdAt: 'Date- ' + new Date().toLocaleDateString() + ' Time- ' + new Date().toLocaleTimeString()
})
console.log('დიში ' + dish.toObject())
return res.status(200).send({
dish: JSON.stringify(dish)
})
} catch (error) {
return res.status(500).send({
message: error.message
})
}
})
and log is:
name undefined time undefined portion undefined ingredients undefined method undefined level undefined tags undefined
what is problem? how can i solve it
