[OGUI-1947] Create nginx config and adapt ilg

InfoLogger/Dockerfile

@@ -68,3 +68,26 @@ EXPOSE 6102
 USER 1000:1000
 
 CMD [ "node", "test/live-simulator/runInfoLoggerServer.js" ]
+
+#
+# ---- Build ----
+# Bundles the frontend into dist/ for nginx to serve
+FROM developmentdependencies AS build
+
+# Overlay the local Framework frontend on the published package so unreleased Framework changes are bundled.
+# Needs the `framework` build context (see docker-compose.nginx.yaml); remove once ILG depends on a release with them.
+COPY --from=framework Frontend ./node_modules/@aliceo2/web-ui/Frontend
+
+COPY index.html vite.config.mjs ./
+COPY public ./public
+COPY src ./src
+RUN npx vite build
+
+#
+# ---- Nginx ----
+FROM nginx:1.31-alpine AS nginx
+
+COPY --from=build /home/node/app/dist /dist
+COPY docker/nginx/default.conf /etc/nginx/conf.d/default.conf
+
+EXPOSE 80

InfoLogger/README.md

@@ -91,6 +91,8 @@ The development image is approx. 500MB and the test image is approx 1.5GB, about
 
 For services with a cross, point `config.js` at a remote host and port and change the credentials accordingly. For services with a checkmark, the script will start a local container for you.
 
+For nginx use `npm run docker:dev:nginx`.  To edit and apply without rebuilding: `docker compose exec nginx nginx -s reload`
+
 Run `npm run docker:cleanup` to remove all containers created by the above and their data.
 
 ## Backend

InfoLogger/docker-compose.nginx.yaml

@@ -0,0 +1,21 @@
+services:
+  application:
+    # Only reachable through nginx
+    ports: !reset []
+
+  nginx:
+    build:
+      context: .
+      target: nginx
+      additional_contexts:
+        framework: ../Framework
+
+    ports: ["8080:80"]
+
+    depends_on: [application]
+
+    volumes:
+      - type: bind
+        read_only: true
+        source: ./docker/nginx/default.conf
+        target: /etc/nginx/conf.d/default.conf

InfoLogger/docker/nginx/default.conf

@@ -0,0 +1,34 @@
+server {
+  listen 80;
+
+  gzip on;
+  gzip_types text/css application/javascript application/json image/svg+xml;
+  gzip_min_length 1024;
+  gzip_vary on;
+
+  location /api/ {
+    proxy_pass http://application:8080;
+    proxy_http_version 1.1;
+    proxy_set_header Host $host;
+    proxy_cache_bypass $http_upgrade;
+    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+    proxy_set_header X-Forwarded-Proto $scheme;
+  }
+
+  location /ws {
+        proxy_pass http://application:8080;
+        proxy_http_version  1.1;
+        proxy_set_header    Upgrade $http_upgrade;
+        proxy_set_header    Connection "upgrade";
+        proxy_set_header    Host $host;
+        proxy_cache_bypass $http_upgrade;
+        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;
+    }
+
+  location / {
+    root /dist;
+    try_files $uri $uri/ /index.html;
+  }
+}

InfoLogger/index.js

@@ -12,8 +12,8 @@
  * or submit itself to any jurisdiction.
  */
 
 const fs = require('fs');
 const path = require('path');
 const { HttpServer, WebSocket, LogManager } = require('@aliceo2/web-ui');
 
 const config = require('./lib/configProvider.js');
@@ -29,7 +29,7 @@
   ...config.http,
   ...isDev && { extraConnectSrc: [`ws://${config.http.hostname ?? 'localhost'}:${VITE_HMR_PORT}`] },
 }, config.jwt, config.openId);
-const ws = new WebSocket(http);
+const ws = new WebSocket(http, { path: '/ws' });
 
 const logger = LogManager.getLogger(`${process.env.npm_config_log_label ?? 'ilg'}/index`);
 
@@ -47,14 +47,6 @@
     // Vite ends unmatched requests with 404, so API calls must skip it
     http.routerStatics.use((req, res, next) =>
       req.path.startsWith('/api/') ? next() : vite.middlewares(req, res, next));
-  } else {
-    const distPath = path.join(__dirname, 'dist');
-    if (!fs.existsSync(distPath)) {
-      logger.errorMessage(`Frontend build not found at ${distPath}, run "npm run build" first`);
-    } else {
-      logger.infoMessage(`Serving frontend files from ${distPath}`);
-    }
-    http.addStaticPath(distPath);
   }
 
   // Attach services to web server

InfoLogger/package.json

@@ -26,13 +26,14 @@
     "coverage": "nyc npm test && npm run coverage:report",
     "coverage:report": "nyc report --reporter=html --reporter=json",
     "start": "node index.js",
-    "start:dev": "NODE_ENV=development node --inspect --watch-path=index.js --watch-path=lib --watch-path=config.js index.js",
+    "start:dev": "NODE_ENV=development node --inspect --watch-path=index.js --watch-path=lib --watch-path=config.js --watch-path=node_modules/@aliceo2/web-ui/Backend index.js",
     "simul": "node test/live-simulator/runInfoLoggerServer.js",
     "seed": "node docker/database/seed-messages.js",
     "docker:dev": "docker compose -f docker-compose.yaml -f docker-compose.dev.yaml up --build",
     "docker:dev:local-ilg": "docker compose -f docker-compose.yaml -f docker-compose.dev.yaml -f docker-compose.dev.ilg.yaml up --build",
     "docker:dev:local-db": "docker compose -f docker-compose.yaml -f docker-compose.dev.yaml -f docker-compose.dev.db.yaml up --build",
     "docker:dev:local-both": "docker compose -f docker-compose.yaml -f docker-compose.dev.yaml -f docker-compose.dev.db.yaml -f docker-compose.dev.ilg.yaml up --build",
+    "docker:dev:nginx": "docker compose -f docker-compose.yaml -f docker-compose.dev.yaml -f docker-compose.dev.db.yaml -f docker-compose.dev.ilg.yaml -f docker-compose.nginx.yaml up --build",
     "docker:test": "docker compose -f docker-compose.yaml -f docker-compose.test.yaml up --build --abort-on-container-exit --exit-code-from application",
     "docker:cleanup": "docker compose -f docker-compose.yaml -f docker-compose.dev.yaml -f docker-compose.dev.db.yaml -f docker-compose.dev.ilg.yaml down -v --remove-orphans && docker compose -f docker-compose.yaml -f docker-compose.test.yaml down -v --remove-orphans"
   },

InfoLogger/src/Model.js

@@ -66,7 +66,7 @@ export default class Model extends Observable {
     this.accountMenuEnabled = false;
 
     // Setup WS connection before the router as parsing live=true awaits wsSettled
-    this.ws = new WebSocketClient();
+    this.ws = new WebSocketClient({ path: '/ws' });
     this.ws.addListener('command', this.handleWSCommand.bind(this));
     this.ws.addListener('authed', this.handleWSAuthed.bind(this));