Pages router with middleware fetching json on navigation seemingly unnecessarily

[instaproadrian]

Summary

If I add middleware.ts (doesn't matter what the content of the middleware is, even the simplest middleware will make this happen) to my pages router app, every page (even ones with no getServerSideProps) suddenly starts behaving like a page with getServerSideProps and fetching pageName.json before navigating to it.

On localhost the response of this json is the HTML of the page I'm navigating to.

If deployed to Vercel it continues to make the request, but no longer returns HTML, returning what looks like {} as binary.

Am I doing something wrong? Or is this behaviour to be expected for some reason? Or is this a bug in NextJS? Does anyone know?

Additional information

Currently using as middleware


import { NextResponse } from "next/server";

export default function middleware() {
  return NextResponse.next()
}

so it shouldn't be doing anything fancy

### Example

https://github.com/instaproadrian/nextjs-middleware-bug/

[icyJoseph]

Uff my memory can be betraying me here, but this is like, imagine, you are at page A, and to go to page B, you have to be an authenticated user. Then you'd want to run the check as you transition to page B, and for that, middleware checks need to be performed. This is a specific case, but redirects, rewrites, etc, also fall into that.

So, in a way, I think the flow was like, there's middleware that matches the route you are going into, and that might imply that the navigation won't flow, we need to run the middleware (at the edge), to know, and that's why you see that.

Adding a matcher, should mean that, the unmatched routes stop making this additional request, could you test that?

[instaproadrian]

Thanks for replying! Yeah it doesn't do anything for unmatched routes if you add a matcher.

I suppose that kinda makes sense. The fact that it returns HTML in the JSON response on local definitely makes it feels a bit buggy!