我不明白为什么我在这个代码中收到 404 错误，用于在产品上制作 coment

问：

这是 Node 和 express 和 mongoDB atlas，有人可以帮我吗？

我不知道为什么会出现 404 错误

我尝试用 json 来做到这一点，但它执行了相同的 404 错误

这是 MongoDB 模型

// CommentModel.js
import mongoose from 'mongoose';

const commentSchema = new mongoose.Schema({
  text: { type: String, required: true },
  user: { type: mongoose.Schema.Types.ObjectId, ref: 'User', required: true },
  product: {
    type: mongoose.Schema.Types.ObjectId,
    ref: 'Product',
    required: true,
  },
});

const Comment = mongoose.model('Comment', commentSchema);

export default Comment;

这是路

import express from 'express';
import mongoose from 'mongoose';
import bodyParser from 'body-parser';
import Comment from '../models/commentModel.js'; // Assurez-vous du chemin correct

const commentRoutes = express.Router();

// Utiliser le middleware body-parser pour traiter le texte brut
commentRoutes.use(bodyParser.text());

// Endpoint pour ajouter un commentaire
commentRoutes.post('/api/comments/create', async (req, res) => {
  const text = req.body;

  try {
    const newComment = new Comment({ text });
    await newComment.save();
    res.status(201).send('Commentaire ajouté avec succès'); // Envoyer une réponse de texte brut
  } catch (error) {
    console.error(error);
    res.status(500).send('Erreur serveur');
  }
});

// Endpoint pour récupérer tous les commentaires
commentRoutes.get('/api/comments', async (req, res) => {
  try {
    const comments = await Comment.find();
    // Au lieu de res.json(comments), utilisez res.send() pour envoyer du texte brut
    res.send(comments.map((comment) => comment.text).join('\n'));
  } catch (error) {
    console.error(error);
    res.status(500).send('Erreur serveur');
  }
});

export default commentRoutes;

和组件

import React, { useState, useEffect } from 'react';

function CommentSection() {
  const [comments, setComments] = useState([]);
  const [newComment, setNewComment] = useState('');

  useEffect(() => {
    // Charger les commentaires depuis le serveur lors du montage du composant
    fetch('/api/comments')
      .then((response) => response.json())
      .then((data) => setComments(data))
      .catch((error) =>
        console.error('Erreur lors du chargement des commentaires', error)
      );
  }, []);

  const handleCommentSubmit = () => {
    // Valider que le commentaire n'est pas vide
    if (!newComment.trim()) {
      console.error('Le commentaire ne peut pas être vide');
      return;
    }

    // Envoyer le commentaire au serveur sous forme de texte brut
    fetch('/api/comments/create', {
      method: 'POST',
      headers: {
        'Content-Type': 'text/plain', // Utiliser 'text/plain' pour indiquer que vous envoyez du texte brut
      },
      body: newComment,
    })
      .then((response) => {
        if (!response.ok) {
          throw new Error(`Erreur HTTP! Statut: ${response.status}`);
        }
        return response.text(); // Traiter la réponse comme du texte brut
      })
      .then((data) => {
        // Traiter la réponse selon vos besoins (éventuellement, mettre à jour l'état, etc.)
        console.log('Réponse du serveur:', data);
        // Exemple : mettre à jour l'état des commentaires avec la réponse du serveur
        const updatedComments = [...comments, { text: data }];
        setComments(updatedComments);
        setNewComment('');
      })
      .catch((error) =>
        console.error("Erreur lors de l'envoi du commentaire", error)
      );
  };

  return (
    <div>
      <h2>Comments</h2>
      <ul>
        {comments.map((comment, index) => (
          <li key={index}>{comment.text}</li>
        ))}
      </ul>
      <textarea
        rows="4"
        cols="50"
        placeholder="Add a comment..."
        value={newComment}
        onChange={(e) => setNewComment(e.target.value)}
      />
      <button onClick={handleCommentSubmit}>Submit</button>
    </div>
  );
}

export default CommentSection;

我希望显示客户评论

我尝试使用JSON，但这是相同的错误