NodeJS - FormData将未定义的值发送到服务器

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了NodeJS - FormData将未定义的值发送到服务器相关的知识,希望对你有一定的参考价值。

我正在尝试使用Form-Data和axios将数据发送到服务器,但它会发送未定义的值

用于检测我试图在服务器中记录所有值并在客户端记录formdata但服务器记录的未定义值和客户端记录的空对象在这里是我的代码

客户:

 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)
        }
    }
 })
}

和服务器:

 //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
  })
 }
})

和日志是:

name undefined time undefined portion undefined ingredients undefined method undefined level undefined tags undefined

有什么问题?我怎么能解决它

答案

upload.single('image')可能会过滤掉请求正文,因为它不是图像内容类型,但从评论看来问题可能在其他地方。

检查它看起来像append似乎是为表单字段添加二进制实体vs set - 请参阅axios post request to send form data

以上是关于NodeJS - FormData将未定义的值发送到服务器的主要内容,如果未能解决你的问题,请参考以下文章

如何将未更改的值发送到 gwt RequestFactory 中的服务器?

React - Axios 正在将未定义的文件数据发送到节点服务器

Firebase 函数 - 发送推送并收到错误消息“TypeError:无法将未定义或 null 转换为对象”[关闭]

插入并放入nodeJs + express api时,带有Redux Saga的Axios不发送表单数据

为什么我的文件数组没有附加到FormData?

文件未在 Ajax 请求中使用 FormData 发送