How to fetch inside getStaticProps from the same domain.

[yassinebridi]

I'm trying to fetch inside a getStaticProps:

const res = await fetch(`http://localhost:3000/api/posts/read/${params.slug}`)

from the same domain as the client, using vercel functions.

the problem is that i need change localhost with the corresponding deployment domain.

and there is no way to know the deployment domain since vercel gives an arbitrary domain name.
So at build time nextjs needs to know what domain vercel gave it.

this is probably not the best approach, since i'm gonna change the domain later.

if only there was a way to pass relative url to fetch, like what SWR does.
if there is an alternative to fetch like this, that would be awesome

[rafaelalmeidatk]

Update:
You can call your API code directly in the data-fetching methods, Next won't include this code in the browser bundle. Extract the API logic into a function and export it, then in your page you can import and use it:

// pages/api/posts/read/[slug].js
export function findPost(slug) {
  return db.findPost(slug)
}

export default async (req, res) => {
  const { query: { slug } } = req
  
  const post = await findPost(slug)

  res.json({ post })
}

// pages/post/[slug].js
import { findPost } from '...' // the path to the API file

export async function getStaticProps({ params }) {
  const post = await findPost(params.slug)

  return {
    props: { post },
  }
}

[yassinebridi]

Thanks interesting,
the only problem is that i'm using getStaticPaths too, and they can't work toghether.

[rafaelalmeidatk]

I see, in this case you would have to export the function from your API file and call it directly from the data-fetching methods, and this will be faster than making the request. More details: #11210 (comment)

[yassinebridi]

I think that's better, thanks for your help.

[lfades]

Next.js removes server side code from your browser build, you can safely access server side code inside your pages (like a DB) instead of having to call a serverless function, that will give you better results than using the host header.

[yassinebridi]

That's what i did, thank you @lfades.