Server code fetching its own API routeServer code fetching its own API route

Why it matters

A Server Component, Server Action or route handler that fetches this app's /api route makes an extra HTTP hop through the network and a second serverless invocation, and a relative URL fails on the server.

Fix

Import and call the function behind the route handler directly.

Credit

• 

  From Vercel

  The next-best-practices skill says to fetch data directly in Server Components instead of calling this app's own API route.

References

• next-best-practices: Data patternsVercel (vercel-labs/next-skills)
• Fetching DataNext.js
• Route HandlersNext.js

See it

Related rules

• next/fetch-in-effectData fetching in an effect
• data/await-in-loopAwait inside a loop