Next.js Discord

Discord Forum

middleware letting users accsess protected pages

Unanswered
Genio posted this in #help-forum
Open in Discord
GenioOP
Attached is my app dir

i want to protect /[lang]/(dashboard)/:path*

However my approach is not working no matter what i do.
This is my middle ware file. I am using a libary that allows me to add localization to my project
They provided me with this middleware that i adjusted (Added config) that would add localization to any url without it
import { NextResponse } from "next/server";
import type { NextRequest } from "next/server";
export { default } from "next-auth/middleware";
import { withAuth } from "next-auth/middleware"

import { i18n } from "./i18n.config";

import { match as matchLocale } from "@formatjs/intl-localematcher";
import Negotiator from "negotiator";

const getLocale = (request: NextRequest): string | undefined => {
  const negotiatorHeaders: Record<string, string> = {};
  request.headers.forEach((value, key) => {
    negotiatorHeaders[key] = value;
  });

  const locales = i18n.locales;
  const languages = new Negotiator({ headers: negotiatorHeaders }).languages();

  const locale = matchLocale(languages, locales, i18n.defaultLocale);
  return locale;
};

export function middleware(request: NextRequest) {
  
  const pathname = request.nextUrl.pathname;

  if (pathname === '/ar/login' || pathname === '/en/login') {
    return NextResponse.next();
  }
  const pathnameIsMissingLocale = i18n.locales.every(
    (locale) => !pathname.startsWith(`/${locale}/`) && pathname !== `/${locale}`
  );

  if (pathnameIsMissingLocale) {
    const locale = getLocale(request);
    return NextResponse.redirect(
      new URL(
        `/${locale}/${pathname.startsWith("/") ? "" : "/"}${pathname}`,
        request.url
      )
    );
  }

}

// export default withAuth({
//   // Matches the pages config in `[...nextauth]`
//   pages: {
//     signIn: '/ar/login',
//   }
// })
export const config = {
  matcher: [
    "/((?!api|_next/static|_next/image|favicon.ico).*)",
    "/ar/:path*",
    "/en/:path*",
  ],
};

3 Replies

GenioOP
route.ts file 
import { baseUrl } from '@/app/core/constants';
import { NextAuthOptions } from 'next-auth';
import NextAuth from 'next-auth/next';
import CredentialsProvider from 'next-auth/providers/credentials';
import { JWT } from "next-auth/jwt";
export const authOptions: NextAuthOptions = {
    secret: process.env.NEXTAUTH_SECRET,
    pages:{
        signIn: '/ar/login'
    },
    providers: [
        CredentialsProvider({
            name: 'Credentials',
            credentials: {
                email: {
                    label: 'email',
                    type: 'text',
                    placeholder: 'jsmith'
                },
                password: { label: 'Password', type: 'password' }
            },
            async authorize(credentials, req) {
                if (!credentials?.email || !credentials?.password)
                    return null;
                const { email, password } = credentials;
                const res = await fetch(baseUrl + '/admins/login', {
                    method: 'POST',
                    body: JSON.stringify({
                        email,
                        password
                    }),
                    headers: {
                        'Content-Type': 'application/json'
                    }
                });
                if (res.status == 401) {
                    return null;
                }
                if (res.status == 404) {
                    return null;
                }
                const user = await res.json();
                return user;
            }
        })
    ],
    callbacks: {
        async jwt({ token, user }) {
            if (user) {
                return { ...token, ...user };
            }
            return token;
        },
    async session({ session, token }) {
      session.admin = token.data.admin;
      session.accessToken = token.data.accessToken;
      session.refreshToken = token.data.refreshToken;
      return session;
    },
}
}
const handler = NextAuth(authOptions);

export { handler as GET, handler as POST };
GenioOP
Sorry i am new to the server, but this is my 3rd questions where i get no response. Am i asking my questions wrong or am i missing anything in my questions 😅
Thank you