skip to Main Content

While trying to fetch images from cloudinary getting this error ‘TypeError: Failed to fetch’. Its a MERN project.

const fetchPosts = async () => {
  setLoading(true);

  try {
    const response = await fetch("http://localhost:8080/api/v1/post", {
      method: "GET",
      headers: {
        "Content-Type": "application/json",
      },
    });

    if (response.ok) {
      const result = await response.json();
      setAllPosts(result.data.reverse());
    }
  } catch (err) {
    alert(err);
  } finally {
    setLoading(false);
  }
};

3

Answers


  1. Chosen as BEST ANSWER

    My IP address wasn't added to mongodb, once it was added the issue got resolved.


  2. This is likely an issue with what you’re receiving from the backend. Check CORS headers, the HTTP method the backend expects, the URL, etc.

    See this link for some more possible answers:
    https://bobbyhadz.com/blog/javascript-typeerror-failed-to-fetch-cors

    Login or Signup to reply.
  3. Failed to fetch issue is the most probably because of CORS , please make sure that your backend should allow requests from your domain. Also please check the response that has been sending from backend api.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search