diff --git a/packages/app/next.config.js b/packages/app/next.config.js
index 7b09f39e0..91efbec5b 100644
--- a/packages/app/next.config.js
+++ b/packages/app/next.config.js
@@ -23,6 +23,7 @@ module.exports = withNextra({
   swcMinify: false,
   publicRuntimeConfig: {
     version,
+    serverUrl: process.env.NEXT_PUBLIC_SERVER_URL
   },
   productionBrowserSourceMaps: false,
   ...(process.env.NEXT_OUTPUT_STANDALONE === 'true'
diff --git a/packages/app/src/config.ts b/packages/app/src/config.ts
index 9eb5e7ad0..2ccbbd0e5 100644
--- a/packages/app/src/config.ts
+++ b/packages/app/src/config.ts
@@ -1,5 +1,10 @@
+import getConfig from 'next/config';
+
+const runtimeConfig = getConfig().publicRuntimeConfig;
 export const SERVER_URL =
-  process.env.NEXT_PUBLIC_SERVER_URL || 'http://localhost:8000'; // NEXT_PUBLIC_SERVER_URL can be empty string
+  runtimeConfig.serverUrl ||
+  process.env.NEXT_PUBLIC_SERVER_URL ||
+  'http://localhost:8000'; // NEXT_PUBLIC_SERVER_URL can be empty string
 
 export const HDX_API_KEY = process.env.HYPERDX_API_KEY as string; // for nextjs server
 export const HDX_SERVICE_NAME =