Put Nomad UI behind Traefik reverse proxy

Nomad
1

I am trying to make Nomad UI work when behind a Traefik reverse proxy that uses a path address. I want to use https://mydomain.com/nomad and similarly consul https://mydomain.com/consul

I have configured Nomad service in Traefik in the following way:

http:
  middlewares:
    nomad-strip:
      stripprefix:
        prefixes:
          - "/nomad"
    nomad-strip:
      stripprefix:
        prefixes:
          - "/nomad"
    nomad-trailingslash:
      replacepathregex:
        regex: "/nomad/(.*)"
        replacement: "/$1"
    consul-strip:
      stripprefix:
        prefixes:
          - "/consul"
    consul-trailingslash:
      replacepathregex:
        regex: "/consul/(.*)"
        replacement: "/$1"
    basic-auth:
      basicauth:
        users: "{{basic_auth_htpasswd}}"
  routers:
    nomad-router:
      service: nomad-ui
      rule: Host(`{{base_url}}`) && (PathPrefix(`/nomad`) || PathPrefix(`/nomad/{.*}`))
      entryPoints:
        - websecure
      tls: true
      middlewares:
        - basic-auth
    consul-router:
      service: consul-ui
      rule: Host(`{{base_url}}`) && (PathPrefix(`/consul`) || PathPrefix(`/consul/{.*}`))
      entryPoints:
        - websecure
      tls: true
      middlewares:
        - basic-auth
  services:
    nomad-ui:
      loadBalancer:
        servers:
          - url: "http://{{inventory_hostname}}:4646"
        passHostHeader: true
    consul-ui:
      loadBalancer:
        servers:
          - url: "http://{{inventory_hostname}}:8500"
        passHostHeader: true

Unfortunately when I try to open https://mydomain.com/nomad in my browser i get the following result:

Screen Shot 2022-06-30 at 1.07.34 PM
Screen Shot 2022-06-30 at 1.07.34 PM3360×2010 377 KB

To proove that my environment is well set I removed all middlewares and set Host({{base_url}}) only and then the UI loads up without issues, see:

Screen Shot 2022-06-30 at 1.13.39 PM
Screen Shot 2022-06-30 at 1.13.39 PM1920×1150 105 KB

Could somebody tell me what am I doing wrong with setting up reverse proxy behind a /path ? What’s the correct config for Nomad UI for reverse proxy behind a /path ?

2

Hi!

I was looking into the same thing as well. One thing to realize is that it is not reasonable to do this just via proxy configuration.
While the rewriting / stripping works as is seen in your screenshot, the response is not rewritten by the proxy.
This means that if the frontend code tries to load any endpoint using an absolute path it’ll not get routed properly.
A classical solution is to have the proxy rewrite the response content; I don’t think this is feasible for modern JS based front ends.

If you’re not rewriting responses it will require backend support.

3

There is a related open issue here:

1 Like
4

Hi @MGasztold,

We don’t have a guide for doing this with Traefik, but we do have a Learn guide for proxying the Nomad UI using NGINX which hopefully will be useful. Our E2E proxy is based off this guide as can provide additional reference material.

Thanks,
jrasell and the Nomad team