0
 export const getServerSideProps = async () => {
      const res = await axios.get('http://localhost:3000/api/products');
      return {
        props: {
          kebabList: res.data
        }
      }
    };




    // get all the products
  if (method === "GET") {
    try {
      const products = await Product.find();
      res.status(200).json(products);
    } catch (err) {
      res.status(500).json(err);
    }
  }

When I first load the app it is showing this error Server Error Error: Request failed with status code 500

If I reload again then it works fine but after deploying on vercel the error is permanent

1
  • Is /api/products an internal API route? If so, you shouldn't be fetching data from it inside getServerSideProps. You should move the logic that's in the API route into getServerSideProps instead. See Internal API fetch with getServerSideProps? (Next.js). Commented Mar 22, 2022 at 19:14

1 Answer 1

1

When you have deployed your app on vercel, your API url might be changed http://localhost:3000 to http://your-domain(live-url).com.

    export const getServerSideProps = async () => {
      const res = await axios.get('http://your-domain(live-url).com/api/products'); //  please focus on this line. I belive you have messed up here
      return {
        props: {
          kebabList: res.data
        }
      }
    };

    // get all the products
  if (method === "GET") {
    try {
      const products = await Product.find();
      res.status(200).json(products);
    } catch (err) {
      res.status(500).json(err);
    }
  }
Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.