Vite proxy: use VITE_API_URL from .env, forward Host/Proto for NIP-98

Made-with: Cursor

frontend/package-lock.json

@@ -18,6 +18,7 @@
       },
       "devDependencies": {
         "@types/canvas-confetti": "^1.9.0",
+        "@types/node": "^22.10.0",
         "@types/react": "^18.3.12",
         "@types/react-dom": "^18.3.1",
         "@types/react-router-dom": "^5.3.3",
@@ -1247,6 +1248,16 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/@types/node": {
+      "version": "22.19.13",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-22.19.13.tgz",
+      "integrity": "sha512-akNQMv0wW5uyRpD2v2IEyRSZiR+BeGuoB6L310EgGObO44HSMNT8z1xzio28V8qOrgYaopIDNA18YgdXd+qTiw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "undici-types": "~6.21.0"
+      }
+    },
     "node_modules/@types/prop-types": {
       "version": "15.7.15",
       "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.15.tgz",
@@ -2134,6 +2145,13 @@
         "node": ">=14.17"
       }
     },
+    "node_modules/undici-types": {
+      "version": "6.21.0",
+      "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-6.21.0.tgz",
+      "integrity": "sha512-iwDZqg0QAGrg9Rav5H4n0M64c3mkR59cJ6wQp+7C4nI0gsmExaedaYLNO44eT4AtBBwjbTiGPMlt2Md0T9H9JQ==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/update-browserslist-db": {
       "version": "1.2.3",
       "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.2.3.tgz",

frontend/package.json

@@ -18,6 +18,7 @@
     "react-router-dom": "^7.13.1"
   },
   "devDependencies": {
+    "@types/node": "^22.10.0",
     "@types/canvas-confetti": "^1.9.0",
     "@types/react": "^18.3.12",
     "@types/react-dom": "^18.3.1",

frontend/tsconfig.node.json

@@ -3,7 +3,8 @@
     "target": "ES2022",
     "lib": ["ES2023"],
     "module": "ESNext",
-    "skipLibCheck": true
+    "skipLibCheck": true,
+    "types": ["node"]
   },
   "include": ["vite.config.ts"]
 }

frontend/vite.config.ts

@@ -1,7 +1,27 @@
-import { defineConfig } from "vite";
+import { defineConfig, loadEnv } from "vite";
 import react from "@vitejs/plugin-react";
 
-export default defineConfig({
+/** Proxy config that forwards client Host/Proto so NIP-98 URL validation matches. */
+function proxyToBackendWithForwarded(backendTarget: string) {
+  return {
+    target: backendTarget,
+    changeOrigin: true,
+    configure: (proxy) => {
+      proxy.on("proxyReq", (proxyReq, req) => {
+        const host = (req.headers.host as string) || "";
+        const proto = (req.headers["x-forwarded-proto"] as string) || "http";
+        proxyReq.setHeader("X-Forwarded-Host", host);
+        proxyReq.setHeader("X-Forwarded-Proto", proto);
+      });
+    },
+  };
+}
+
+export default defineConfig(({ mode }) => {
+  const env = loadEnv(mode, process.cwd(), "");
+  const backendTarget = env.VITE_API_URL || "http://localhost:3001";
+
+  return {
     plugins: [react()],
     build: {
       sourcemap: false,
@@ -22,16 +42,17 @@ export default defineConfig({
       port: 5173,
       proxy: {
         "/api": {
-        target: "http://localhost:3001",
+          target: backendTarget,
           changeOrigin: true,
           rewrite: (path) => path.replace(/^\/api/, ""),
         },
-      "/claim": { target: "http://localhost:3001", changeOrigin: true },
-      "/auth": { target: "http://localhost:3001", changeOrigin: true },
-      "/user": { target: "http://localhost:3001", changeOrigin: true },
-      "/config": { target: "http://localhost:3001", changeOrigin: true },
-      "/stats": { target: "http://localhost:3001", changeOrigin: true },
-      "/deposit": { target: "http://localhost:3001", changeOrigin: true },
+        "/claim": proxyToBackendWithForwarded(backendTarget),
+        "/auth": proxyToBackendWithForwarded(backendTarget),
+        "/user": proxyToBackendWithForwarded(backendTarget),
+        "/config": { target: backendTarget, changeOrigin: true },
+        "/stats": { target: backendTarget, changeOrigin: true },
+        "/deposit": { target: backendTarget, changeOrigin: true },
       },
     },
+  };
 });