产品CRUD接口500内部服务器错误：删除功能失效求助

你的删除功能失效并返回500错误，核心原因有两个：

1. API路由导出不符合Next.js规则 #

Next.js的API路由文件必须默认导出处理函数，你当前用的是命名导出handleDelete，导致服务器无法识别并加载处理逻辑，直接返回500错误——这也是服务器控制台没有错误日志的原因：你的后端代码根本没被执行。

2. 参数获取方式不匹配 #

前端通过URL query参数传递ID（/api/deleteProduct?id=${id}），但后端尝试从req.params中提取ID，两者不匹配，即使导出问题解决，也会因获取不到ID导致删除失败。

修改步骤 #

第一步：修复API路由导出与参数获取（api/deleteProduct.js）

将命名导出改为默认导出，并修正ID的获取方式：

import Product from '../../models/Products';
import { initMongoose } from '../../lib/mongoose';

initMongoose();

// 改为默认导出处理函数
export default async function handler(req, res) {
  if (req.method === 'DELETE'){
    try {
      // 从query中获取ID，而非params
      const id = req.query.id;
      if (!id) {
        return res.status(400).json({ message: 'Product ID is required' });
      }
      
      const product = await Product.findByIdAndRemove(id);
      if (!product) {
        return res.status(404).json({ message: 'Product not found' });
      }
      return res.status(200).json({ message: 'Product deleted successfully' });
    } catch (error) {
      console.log(error);
      return res.status(500).json({ message: 'Database error' });
    }
  } else {
    // 处理非DELETE请求
    res.setHeader('Allow', ['DELETE']);
    return res.status(405).json({ message: `Method ${req.method} Not Allowed` });
  }
}

第二步：优化前端调试逻辑（pages/newProduct.js）

你的前端handleDelete逻辑本身没问题，但可以添加更详细的错误打印，方便排查：

const handleDelete = async (id) => {
  try {
    const res = await axios.delete(`/api/deleteProduct?id=${id}`);
    console.log(res.data.message);
    setProducts(products.filter(product => product._id !== id));
  } catch (error) {
    // 打印具体错误信息
    console.error('删除失败:', error.response?.data?.message || error.message);
  }
};

额外优化建议 #

如果希望遵循RESTful风格，改用URL params传递ID（比如/api/deleteProduct/[id]），可以按以下方式调整：

1. 在api目录下创建deleteProduct/[id].js文件
2. 后端从req.params.id获取ID
3. 前端请求改为await axios.delete(/api/deleteProduct/${id})

内容的提问来源于stack exchange，提问作者Rip Rip