I am getting such Kind Of Problem : Uncaught (in promise) SyntaxError: Unexpected end of JSON input

Question

I am using react js and using mongo db. i am trying to get data by fetch. but i get this type of error : Uncaught (in promise) SyntaxError: Unexpected end of JSON input

const [product, setProduct] = useState({});
useEffect(() => {
  const url = `http://localhost:5000/product/${id}`;
  fetch(url)
    .then((res) => res.json())
    .then((data) => setProduct(data));
}, [id]);

Answer 1

Your code in useEffect is correct the reason you may be getting this error is because of

1. There is no JSON data from the backend
2. Maybe the JSON you received is not proper JSON

you can confirm this by replacing res.json() with res.text() and then console.log it