Not able to make the ui talk to headscale server

[simtcrom]

My setup is,

headscale server running on a linux server.
I verified that I can make external network clients connect to it using tailscale client.
API key is generated.
I verified that API key is working by running a sample curl command as below
curl -k -X 'GET' -H "Authorization: Bearer xxxxx" -H 'accept: application/json' 'https://myhost:port/api/v1/node'

I built headscale-ui code using npm run build and placed he build folder contents under /var/www/html/web/ folder
I can access the headscale-ui using http://myhost:port/web
Basically headscale ui is hosted on the same server where headscale is running/

In the settings tab entered Headscale URL as https://myhost:port and Headscale API Key as the one I earlier tested.
When I click Test Server Settings button, the green mark not turning green,
Any thoughts?

Below is what chrome developer tools shows when I click Test Server Settings button,

[routerino]

If curl is working but headscale ui isn't, it's 100% going to be CORS.

Make sure both the UI and headscale are served on the same subdomain. Yes you need to use a reverse proxy. Different ports count as different subdomains (you shouldn't be referring to ports at all).

[simtcrom]

If curl is working but headscale ui isn't, it's 100% going to be CORS.

Make sure both the UI and headscale are served on the same subdomain. Yes you need to use a reverse proxy. Different ports count as different subdomains (you shouldn't be referring to ports at all).

Headacale server and ui running on same server on different ports.
I did not understand what is CORS issue?

What is the solution you are recommending?

[AndDiSa]

I have siimilar issues with releases after 2024.02.24-beta1. I just migrated to headscale 0.23 and I wanted to update headscale-ui, too, but as soon as I am using 2024.10.05 or 2024.10.10 I am receiving only 502 errors from the headscale-ui.

[routerino]

If curl is working but headscale ui isn't, it's 100% going to be CORS.
Make sure both the UI and headscale are served on the same subdomain. Yes you need to use a reverse proxy. Different ports count as different subdomains (you shouldn't be referring to ports at all).

Headacale server and ui running on same server on different ports. I did not understand what is CORS issue?

What is the solution you are recommending?

The same solution that is on the front page of the readme, use a reverse proxy to merge the subdomains. The concept of reverse proxies is a well documented one that doesn't need to be explained here.

You will need a reverse proxy to install headscale-ui on your domain. Here is an example Caddy Config to achieve this:

[routerino]

I have siimilar issues with releases after 2024.02.24-beta1. I just migrated to headscale 0.23 and I wanted to update headscale-ui, too, but as soon as I am using 2024.10.05 or 2024.10.10 I am receiving only 502 errors from the headscale-ui.

Not the same issue, the default ports changed in the latest major release. I'll update the front page readme to make that change more apparent.