Configure local instance of lean4game through apache proxy

Stream: general

[Miguel Marco]

I am trying to setup a leangame server for teaching purposes. I have setup the lean game server and a game in a dedicated machine (lets call it worker), that is only accessible from the local network. I also have a machine with an apache server facing the internet (let's call it frontend). So I have configured the apache in frontend to proxy the petitions directed to frontend/leangames to worker:3000. So frontend/leangames/#/g/local/mygame/ should be forwarded to worker:3000/#/g/local/mygame/. But it doesn't work.

I think the problem is that some answers to the client include relative paths to assets in the form of /@/foo' so the client interprets it must take them from frontend/@/foo which is not under the leangames` subdomain, and hence it is not redirected.

Does someone have a clue on how to do such a setup?

[Jon Eugster]

What's foo concretely here? Is this something one can just fix in the code?

[Miguel Marco]

according to my browser's developer tools, it is trying to fetch frontend/@vite/client, frontend/client/src/index.tsx and frontend/@react-refresh.

[Jon Eugster]

my first guess (before looking at any code) would be that things would work if you set up a subdomain like leangame.frontend.com instead of fronend.com/leangame, but let me see tomorrow if there's an easy fix

[Miguel Marco]

I am not sure i can set up subdomains, since i don't have control of the dns. But will also take a look at it tomorrow.

[Jon Eugster]

@Miguel Marco I think you can get it working if you change the base in vite.config.ts to /leangame/. If you download the lastest version from main you should see a comment in the vite.config.ts; let me know if that works

[Miguel Marco]

Now i get this error:

[server]
[server] > lean4-game@0.1.0 start_server
[server] > (cd server && lake build) && (cd relay && cross-env NODE_ENV=development nodemon -e mjs --exec "node ./index.mjs")
[server]
[client]
[client] > lean4-game@0.1.0 start_client
[client] > cross-env NODE_ENV=development vite --host
[client]
[server] [nodemon] 3.0.3
[server] [nodemon] to restart at any time, enter `rs`
[server] [nodemon] watching path(s): *.*
[server] [nodemon] watching extensions: mjs
[server] [nodemon] starting `node ./index.mjs`
[client]
[client]   VITE v4.5.3  ready in 412 ms
[client]
[client]   ➜  Local:   http://localhost:3000/leangames/
[client]   ➜  Network: http://155.210.85.163:3000/leangames/
[client] [vite-plugin-static-copy] Collected 7 items.
[server] (node:6458) [DEP0040] DeprecationWarning: The `punycode` module is deprecated. Please use a userland alternative instead.
[server] (Use `node --trace-deprecation ...` to show where the warning was created)
[server] Listening on 8080
[client] 17:14:44 [vite] Internal server error: Invalid URL
[client]       at new URL (node:internal/url:816:29)
[client]       at viteBaseMiddleware (file:///home/leangame/lean4game/node_modules/vite/dist/node/chunks/dep-41cf5ffd.js:61974:24)
[client]       at call (file:///home/leangame/lean4game/node_modules/vite/dist/node/chunks/dep-41cf5ffd.js:50689:7)
[client]       at next (file:///home/leangame/lean4game/node_modules/vite/dist/node/chunks/dep-41cf5ffd.js:50633:5)
[client]       at viteProxyMiddleware (file:///home/leangame/lean4game/node_modules/vite/dist/node/chunks/dep-41cf5ffd.js:64148:9)
[client]       at call (file:///home/leangame/lean4game/node_modules/vite/dist/node/chunks/dep-41cf5ffd.js:50689:7)
[client]       at next (file:///home/leangame/lean4game/node_modules/vite/dist/node/chunks/dep-41cf5ffd.js:50633:5)
[client]       at cors (file:///home/leangame/lean4game/node_modules/vite/dist/node/chunks/dep-41cf5ffd.js:51161:7)
[client]       at file:///home/leangame/lean4game/node_modules/vite/dist/node/chunks/dep-41cf5ffd.js:51197:17
[client]       at originCallback (file:///home/leangame/lean4game/node_modules/vite/dist/node/chunks/dep-41cf5ffd.js:51187:15)
[client] 17:14:58 [vite] Internal server error: Invalid URL
[client]       at new URL (node:internal/url:816:29)
[client]       at viteBaseMiddleware (file:///home/leangame/lean4game/node_modules/vite/dist/node/chunks/dep-41cf5ffd.js:61974:24)
[client]       at call (file:///home/leangame/lean4game/node_modules/vite/dist/node/chunks/dep-41cf5ffd.js:50689:7)
[client]       at next (file:///home/leangame/lean4game/node_modules/vite/dist/node/chunks/dep-41cf5ffd.js:50633:5)
[client]       at viteProxyMiddleware (file:///home/leangame/lean4game/node_modules/vite/dist/node/chunks/dep-41cf5ffd.js:64148:9)
[client]       at call (file:///home/leangame/lean4game/node_modules/vite/dist/node/chunks/dep-41cf5ffd.js:50689:7)
[client]       at next (file:///home/leangame/lean4game/node_modules/vite/dist/node/chunks/dep-41cf5ffd.js:50633:5)
[client]       at cors (file:///home/leangame/lean4game/node_modules/vite/dist/node/chunks/dep-41cf5ffd.js:51161:7)
[client]       at file:///home/leangame/lean4game/node_modules/vite/dist/node/chunks/dep-41cf5ffd.js:51197:17
[client]       at originCallback (file:///home/leangame/lean4game/node_modules/vite/dist/node/chunks/dep-41cf5ffd.js:51187:15)
[client] 17:21:04 [vite] Internal server error: Invalid URL
[client]       at new URL (node:internal/url:816:29)
[client]       at viteBaseMiddleware (file:///home/leangame/lean4game/node_modules/vite/dist/node/chunks/dep-41cf5ffd.js:61974:24)
[client]       at call (file:///home/leangame/lean4game/node_modules/vite/dist/node/chunks/dep-41cf5ffd.js:50689:7)
[client]       at next (file:///home/leangame/lean4game/node_modules/vite/dist/node/chunks/dep-41cf5ffd.js:50633:5)
[client]       at viteProxyMiddleware (file:///home/leangame/lean4game/node_modules/vite/dist/node/chunks/dep-41cf5ffd.js:64148:9)
[client]       at call (file:///home/leangame/lean4game/node_modules/vite/dist/node/chunks/dep-41cf5ffd.js:50689:7)
[client]       at next (file:///home/leangame/lean4game/node_modules/vite/dist/node/chunks/dep-41cf5ffd.js:50633:5)
[client]       at cors (file:///home/leangame/lean4game/node_modules/vite/dist/node/chunks/dep-41cf5ffd.js:51161:7)
[client]       at file:///home/leangame/lean4game/node_modules/vite/dist/node/chunks/dep-41cf5ffd.js:51197:17
[client]       at originCallback (file:///home/leangame/lean4game/node_modules/vite/dist/node/chunks/dep-41cf5ffd.js:51187:15)

My setup in frontend is just to add

ProxyPass /leangames http://worker:3000/ upgrade=websocket
ProxyPassReverse /leangames http://worker:3000/ upgrade=websocket

To the apache configuration file.

[Jon Eugster]

ok I gave it a shot and have a seamingly working version using nginx:

change to vite.config.ts

@@ -31,7 +31,7 @@ export default defineConfig({
     })
   ],
   publicDir: "client/public",
-  base: "/", // setting this to `/leangame/` means the server is now accessible at `localhost:3000/leangame`
+  base: "/leangame/", // setting this to `/leangame/` means the server is now accessible at `localhost:3000/leangame`
   optimizeDeps: {
     exclude: ['games']
   },

cat /etc/nginx/sites-enabled/default

server {
   listen 8102;
   location /leangame/ {
       proxy_pass http://localhost:3000/leangame/;
           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";
   }
   location /data/ {
       proxy_pass http://localhost:8080/data/;
           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";
   }
   location /locales/ {
       proxy_pass http://localhost:8080/locales/;
           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";
   }
   location /i18n/ {
       proxy_pass http://localhost:8080/i18n/;
           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";
   }
   location /websocket/ {
       proxy_pass http://localhost:8080/websocket/;
           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";
   }
   location /import/ {
       proxy_pass http://localhost:8080/import/;
           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";
   }
}

Note that the proxy goes to worker:3000/leangame/!

and a sudo systemctl restart nginx.service to start it. Now the game server is at localhost:8102/leangame.

(I'm not sure if one could also modify the proxies in vite.config.ts instead of adding the locations /websocket, /data, etc. in the nginx config...)

[Jon Eugster]

(ps: I didn't look at what the proxy_set_header-things exactly say in the second spoiler, that's just the template a tutorial suggested)

[Miguel Marco]

Thank you! That showed me the game interface, but no data from the game loaded. I figured out that it is trying to fetch some assets from /data/g/local, /locales/en/translation.json and i18n/g/local that are not based on /leangame/. Adding the corresponding lines to the proxy configuration for those seems to work.

[Miguel Marco]

I also had to add some lines for /websocket/g/local