时间戳

首页 > 解决方案 > Req.body 是空对象，TypeError：

javascript - Req.body 是空对象，TypeError：

问题描述

错误：

TypeError: Cannot destructure property 'firstName' of 'req.body.warranty' as it is undefined.

我试图通过本文档https://www.npmjs.com/package/multer处理 MulterError ，但遇到了问题。

Console.log(req.body) 给出 { }，而 form enctype 等于 'multipart/form-data'。如果我将其更改为 'application/x-www-form-urlencoded' req.body 是正常的，但文件不会上传到服务器。

多用途

var storage = multer.diskStorage({
  destination:"./public/uploads/",
  filename:(req,file,cb)=>{
    cb(null,file.fieldname+"-"+Date.now()+path.extname(file.originalname));
  }
});

var upload = multer({
  storage: storage,
  limits:{fileSize: 10000000}
}).fields([{
           name: 'purchasePhoto', maxCount: 1
         }, {
           name: 'defectPhoto', maxCount: 1
         }]);

使用表格 enctype="multipart/form-data" 从保修页面发布路线

router.post("/warranty", function(req, res){

  upload(req, res, function (err) {
    if (err instanceof multer.MulterError) {
      req.flash('error', 'Multer Error');
      return res.redirect('/pages/warranty#flash');
    } else if (err) {
      console.log('error');
    }
  });

 var  { firstName, lastName, streetAdress, city, state, zip, country, email, phoneNumber, product, bikeShop, assembledBy, issue} = req.body.warranty;

   var newWarranry = { purchasePhoto: purchasePhoto, defectPhoto: defectPhoto, firstName: firstName, lastName: lastName, streetAdress: streetAdress, city: city, state: state, zip: zip, country: country, email: email, phoneNumber: phoneNumber, product: product, bikeShop: bikeShop, assembledBy: assembledBy, issue: issue};
   
  if ( !firstName || !lastName || !streetAdress || !city || !state || !zip || !country || !email || !phoneNumber || !product || !bikeShop || !assembledBy ) {
    req.flash('error', 'Please enter all of the fields with "*"');
    return res.redirect('/pages/warranty#flash');
  } else{
    Warranty.create(newWarranry, function(err, newWarranry){
      if(err){
          console.log(err);
      }else{
         console.log(newWarranry);
         req.flash('success', 'Thank you! The form was submitted successfully.');
         return res.redirect('/pages/warranty#flash');
      }
    });
  } 
});

带有 action="warranty" method="post" 和 enctype="multipart/form-data" 的保修页面表单。所有带有 name="warranty[...]" 的输入

<form action="warranty" method="post" enctype="multipart/form-data">
    <b>Warranty Claim Form</b>
    <h6>Rider Info</h6>
    <div class="row">
        <div>
            <input type="" name="warranty[firstName]" placeholder="First Name*">
        </div>
        <div>
            <input type="" name="warranty[lastName]" placeholder="Last Name*">
        </div>
        <div>
            <input type="" name="warranty[streetAdress]" placeholder="Street Adress*">
        </div>
        <div>
            <input type="" name="warranty[streetAdressLine]" placeholder="Street Adress Line 2">
        </div>
        <div>
            <input name="warranty[city]" placeholder="City*">
        </div>
        <div>
            <input type="" name="warranty[state]" placeholder="State/Province*">
        </div>
        <div>
            <input type="" name="warranty[zip]" placeholder="ZIP/Postal code*">
        </div>
        <div>
            <input type="" name="warranty[country]" placeholder="Country*">
        </div>
        <div>
            <input type="" name="warranty[email]" placeholder="Email*">
        </div>
        <div>
            <input type="" name="warranty[phoneNumber]" placeholder="Phone Number*">
        </div>
    </div>
        <h6>Product Details</h6>
    <div class="row">
        <div>
            <input name="warranty[product]" placeholder="Product (Ex. Titan II Frame)*">
        </div>
        <div>
            <input type="" name="warranty[color]" placeholder="Color (Ex. Black)">
        </div>
        <div>
            <input type="" name="warranty[size]" placeholder="Size (Ex. 20.5in / 175mm)">
        </div>
        <div>
            <input type="" name="warranty[serialNumber]" placeholder="Serial number or date code (bikes, frames, forks, bars, cranks only)">
        </div>
    </div>
    <h6>PURCHASE & ASSEMBLY DETAILS</h6>
    <div class="row">
        <div >
            <input name="warranty[bikeShop]" placeholder="Bike Shop or online retailer*">
        </div>
        <div>
            <input type="" name="warranty[modelYear]" placeholder="Model year (Ex.2015)">
        </div>
        <div >
            <input type="" name="warranty[assembledBy]" placeholder="Assembled by myself/ bike shop">
        </div>
    </div>
    <h6>PRODUCT ISSUE/DEFECT INFORMATION</h6>
    <div class="row">
        <div>
            <textarea name="warranty[issue]"></textarea>
        </div>
    </div>
    <h6>UPLOAD PROOF OF PURCHASE OR RECEIPT (SCAN OR MOBILE PHOTO)</h6>
    <div>
     
    <input type="file" name="purchasePhoto" id="fileOne">
    <label for="fileOne">
      <span>Upload file</span>
    </label>
   
  </div>
    <h6>UPLOAD PRODUCT IMAGES, INCLUDING IMAGES OF DEFECTS</h6>
    <div class="form-group">
    
    <input type="file" name="defectPhoto" id="fileTwo">
    <label for="fileTwo">
      <span>Upload file</span>
    </label>
  </div>
  <div>
    <button type="submit"><p>Submit</p></button>
  </div>
</form>

标签： javascriptnode.jsexpressmulter

解决方案

将您的代码向上移动到 multer callack

router.post("/warranty", function(req, res) {
  upload(req, res, function(err) {
    if (err) {
      req.flash("error", "Multer Error");
      return res.redirect("/pages/warranty#flash");
    }
    var {
      firstName,
      lastName,
      streetAdress,
      city,
      state,
      zip,
      country,
      email,
      phoneNumber,
      product,
      bikeShop,
      assembledBy,
      issue
    } = req.body.warranty;

    var newWarranry = {
      purchasePhoto: purchasePhoto,
      defectPhoto: defectPhoto,
      firstName: firstName,
      lastName: lastName,
      streetAdress: streetAdress,
      city: city,
      state: state,
      zip: zip,
      country: country,
      email: email,
      phoneNumber: phoneNumber,
      product: product,
      bikeShop: bikeShop,
      assembledBy: assembledBy,
      issue: issue
    };

    if (
      !firstName ||
      !lastName ||
      !streetAdress ||
      !city ||
      !state ||
      !zip ||
      !country ||
      !email ||
      !phoneNumber ||
      !product ||
      !bikeShop ||
      !assembledBy
    ) {
      req.flash("error", 'Please enter all of the fields with "*"');
      return res.redirect("/pages/warranty#flash");
    } else {
      Warranty.create(newWarranry, function(err, newWarranry) {
        if (err) {
          console.log(err);
        } else {
          console.log(newWarranry);
          req.flash(
            "success",
            "Thank you! The form was submitted successfully."
          );
          return res.redirect("/pages/warranty#flash");
        }
      });
    }
  });
});

推荐阅读