kevinzunigacuellar
commented
10 months ago Thanks for raising an issue, I didn't want to pollute the example with many packages. Perhaps I could include some glob matching pattern library given that they are very common when working with middleware.
Protected routes in middleware.ts will fail to identify the protected route if the protected route has a trailing "/" such as "/dashboard/"
In short:
if (protectedRoutes.includes(url.pathname)) will return true for "/dashboard" , but false for "/dashboard/", thus allowing access to the protected route.
You can either add both "/dashboard" and "/dashboard/" to your protected routes array, or add some code to remove all "/" from url.pathname, and then just put "dashboard" in your protected routes array.
This would work with the requested path being either /dashboard or /dashboard/
// remove the slash in the protected route array
const protectedRoutes = ["dashboard"];
// add .split with the .join to the url.pathname to remove all slashes from the url.pathname
if (protectedRoutes.includes(url.pathname.split('/').join("")))