0

Whenever I try to deploy my next.js application to Vercel, it is giving me a

FetchError: request to http://localhost:3000/api/post failed, reason: connect ECONNREFUSED 127.0.0.1:3000

  return (
    <HomeContainer>
      <HeaderContainer>
        <ImageWrapper>
          <NextImage src={heroBG} layout="fill" objectFit="cover" priority />
        </ImageWrapper>
        <Title>TECHNOLOGY FOR INOVATORS</Title>
        <SubTitle>Where Developers Push Limits</SubTitle>
        
        
      </HeaderContainer>
      <Blog posts={posts} />
    </HomeContainer>
  );
};

export const getServerSideProps = async () => {
 
  const res = await fetch("http://localhost:3000/api/post");
  const posts = await res.json();
  
  return {
    props: { posts },
  };
};

export default home;

Now I know you are supposed to use Vercel's domain url they provide you instead of localhost:3000.

export const getServerSideProps = async () => {
 
  const res = await fetch("http://myapp.vercel.app/api/post");
  const posts = await res.json();
  
  return {
    props: { posts },
  };
};

Still giving me the same error. Is there something I am not doing correctly?

Tim
  • 1
  • You shouldn't be calling your internal API route in `getServerSideProps`. Instead, you want to use the logic that's in your API route directly. See [Internal API fetch with getServerSideProps? (Next.js)](https://stackoverflow.com/questions/65752932/internal-api-fetch-with-getserversideprops-next-js). – juliomalves Sep 13 '22 at 22:24

0 Answers0