title: How to get absolute URL in production?
body: <p>The problem I'm facing is that I'm unable to get the absolute URL in the production build when using <code>getStaticPaths</code> and <code>getStaticProps</code></p>
  <pre><code>export async function getStaticPaths() {
    const url =
      process.env.NODE_ENV === &quot;development&quot;
        ? &quot;http://localhost:3000&quot;
        : &quot;https://websitename.vercel.app&quot;;
    const res = await fetch(`${url}/api/posts`);
    const posts = await res.json();
    console.log(&quot;posts: &quot;, posts);
  
    const paths = posts.map(({ slug }) =&gt; ({
      params: { slug },
    }));
  
    console.log(&quot;Paths: &quot;, paths);
  
    return { paths, fallback: false };
  }
  
  export async function getStaticProps({ params }) {
    console.log(&quot;params: &quot;, params);
    const url =
      process.env.NODE_ENV === &quot;development&quot;
        ? &quot;http://localhost:3000&quot;
        : &quot;https://websitename.vercel.app&quot;;
    const res = await fetch(`${url}/api/post`, {
      method: &quot;POST&quot;,
      body: params.slug,
    });
    const post = await res.json();
  
    return {
      props: { post },
    };
  }
  </code></pre>
  <p>It works fine in the development build but when it comes to production it fails because the hardcoded <code>https://websitename.vercel.app</code> is not the one generated by <code>vercel</code>. The URL generated by <code>vercel</code> is something like this <code>websitename-q1hdjf6c2.vercel.app</code>.</p>
  <p>How do I fix this?</p>