Utilities - Status page does not work with reverse proxy.

[thumpco]

I've have WGUI deployed on a dozen servers and it's working great except for an issue with the Status page. The page works as expected when accessing the UI directly (port 5000), but I'd like to lock the UI down better and I cannot get it to fully function behind any type of reverse proxy. I've tried Nginx, nginx-reverse-proxy, Caddy and caddy-docker-proxy. In all of the 4 scenarios the entire UI works as expected, except for 2 issues:

1) The Status page will not show the clients list (see attached screenshot) 2) The Wireguard Clients page will not show any of the connected clients when using the "Connected" filter at the top of the page.

While I realize this is not a direct WGUI issue, it's a bummer as the native UI really needs additional protection (as you recommend). Any hints on what may cause this would be greatly appreciated. I've tried dozens of various config options on the proxies and cannot seem to find anything that allows this dynamic page content to display.

[Tarow]

Are there any errors in your network console? Also what does ur nginx config look like?

I am running WGUI behind Traefik and everything - including the status page - work perfectly fine.

[thumpco]

@Tarow - No errors on the network console when loading the Status page. The only difference I see between loading the page directly vs the proxy, is that when loading directly it makes 23 network calls vs 22 on the proxy. The difference is an additional .wolf2 fonts file from gstatic. I assume this is due to the page body not rendering on the proxy.

I've deleted the Nginx container by now, but I'll post my current Caddy config below. I'm willing to give Traefik a shot but have not used it before so if you could provide a config example it would be greatly appreciated.

root@server# cat system.yml

version: "3"

networks:
  default:
    external: true
    name: caddy

services:
  wireguard-ui:
    image: ngoduykhanh/wireguard-ui:latest
    container_name: wireguard-ui
    cap_add:
      - NET_ADMIN
    #network_mode: host
    environment:
      - SENDGRID_API_KEY
      - SESSION_SECRET=[redacted]
      - WGUI_USERNAME=[redacted]
      - WGUI_PASSWORD=[redacted]
      - WGUI_MANAGE_START=false
      - WGUI_MANAGE_RESTART=false
      - WGUI_ENDPOINT_ADDRESS=[redacted]
      - WGUI_SERVER_INTERFACE_ADDRESSES=10.9.0.1/16
      #- WGUI_SERVER_INTERFACE_ADDRESSES=10.9.0.1/16,fd86:ea04:1115::1/64
      - WGUI_FAVICON_FILE_PATH=/etc/wireguard/rth-favicon4.svg
      - WG_CONF_TEMPLATE
      - EMAIL_FROM_ADDRESS=[redacted]
      - EMAIL_FROM_NAME=VPN Admin
      - SMTP_HOSTNAME=[redacted]
      - SMTP_PORT=587
      - SMTP_USERNAME=[redacted]
      - SMTP_PASSWORD=[redacted]
      - SMTP_AUTH_TYPE=PLAIN
      - SMTP_ENCRYPTION=STARTTLS
      - WGUI_DEFAULT_CLIENT_ALLOWED_IPS=0.0.0.0/0
      #- WGUI_DEFAULT_CLIENT_ALLOWED_IPS=0.0.0.0/0,::/0
      - WGUI_DEFAULT_CLIENT_EXTRA_ALLOWED_IPS=
      - WGUI_DEFAULT_CLIENT_USE_SERVER_DNS=1
      - WGUI_DEFAULT_CLIENT_ENABLE_AFTER_CREATION=1
      - WGUI_LOG_LEVEL=INFO
    logging:
      driver: json-file
      options:
        max-size: 50m
    volumes:
      - ./db:/app/db
      - /etc/wireguard:/etc/wireguard

  caddy:
    image: caddy:2-alpine
    restart: unless-stopped
    volumes:
      - ./Caddyfile:/etc/caddy/Caddyfile
      - caddy_data:/data
    ports:
      - "80:80"
      - "443:443"
    depends_on:
      - wireguard-ui

volumes:
  caddy_data: {}

Caddyfile:

vpn.mydomain.com {
    tls internal {
    }
    @options {
        method OPTIONS
    }
    header {
        Access-Control-Allow-Origin *
        Access-Control-Allow-Credentials true
        Access-Control-Allow-Methods *
        Access-Control-Allow-Headers *
        defer
    }
    reverse_proxy wireguard-ui:5000 {
        header_up Host {http.reverse_proxy.upstream.hostport}
        header_up X-Real-IP {http.reverse-proxy.upstream.address}
        header_down -Access-Control-Allow-Origin
        lb_try_duration 5s
    }
        respond @options 204
}

[thumpco]

I've also tried adding the cap_add: NET_ADMIN priv to the caddy container as I understand this has something do to with displaying the stats, but no luck.

[thumpco]

@Tarow - I've tested now with Traefik and am still having the same issue. I've listed my config below. Could you please post a copy of your wireguard-ui config? I'm wondering if there's something I'm missing in the wireguard-ui yml configuration.

version: "3"

networks:
  default:
    external: true
    name: caddy

services:
  wireguard-ui:
    image: ngoduykhanh/wireguard-ui:latest
    container_name: wireguard-ui
    labels:
      - "traefik.enable=true"
      - "traefik.http.routers.wireguard-ui.rule=Host(`[redacted]`)"
      - "traefik.http.routers.wireguard-ui.entrypoints=web"
    cap_add:
      - NET_ADMIN
    #network_mode: host
    environment:
      - SENDGRID_API_KEY
      - SESSION_SECRET=[redacted]
      - WGUI_USERNAME=[redacted]
      - WGUI_PASSWORD=[redacted]
      - WGUI_MANAGE_START=false
      - WGUI_MANAGE_RESTART=false
      - WGUI_ENDPOINT_ADDRESS=[redacted]
      - WGUI_SERVER_INTERFACE_ADDRESSES=10.9.0.1/16
      #- WGUI_SERVER_INTERFACE_ADDRESSES=10.9.0.1/16,fd86:ea04:1115::1/64
      - WGUI_FAVICON_FILE_PATH=/etc/wireguard/rth-favicon4.svg
      - WG_CONF_TEMPLATE
      - EMAIL_FROM_ADDRESS=[redacted]
      - EMAIL_FROM_NAME=VPN Admin
      - SMTP_HOSTNAME=[redacted]
      - SMTP_PORT=587
      - SMTP_USERNAME=[redacted]
      - SMTP_PASSWORD=[redacted]
      - SMTP_AUTH_TYPE=PLAIN
      - SMTP_ENCRYPTION=STARTTLS
      - WGUI_DEFAULT_CLIENT_ALLOWED_IPS=0.0.0.0/0
      #- WGUI_DEFAULT_CLIENT_ALLOWED_IPS=0.0.0.0/0,::/0
      - WGUI_DEFAULT_CLIENT_EXTRA_ALLOWED_IPS=
      - WGUI_DEFAULT_CLIENT_USE_SERVER_DNS=1
      - WGUI_DEFAULT_CLIENT_ENABLE_AFTER_CREATION=1
      - WGUI_LOG_LEVEL=INFO
    logging:
      driver: json-file
      options:
        max-size: 50m
    volumes:
      - ./db:/app/db
      - /etc/wireguard:/etc/wireguard

  traefik:
    image: "traefik:v2.10"
    container_name: "traefik"
    command:
      #- "--log.level=DEBUG"
      - "--api.insecure=true"
      - "--providers.docker=true"
      - "--providers.docker.exposedbydefault=false"
      - "--entrypoints.web.address=:80"
    ports:
      - "80:80"
      - "8080:8080"
    volumes:
      - "/var/run/docker.sock:/var/run/docker.sock:ro"

[thumpco]

Okay.. I think I've isolated the issue. Since my setup has Wireguard running on the host, the wireguard-ui needs to have "network_mode: host" set in order to access the host statistics. The issue now being that I can't figure out how to have wgui have access to the host network to get stats while also being attached to a docker bridge network to work with the reverse proxy.

[thumpco]

Figured it out! The key is to keep the WGUI using "network_mode: host" and then map the reverse_proxy in the Caddyfile to the wireguard IP address instead of using the internal bridge and container name.

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[thumpco]

https://github.com/ngoduykhanh/wireguard-ui/issues/429#issuecomment-1704001429