Next.js Discord

Discord Forum

Struggling with API routes and vercel

Unanswered
Chinese perch posted this in #help-forum
Open in Discord
Chinese perchOP
I have been struggling to get my api routes to work correctly for me on vercel. If I take it to its most basic route that looks like this:

api/test/route.ts
import { NextResponse } from 'next/server'

// eslint-disable-next-line import/prefer-default-export
export const POST = async (req: Request) => {
  return NextResponse.json({ foo: 'bar' })
}


and call it locally with postman I get back my foo bar. If I push to vercel and call it with postman I am getting a 500 with this stack trace:
- error TypeError [ERR_INVALID_URL]: Invalid URL
    at new NodeError (node:internal/errors:399:5)
    at new URL (node:internal/url:560:13)
    at NextRequestAdapter.fromNodeNextRequest (/var/task/node_modules/next/dist/server/web/spec-extension/adapters/next-request.js:36:19)
    at NextRequestAdapter.fromBaseNextRequest (/var/task/node_modules/next/dist/server/web/spec-extension/adapters/next-request.js:20:35)
    at RouteHandlerManager.handle (/var/task/node_modules/next/dist/server/future/route-handler-managers/route-handler-manager.js:26:57)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async doRender (/var/task/node_modules/next/dist/server/base-server.js:936:38)
    at async cacheEntry.responseCache.get.incrementalCache.incrementalCache (/var/task/node_modules/next/dist/server/base-server.js:1162:28)
    at async /var/task/node_modules/next/dist/server/response-cache/index.js:99:36 {
  input: '/api/test',
  code: 'ERR_INVALID_URL'
}


What am I doing wrong? any hints would be greatly appreciated.

8 Replies

@Chinese perch I have been struggling to get my api routes to work correctly for me on vercel. If I take it to its most basic route that looks like this: api/test/route.ts import { NextResponse } from 'next/server' // eslint-disable-next-line import/prefer-default-export export const POST = async (req: Request) => { return NextResponse.json({ foo: 'bar' }) } and call it locally with postman I get back my foo bar. If I push to vercel and call it with postman I am getting a 500 with this stack trace: - error TypeError [ERR_INVALID_URL]: Invalid URL at new NodeError (node:internal/errors:399:5) at new URL (node:internal/url:560:13) at NextRequestAdapter.fromNodeNextRequest (/var/task/node_modules/next/dist/server/web/spec-extension/adapters/next-request.js:36:19) at NextRequestAdapter.fromBaseNextRequest (/var/task/node_modules/next/dist/server/web/spec-extension/adapters/next-request.js:20:35) at RouteHandlerManager.handle (/var/task/node_modules/next/dist/server/future/route-handler-managers/route-handler-manager.js:26:57) at process.processTicksAndRejections (node:internal/process/task_queues:95:5) at async doRender (/var/task/node_modules/next/dist/server/base-server.js:936:38) at async cacheEntry.responseCache.get.incrementalCache.incrementalCache (/var/task/node_modules/next/dist/server/base-server.js:1162:28) at async /var/task/node_modules/next/dist/server/response-cache/index.js:99:36 { input: '/api/test', code: 'ERR_INVALID_URL' } What am I doing wrong? any hints would be greatly appreciated.
joulev
your code looks good, i don't see anything wrong here... can you give me a minimal reproduction repository?
Chinese perchOP
ok let me do just that
give me 10 min
Chinese perchOP
ok that was a really good idea, thank you. Created a minimal reproduction repository and it works. I must have some middleware creating havoc and I didn't realise.
joulev
now at least you know where things are wrong, time to debug
Chinese perchOP
So @joulev I'm still struggling to figure out what is going on with my codebase. To add to the mystery if I make it a get request I am able to get a response. If I make it a post request I get a 500, if I add in both a post and a get I get 500's for both. I know it's an absolute shot in the dark and without actually spending time looking at the code base it's probably hard to guess, but do you by any chance have any hunches? It wasn't the middleware either
joulev
Do you have fetch("/api/test") anywhere in your application?
(Or axios.get("/api/test") or similar)