req.body n'est pas défini lors de l'utilisation de la méthode DELETE dans Next.js

Question

Je ne sais pas vraiment pourquoi, mais lorsque j'essaie d'obtenir les données et de les mettre dans le corps de la réponse, il est indiqué non défini (dans la console). J'ai deux composants presque identiques. L'un utilise la méthode POST et renvoie un corps rempli, l'autre utilise la méthode DELETE et renvoie un corps non défini. J'utilise l'architecture Prisma.

Il s'agit d'un POST qui peut être exécuté et renvoie le corps de l'API

export default function Product({
  id_product,
  name,
  link_image,
  price,
}: ProductProps) {
  const [test, testing] = useState(false);
  const { push: relocate } = useRouter();

  const onAddToCart = async () => {

    let response = await fetch("/api/addToCart", {
      method: "POST",
      headers: { "Content-Type": "application/json" },
      body: JSON.stringify({
        id_product: id_product,
      }),
    });

    if (response.ok) {
      toast.success(`${name} was added to the cart`);
    } else {
      toast.error(`${name} is already in your cart`);
    }
  };

C'est le début de l'API de cette fonction, const { id_product } = req.body est valide.

async function handlePost(req: NextApiRequest, res: NextApiResponse) {
    const session = await getServerSession(req, res, authOptions);
    const client = connexion()
    const { id_product } = req.body;
 
    const user = await client.user.findFirst({
        where: { email: session?.user?.email || undefined}
    })

    let cart = await client.cart.findFirst({
        where: {id_user: user?.id_user}
    })

C'est le problème que j'ai, les composants sont fondamentalement les mêmes sauf pour la méthode :

type ProductProps = products;

export default function ProductItem({
  id_product,
  description,
  publication_date,
  author,
  name,
  link_image,
  price,
}: ProductProps) {
  const onDeleteFromCart = async () => {
    let data = {
      id_product: id_product
    }
    let response = await fetch("/api/deleteFromCart", {
      method: "DELETE",
      headers: { "Content-Type": "application/json" },
      body: JSON.stringify(data),
    });
    if (response.ok) {
        toast.success(`${name} was succesfully removed from your cart`)
    }
    else {
        toast.error(`Error`);
      }
  };

Il s'agit d'une API, const {id_product} = req.body n'est pas défini

async function handleDelete(req: NextApiRequest, res: NextApiResponse) {
    const session = await getServerSession(req, res, authOptions);
    const client = connexion()
    const  { id_product } = req.body
console.log(id_product)
    const user = await client.user.findFirst({
        where: { email: session?.user?.email || undefined}
    });
 
    let cart = await client.cart.findFirst({
        where: {id_user: user?.id_user}
    });
    let cart_item = await client.cart_item.findFirst({
        where: {
            id_cart: cart?.id,
            id_product: id_product
        }
    })

J'essaie de résoudre ce problème depuis quelques heures maintenant sans aucun progrès.

Answer 1

Cela a fonctionné jusqu'à la dernière mise à jour. Il y a beaucoup de questions sur GIthub, mais je ne sais pas si les responsables de Next.js ont encore répondu. Actuellement, cela nous empêche de mettre à jour. Je sais que ce n'est pas typique, mais il s'agit d'un changement radical pour Next.js et je ne veux pas migrer tous les points de terminaison DELETE :(.

https://github.com/vercel/next.js/issues/49353

https://github.com/vercel/next.js/issues/48096

https://github.com/vercel/next.js/issues/48898

Answer 2

delete 请求不包含正文，如果您需要在此请求中包含正文，可以尝试使用 patch Méthode