Question: CORS Problems with Separate Dockers

[opoverlord]

Hello

I'm having a heck of a time with the CORS headers and being able to access tailscale. My setup is as follows:

• docker server facing internet with headscale and caddy
• docker server internally with headscale-UI and caddy

See figure 1 below for a drawing of the setup.

A primary requirement of the design is to keep headscale-UI from being available on the same server running headscale -- i.e., prevent headscale-UI from being externally accessible from the internet.

Configurations

On the internally facing server, this is the configuration in caddy:

https://hsui.int.example.com {

    tls internal
    # reverse proxy to hsui docker
    reverse_proxy /web* https://hsui {
        transport http {
            tls_insecure_skip_verify
        }
    }
}

In the headscale-UI GUI, I enter the https://hs.example.com URL, and the API key generated.

---

On the externally facing server, this is the configuration in caddy:

https://hs.example.com {
    tls /etc/caddy/public.pem /etc/caddy/privkey.pem

        @hs-options {
                host hs.example.com
                method OPTIONS
        }
        @hs-other {
                host hs.example.com
        }

        handle @hs-options {
                header {
                        Access-Control-Allow-Origin https://hsui.int.example.com
                        Access-Control-Allow-Headers *
                        Access-Control-Allow-Methods "POST, GET, OPTIONS, DELETE"
                }
                respond 204
        }

        handle @hs-other {
                # reverse proxy to headscale docker 'hs'
                reverse_proxy http://hs:8080 {
                        header_down Access-Control-Allow-Origin https://hsui.int.example.com
                        header_down Access-Control-Allow-Methods "POST, GET, OPTIONS, DELETE"
                        header_down Access-Control-Allow-Headers *
                }
        }

    log {
        output file /var/log/hsc.log
    }

}

Results

Browser: Firefox 109.0.1 on Linux

The first call does generate a 204. However, the subsequent GET on https://hs.example.com/api/v1/apikey fails. The error is:

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://hs.example.com/api/v1/apikey. (Reason: CORS header ‘Access-Control-Allow-Origin’ does not match ‘https://hs.int.example.com’).

I'm not that familiar with CORS, and have tried many different configurations in an attempt to find a fix. Any help is greatly appreciated, thank you.

--

Figure 1

[routerino]

Are the certificates you using trusted by your computer or self signed? if the browser doesn't trust the certificates, it won't allow CORS.

Also what's the concern of having headscale-ui accessible by the internet? By design, having access to the application does not grant any benefit without knowing the API key.

[opoverlord]

Ah crud. Headscale has an LE cert, but the UI cert is caddy self signed. Will switch that up and give it a shot and ping back.

As for UI being accessible - really just attack surface reduction.

Thanks

[opoverlord]

Yep, that was it.

Thanks for the assist!