OPTIONS not handled when Origin header is present

Bug report

NextJS simply ignores any OPTIONS request that has Origin in the header and won’t execute the function.

Describe the bug

After Following the documentation and implementing the middleware to handle cors, it seems seems like it gets triggered ONLY when there’s no Origin header in the OPTIONS request.

In other words, put a console.log at the beginning of the function (before cors middleware). Send an OPTIONS request without Origin in the headers, see the log. Now add Origin (any value) and the log doesn’t even show up. The function was not executed.

To Reproduce

1. Start with a fresh NextJS app
2. Follow the documentation
3. Use Postman to send an OPTIONS request and see the cors middleware returning the right response
4. Add Origin in the headers (to simluate a browser) and watch as the api function doesn’t get called.

Expected behavior

NextJS should allow me to handle CORS requests.

Screenshots

System information

• OS: macOS
• Browser Postman (or any browser)
• Version of Next.js: 9.3.5
• Version of Node.js: 13.8.0

Additional context

I already submitted an issue here https://github.com/zeit/next.js/issues/11478 but it was swiftly closed.

[seveibar]

I created a reproduction of NextJS rewriting CORS here: https://github.com/hello-seam/nextjs-rewrites-break-cors/tree/main

This is problematic for companies leveraging NextJS for APIs

[kawmra]

I found the codes causing this bug.

https://github.com/vercel/next.js/blob/6cd1c874519b615ee5ca246c2497e166fc969a5f/packages/next/server/hot-reloader.ts#L57-L67

This function doesn’t consider rewrite rules and simply adds fixed CORS headers.

The problem only occurs on the dev server with rewrite rules that rewrite non-API paths to API paths, so you can workaround the problem by starting the server (next build && next start) instead of starting the dev server (next dev).