Not working with latest next 13

[suil]

Somehow it's not working with latest project structure that are generated by npx create-next-app@latest

[echeng8]

@suil works for me, what's your middleware.ts like? I just copied the one from examples.

[phsantiago]

Error: The Edge Function "middleware" is referencing unsupported modules: 22:55:26.396 | - next: stream, fs, url, path

// middleware.js
import { createNextAuthMiddleware } from 'nextjs-basic-auth-middleware'

export const middleware = createNextAuthMiddleware(options)

export const config = {
    matcher: ['/(.*)'], // Replace this with your own matcher logic
}

"nextjs-basic-auth-middleware": "^3.1.0",

[myrkytyn]

@phsantiago Did you declare options? What version of Next.JS you are using?

const options = {
  users: [{ name: "username", password: "password" }],
};

[phsantiago]

@myrkytyn sorry, I deleted the repo, so I'm not sure about the version, I think it was 13.4 because was a brand new installation. I did not declare options.

I could make it work but with a different implementation in another repo:

"next": "12.2.12",

//middleware.js
import { NextResponse } from "next/server";

import checkBasicAuth from "@utils/middleware/checkBasicAuth";

export function middleware(request) {
  if (
    !checkBasicAuth(request.headers.get("authorization"), {
      username: process.env.AUTH_USERNAME,
      password: process.env.AUTH_PASSWORD,
    })
  ) {
    return NextResponse.rewrite(
      `${request.nextUrl.protocol}//${request.nextUrl.host}/401`,
      {
        status: 401,
        headers: {
          "WWW-Authenticate": 'Basic realm="Secure Area"',
        },
      },
    );
  }

  return NextResponse.next();
}

[feenn]

The middleware.ts/js of NextJS 13 must be placed in the root directory, and it will not work if placed under src.