Middleware works locally, doesn't run at all when deployed to Vercel

[bstro]

Astro Info

Astro                    v4.0.3
Node                     v21.1.0
System                   macOS (x64)
Package Manager          yarn
Output                   server
Adapter                  @astrojs/vercel/serverless
Integrations             none

If this issue only occurs in one browser, which browser is a problem?

No response

Describe the Bug

Trying to deploy my Astro app to vercel. I wrote a middleware that implements basic HTTP authentication.

When I run my app locally on the astro dev server, everything works as expected—the user/password prompt appears and if I enter the correct credentials, I am forwarded to the correct page.

When I deploy to Vercel, there is no authentication at all, as if the middleware isn't being run.

What's the expected result?

Middleware should behave identically whether I am running the project locally or when deploying to Vercel.
Stackblitz: https://stackblitz.com/~/github.com/bstro/github-pw6m1w (note the Auth required response)
Deployment: https://github-pw6m1w.vercel.app/ (note that the middleware doesn't seem to run at all)

Link to Minimal Reproducible Example

https://stackblitz.com/~/github.com/bstro/github-pw6m1w

Participation

• I am willing to submit a pull request for this issue.

[ematipico]

You're right, the middleware gets generated, but I can't see the edge middleware file being generated. This is very weird.

[ematipico]

@bstro I further checked, and it seems that we are emitting the edge middleware correctly, and it seems to be a Vercel issue where it doesn't run the file middleware.mjs. (although middleware.js works)

I'll keep you posted.

My advice for now it to not use the edge middleware feature for now, although not sure sure it that would work for you.

[Mokto]

What if we run something like : babel --plugins @babel/plugin-transform-modules-commonjs .vercel/output/functions/render.func/dist/middleware.mjs > .vercel/output/functions/render.func/dist/middleware.js ? To transform the file back into something vercel can understand.

[ematipico]

What if we run something like : babel --plugins @babel/plugin-transform-modules-commonjs .vercel/output/functions/render.func/dist/middleware.mjs > .vercel/output/functions/render.func/dist/middleware.js ? To transform the file back into something vercel can understand.

You could try it on your local environment, but I think Vercel must support this format. After all they support it for their normal functions.

[lilnasy]

Switching middleware.mjs to middleware.js made no difference. It doesn't seem to be part of Vercel's build output API at all.

A comment in the relevant part of the adapter points to the convention of middleware.js in vercel docs. However, the docs talk about the middleware file in root, next to astro.config.mjs. However, the code puts that file inside the compiled function instead.

Sure enough, putting the middleware in project root works.

...but not before it complained about being bundled incorrectly...

...which makes me wonder how edge middleware ever worked, if it did - vercel expects the edge middleware to be its own function in this format which we never created.