nginx/nginx.conf

@@ -28,6 +28,8 @@ server{
     ssl_ciphers         HIGH:!aNULL:!MD5;
     
     set $backend_server 172.18.10.8:8080;
+    # 2-container model: FE nginx proxies to MeshCentral container by Docker service name
+    set $mesh_server meshcentral:8082;
     
     root /usr/share/nginx/html;
     # Default file to serve for directory requests
@@ -81,13 +83,42 @@ server{
         proxy_read_timeout 1h;
     }
 
-    location /mesh-proxy/ {
+    location /api/meshcentral/proxy/ {
-        proxy_pass https://202.191.59.59/; 
+        proxy_pass https://$mesh_server;
+        proxy_ssl_verify off;
         proxy_cookie_path / "/; HTTPOnly; Secure; SameSite=None";
-        
+
-        # Cấu hình WebSocket cho commander.ashx
+        proxy_set_header Host $host;
+        proxy_set_header X-Real-IP $remote_addr;
+        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+        proxy_set_header X-Forwarded-Proto $scheme;
+
+        # Cấu hình WebSocket/SSE cho MeshCentral
         proxy_http_version 1.1;
         proxy_set_header Upgrade $http_upgrade;
         proxy_set_header Connection "upgrade";
+        proxy_buffering off;
+        proxy_read_timeout 3600s;
+        proxy_send_timeout 3600s;
+    }
+
+    # FE production currently builds mesh proxy path as /meshapi/api/meshcentral/proxy/...
+    location /meshapi/api/meshcentral/proxy/ {
+        rewrite ^/meshapi/(.*)$ /$1 break;
+        proxy_pass https://$mesh_server;
+        proxy_ssl_verify off;
+        proxy_cookie_path / "/; HTTPOnly; Secure; SameSite=None";
+
+        proxy_set_header Host $host;
+        proxy_set_header X-Real-IP $remote_addr;
+        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+        proxy_set_header X-Forwarded-Proto $scheme;
+
+        proxy_http_version 1.1;
+        proxy_set_header Upgrade $http_upgrade;
+        proxy_set_header Connection "upgrade";
+        proxy_buffering off;
+        proxy_read_timeout 3600s;
+        proxy_send_timeout 3600s;
     }
 }

src/components/cards/computer-card.tsx

@@ -8,7 +8,7 @@ import { useGetClientFolderStatusForDevice } from "@/hooks/queries";
 import type { ClientFolderStatus } from "@/types/folder";
 import { Button } from "@/components/ui/button";
 import { getRemoteDesktopUrl } from "@/services/remote-control.service";
-import { BASE_URL } from "@/config/api";
+import { buildMeshProxyUrl } from "@/config/api";
 import { toast } from "sonner";
 export function ComputerCard({
   device,
@@ -52,11 +52,7 @@ export function ComputerCard({
       const response = await getRemoteDesktopUrl(device.id);
       const originalUrl = new URL(response.url);
       const pathAndQuery = originalUrl.pathname + originalUrl.search;
-      const cleanPath = pathAndQuery.startsWith("/")
+      const proxyUrlFull = buildMeshProxyUrl(pathAndQuery);
-        ? pathAndQuery.substring(1)
-        : pathAndQuery;
-      const baseWithoutApi = BASE_URL.replace("/api", "");
-      const proxyUrlFull = `${baseWithoutApi}/api/meshcentral/proxy/${cleanPath}`;
 
       setProxyUrl(proxyUrlFull);
       setShowRemote(true);

src/config/api.ts

@@ -1,12 +1,27 @@
 const isDev = import.meta.env.MODE === "development";
 
+const trimTrailingSlash = (value: string) => value.replace(/\/+$/, "");
+
 export const BASE_URL = isDev
   ? import.meta.env.VITE_API_URL_DEV
   : "/api";
 
 export const BASE_MESH_URL = isDev
-  ? import.meta.env.VITE_API_MESH_DEV
+  ? (import.meta.env.VITE_API_MESH || import.meta.env.VITE_API_MESH_DEV || "")
-  : "/meshapi";
+  : (import.meta.env.VITE_API_MESH || "");
+
+export const buildMeshProxyUrl = (meshPathAndQuery: string) => {
+  const cleanPath = meshPathAndQuery.startsWith("/")
+    ? meshPathAndQuery.substring(1)
+    : meshPathAndQuery;
+  const proxyPath = `/api/meshcentral/proxy/${cleanPath}`;
+
+  if (BASE_MESH_URL && BASE_MESH_URL.startsWith("http")) {
+    return `${trimTrailingSlash(BASE_MESH_URL)}${proxyPath}`;
+  }
+
+  return proxyPath;
+};
 
 export const API_ENDPOINTS = {
   AUTH: {

src/routes/_auth/remote-control/index.tsx

@@ -6,7 +6,7 @@ import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/com
 import { Input } from "@/components/ui/input";
 import { Button } from "@/components/ui/button";
 import { getRemoteDesktopUrl } from "@/services/remote-control.service";
-import { BASE_URL } from "@/config/api";
+import { buildMeshProxyUrl } from "@/config/api";
 
 
 export const Route = createFileRoute("/_auth/remote-control/")({
@@ -38,9 +38,7 @@ function RemoteControlPage() {
       // Chuyển URL MeshCentral thành proxy URL
       const originalUrl = new URL(data.url);
       const pathAndQuery = originalUrl.pathname + originalUrl.search;
-      const cleanPath = pathAndQuery.startsWith('/') ? pathAndQuery.substring(1) : pathAndQuery;
+      const proxyUrlFull = buildMeshProxyUrl(pathAndQuery);
-      const baseWithoutApi = BASE_URL.replace('/api', '');
-      const proxyUrlFull = `${baseWithoutApi}/api/meshcentral/proxy/${cleanPath}`;
       
       console.log("[RemoteControl] Proxy URL:", proxyUrlFull);
       setProxyUrl(proxyUrlFull);