PUT 400（错误请求）HTTP 错误状态 400

Question

我正在尝试使用此功能更新我的库存数量，它显示 PUT 400（错误请求）。在我后面的终端中，我插入了一个 console.log 来确认是否收到了 PUT 请求，并表示该请求已收到。我还尝试使用 POSTMAN 检查后端是否收到 PUT 请求

仪表板.jsx

const Dashboard = () => {
  const [productStocks, setProductStocks] = useState([]);

  const handleUpdateStock = (
    productID,
    productStock,
    quantityToAdd,
    quantityToRemove
  ) => {
    if (productStock !== undefined) {
      const body =
        quantityToAdd !== undefined ? { quantityToAdd } : { quantityToRemove };

      fetch(`http://localhost:8081/updateStock/${productID}`, {
        method: 'PUT',
        headers: {
          'Content-Type': 'application/json',
        },
        body: JSON.stringify(body),
      })
        .then((response) => {
          if (!response.ok) {
            throw new Error(`HTTP error! Status: ${response.status}`);
          }
          return response.json();
        })
        .then((data) => {
          console.log('Update response:', data);
          setProductStocks((prevProductStocks) => {
            const updatedProductIndex = prevProductStocks.findIndex(
              (product) => product.productID === productID
            );
            const updatedProductStocks = [...prevProductStocks];
            updatedProductStocks[updatedProductIndex] = {
              ...updatedProductStocks[updatedProductIndex],
              productStock: data.updatedStock,
            };
            return updatedProductStocks;
          });
        })
        .catch((error) => console.error('Error updating stock', error));
    } else {
      console.error('productID is undefined');
    }
  };
};

这包含返回语句

return (
    <div className='div1'>
      <h1>Product Stocks</h1>
      <ul>
        {productStocks.map((product, index) => (
          <li key={index}>
            <strong>ID:</strong> {product.productID}, 
            <strong>Name:</strong> {product.productName}, 
            <strong>Stock:</strong> {product.productStock}
            <button onClick={() => handleUpdateStock(product.productID, product.productStock, 1)}>
              <MdAdd className="add-icon" /> /*am i passing the wrong arguments here? */
            </button>
            <button onClick={() => handleUpdateStock(product.productID, product.productStock, undefined, 1)}>
              <MdRemove className="remove-icon" />
            </button>
          </li>
        ))}
      </ul>
      </div>
    );
    };

这是我的app.js

app.put('/updateStock/:productStock', (req, res) => {
    const { quantityToAdd, quantityToRemove } = req.body;
    const productStock = req.params.productStock;
  
    console.log('PUT request received:', req.body);
  
    if (isNaN(productStock) || isNaN(quantityToAdd) || isNaN(quantityToRemove) ||
      productStock < 0 || quantityToAdd < 0 || quantityToRemove < 0) {
      return res.status(400).json({ error: 'Invalid request. Parameters must be non-negative numbers.' });
    }
  
    const updateQuery = `
        UPDATE product 
        SET productStock = GREATEST(0, productStock ${quantityToAdd !== undefined ? '+' + quantityToAdd : '- ' + quantityToRemove})
        WHERE productStock = ?`;
  
    db.query(updateQuery, [productStock], (err, result) => {
      if (err) {
        console.error('Error updating stock:', err.message);
        return res.status(500).json({ error: 'Internal Server Error', details: err.message });
      }
      const selectQuery = 'SELECT productID, productName, productStock FROM product WHERE productStock = ?';
      db.query(selectQuery, [productStock], (err, updatedResult) => {
        if (err) {
          console.error('Error fetching updated stock:', err.message);
          return res.status(500).json({ error: 'Internal Server Error', details: err.message });
        }
        return res.json({ success: true, message: 'Stock quantity updated successfully.', updatedStock: updatedResult[0].productStock });
      });
    });
  });

我还认为我的 app.js 中有错误。

你能帮我解决这个问题吗？

我尝试过仅使用productID直接更改库存数量，但是，它也说请求错误。我预计 ProductStock 的值会增加/减少。

Answer 1

const body =
  quantityToAdd !== undefined ? { quantityToAdd } : { quantityToRemove };

查看您为请求构建的

body

。它只有 quantityToAdd

 或 

quantityToRemove

 之一，但您的路线处理程序检查两者都是正数。如果检查到位，验证总是会失败。

您可能想将验证更改为这样的

let validRequest = !(isNaN(productStock) || productStock < 0);
if (quantityToAdd !== undefined) {
  validRequest &&= !(isNaN(quantityToAdd) || quantityToAdd < 0);
} else if (quantityToRemove !== undefined) {
  validRequest &&= !(isNaN(quantityToRemove) || quantityToRemove < 0);
} else {
  validRequest = false;
}

if (!validRequest) {
  return res
    .status(400)
    .json({
      error: "Invalid request. Parameters must be non-negative numbers.",
    });
}