使用 http 時，req.body 為 empy {}。 發布在 angular 和 node.js

Question

這是我的 service.ts 文件

import { Injectable } from "@angular/core";
import { HttpClient } from "@angular/common/http";
import { Items } from "./inventory.model";
import { Router } from "@angular/router";


import { environment } from "../../../environments/environment";
const BACKEND_URL = environment.APIUrl + "/Items/";

@Injectable({
providedIn: "root",
})
export class InventoryService {
constructor(private http: HttpClient, private router: Router) {}

addItem(
itemNo: string,
itemName: string,
maker: string,
unitPrize: string,
sellingPrize: string,
Qty: string
) {



const ItemData = new FormData();
ItemData.append("itemNo", itemNo);
ItemData.append("item_name", itemName);
ItemData.append("maker", maker);
ItemData.append("unitPrize", unitPrize);
ItemData.append("sellingPrize", sellingPrize);
ItemData.append("Qty", Qty);


  this.http
  .post<{ message: string; items: Items }>(
    BACKEND_URL,
    ItemData
  )
  .subscribe((responseData) => {

     console.log(responseData);


  });

  }
  }

這是我在后端路由中的 item.js

const express = require("express");
const ItemController = require("../controllers/item");
const bodyParser = require('body-parser');
const router = express.Router();

router.post("", ItemController.savepost);

這是我在 Controller 中的 Item.js 文件

    const ItemModel = require('../models/item');

exports.savepost = (req, res, next) => {

  if(Object.keys(req.body).length === 0)
  {
    console.log(req.body);
  }


  const items = new ItemModel({

    item_no: req.body.itemNo,
    item_name: req.body.itemName,
    maker: req.body.maker,
    unitPrize: req.body.unitPrize,
    sellingPrice: req.body.sellingPrize,
    Qty: req.body.Qty,


  });


  console.log(items.item_no);


  items.save().then(addItem => {
        res.status(201).json({
          message: "Item added Successfully",
          items: {
            ...addItem,
            id: addItem._id
          }
        });
  }).catch(error => {

  res.status(500).json({

    message: error
  })
}
);

}

這是我的項目 model

const mongoose = require('mongoose');

const itemSchema = new mongoose.Schema({

  item_no: { type: String, required: true },
  item_name: { type: String, required: true },
  maker: { type: String, required: true },
  unitPrize: { type: Number, required: true },
  sellingPrice: { type: Number, required: true },
  Qty: { type: Number, required: true },



});

module.exports = mongoose.model('Items',itemSchema);

響應錯誤顯示這樣的消息

商品驗證失敗”，消息：“商品驗證失敗：item_no：需要路徑item_no 。，item_name：需要路徑item_name 。，maker：需要路徑maker 。，unitPrize：需要路徑unitPrize 。， sellPrice：需要路徑sellingPrice ., 數量：路徑Qty是必需的。",

Answer 1

把/放在你的路線上

router.post("/", ItemController.savepost);

在 app.js 中使用此代碼，因為您不解析 req.body

const bodyParser = require("body-parser");
app.use(bodyParser.urlencoded({ extended: false }));
app.use(bodyParser.json());

請嘗試以下代碼

const ItemData =  {
  itemNo,
  item_name,
  maker,
  unitPrize,
  sellingPrize,
  Qty
}
const headers = { 'content-type': 'application/json'}  
const body=JSON.stringify(ItemData);
this.http.post<{ message: string; items: Items }>(BACKEND_URL, body,{'headers':headers}).subscribe((responseData) => {
  console.log(responseData);
});

我測試了后端代碼，沒錯，問題是前端代碼中的post request，你可以查看post request 文檔

Answer 2

您發送 Object 數據而不以 JSON 格式進行解析。 所以在發送請求之前首先將其轉換為純 JSON。 您可以在 app.js 文件中添加此代碼后實現此目的。

app.use(bodyParser.json());