fix: use conditionally the right url for backend in nextjs frontend

.env

@@ -2,6 +2,4 @@
 NODE_ENV=development
 HOSTNAME=0.0.0.0
 FRONTEND_PORT=3000
-BACKEND_PORT=4000
+BACKEND_PORT=4000
-NEXT_PUBLIC_BACKEND_URL=http://localhost:4000
-CORS_ALLOWED_ORIGIN=http://localhost:3000

backend/server.ts

@@ -10,6 +10,10 @@ import { generateQRCode } from "./src/routes/generateqrcode.route";
 import { wordCounter } from "./src/routes/wordcounter.route";
 import { videoToAudio } from "./src/routes/videotoaudio.route";
 import { removeBG } from "./src/routes/removebg.route";
+import dotenv from "dotenv";
+import path from "node:path";
+
+dotenv.config({ path: path.resolve(__dirname, "../.env") });
 
 const app = Fastify({ logger: true });
 

frontend/Dockerfile

@@ -24,6 +24,7 @@ WORKDIR /app
 COPY --from=deps /app/node_modules ./node_modules
 COPY . .
 
+ENV NODE_ENV=production
 ARG NEXT_PUBLIC_BACKEND_URL
 ENV NEXT_PUBLIC_BACKEND_URL=$NEXT_PUBLIC_BACKEND_URL
 
@@ -62,4 +63,4 @@ EXPOSE 3000
 ENV PORT=3000
 ENV HOSTNAME="0.0.0.0"
 
-CMD echo "NEXT_PUBLIC_BACKEND_URL = $NEXT_PUBLIC_BACKEND_URL" && node server.js
+CMD node server.js

frontend/next.config.ts

@@ -1,9 +1,14 @@
 import type { NextConfig } from "next";
 
+const NEXT_PUBLIC_BACKEND_URL =
+  process.env.NODE_ENV === "production"
+    ? process.env.NEXT_PUBLIC_BACKEND_URL || ""
+    : "http://localhost:4000";
+
 const nextConfig: NextConfig = {
   output: "standalone",
   env: {
-    NEXT_PUBLIC_BACKEND_URL: process.env.NEXT_PUBLIC_BACKEND_URL,
+    NEXT_PUBLIC_BACKEND_URL: NEXT_PUBLIC_BACKEND_URL,
   },
 };