Nextjs14 Middleware not receiving session, when using dockerized nextjs (local development)

[nilsertle]

🏗️ Environment

• Supabase local
• Nextjs14 with app router and docker compose
• Google OAuth

Nextjs Docker

FROM node:18 AS base

WORKDIR /app

COPY package*.json ./

RUN npm ci

COPY . .

RUN npm run build

# Production image
FROM node:18 AS production

WORKDIR /app

COPY --from=base /app ./

EXPOSE 3000

CMD ["npm", "start"]

Nextjs docker-compose.yaml

version: "3.8"

services:
  frontend:
    container_name: frontend
    build:
      context: .
      dockerfile: Dockerfile
      target: base
    ports:
      - "3000:3000"
    volumes:
      - .:/app
      - /app/node_modules
      - /app/.next
    environment:
      - NODE_ENV=development
    command: npm run dev

Fetching from supabase

When fetching data from supabase on the client side I use NEXT_PUBLIC_SUPABASE_URL_CLIENT_LOCAL and when fetching from server side I use NEXT_PUBLIC_SUPABASE_URL_SERVER_LOCAL. This normally works successful except within the middleware.

NEXT_PUBLIC_SUPABASE_URL_CLIENT_LOCAL=http://172.0.0.1:54321
NEXT_PUBLIC_SUPABASE_URL_SERVER_LOCAL=http://host.docker.internal:54321

🚨 Problem

Expected Behaviour

When I fetch the user in the middleware, I expect to receive the user.

nextjs middleware.ts for supabase

import { createServerClient } from "@supabase/ssr";
import { NextResponse, type NextRequest } from "next/server";

export async function updateSession(request: NextRequest) {
  let supabaseResponse = NextResponse.next({
    request,
  });
  const supabase = createServerClient(
    process.env.NEXT_PUBLIC_SUPABASE_URL_SERVER_LOCAL!,
    process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY_LOCAL!,
    {
      cookies: {
        getAll() {
          return request.cookies.getAll();
        },
        setAll(cookiesToSet) {
          cookiesToSet.forEach(({ name, value, options }) =>
            request.cookies.set(name, value),
          );
          supabaseResponse = NextResponse.next({
            request,
          });
          cookiesToSet.forEach(({ name, value, options }) =>
            supabaseResponse.cookies.set(name, value, {
              ...options,
              httpOnly: true,
              sameSite: "lax",
              path: "/",
            }),
          );
        },
      },
    },
  );

  // IMPORTANT: Avoid writing any logic between createServerClient and
  // supabase.auth.getUser(). A simple mistake could make it very hard to debug
  // issues with users being randomly logged out.

  const {
    data: { user },
  } = await supabase.auth.getUser();

  const restrictedUrls = ["/profile", "/purchased-itineraries", "/payment"];
  if (
    !user &&
    restrictedUrls.some((url) => request.nextUrl.pathname.startsWith(url))
  ) {
    const url = request.nextUrl.clone();
    url.pathname = "/sign-in";

    return NextResponse.redirect(url);
  }

  // IMPORTANT: You *must* return the supabaseResponse object as it is. If you're
  // creating a new response object with NextResponse.next() make sure to:
  // 1. Pass the request in it, like so:
  //    const myNewResponse = NextResponse.next({ request })
  // 2. Copy over the cookies, like so:
  //    myNewResponse.cookies.setAll(supabaseResponse.cookies.getAll())
  // 3. Change the myNewResponse object to fit your needs, but avoid changing
  //    the cookies!
  // 4. Finally:
  //    return myNewResponse
  // If this is not done, you may be causing the browser and server to go out
  // of sync and terminate the user's session prematurely!

  return supabaseResponse;
}

❌ What happens instead

The cookies are successfully retrieved but ⚠️❌⚠️the session is not set⚠️❌⚠️. Hence the session and user is null, even though the cookies are set.

Can someone please help me figure out why this is happening and how to fix it? I also could not find a single example on the internet which uses Docker nextjs + supabase locally. By the way, when using the hosted version of supabase it works fine, because I am accessing the public url and don't need the host.docker.internal anymore.

[LeNei]

I'm currently facing the same Issue. Is there any way to work around this?