Webpage not rendering fully

I’m having trouble the accessing Home Assistant behind Caddy. I’m running Caddy as a Home Assistant add-on. I know this is not a traditional setup, but I believe it is caused by a misconfigured Caddyfile, so I hope you’ll be able to help, despite the nontraditional setup.

1. Caddy version (caddy version):

v2.3.0

2. How I run Caddy:

I run Caddy as a add-on in Home Assistant.

a. System environment:

Add-on: Caddy 2
Caddy 2 web server
Add-on version: v0.1.0
https://github.com/einschmidt/hassio-addons/tree/master/Caddy%202

System: Home Assistant OS 5.9 (amd64 / intel-nuc)
Home Assistant Core: 2020.12.2
Home Assistant Supervisor: 2020.12.7

b. Command:

paste command here

c. Service/unit/compose file:

paste full file contents here

d. My complete Caddyfile or JSON config:

MY_NAME.duckdns.org/SERVICE_NAME {
    reverse_proxy /* localhost:8123
}

3. The problem I’m having:

When I enter MY_NAME.duckdns.org/SERVICE_NAME, I only see a “partial” loaded webpage. Similar to V2 reverse proxy transparent/websocket. I’ve tried the different solutions proposed in that thread, but still no luck.

4. Error messages and/or full log output:

{"level":"info","ts":1609710609.2777631,"msg":"using provided configuration","config_file":"/share/caddy/Caddyfile","config_adapter":""}
{"level":"info","ts":1609710609.2834356,"logger":"admin","msg":"admin endpoint started","address":"tcp/localhost:2019","enforce_origin":false,"origins":["localhost:2019","[::1]:2019","127.0.0.1:2019"]}
{"level":"info","ts":1609710609.2847195,"logger":"tls.cache.maintenance","msg":"started background certificate maintenance","cache":"0xc00033a850"}
{"level":"info","ts":1609710609.2853713,"logger":"http","msg":"server is listening only on the HTTPS port but has no TLS connection policies; adding one to enable TLS","server_name":"srv0","https_port":443}
{"level":"info","ts":1609710609.2854521,"logger":"http","msg":"enabling automatic HTTP->HTTPS redirects","server_name":"srv0"}
{"level":"info","ts":1609710609.286673,"logger":"http","msg":"enabling automatic TLS certificate management","domains":["MY_NAME.duckdns.org"]}
{"level":"info","ts":1609710609.2899299,"logger":"tls","msg":"cleaned up storage units"}
{"level":"info","ts":1609710609.311719,"msg":"autosaved config","file":"/data/caddy/autosave.json"}
{"level":"info","ts":1609710609.3117597,"msg":"serving initial configuration"}

5. What I already tried:

I’ve modified the Caddyfile, e.g. removing the ‘/*’, and prefixed the the domain with https://, i.e. https://MY_NAME.duckdns.org/SERVICE_NAME. But the result is the same.

6. Links to relevant resources:

Ok, so I guess it is because I use a subfolder, The "subfolder problem", OR, "why can't I reverse proxy my app into a subfolder?"

It’s actually because of your /SERVICE_NAME here. In Caddy v2, path matching is exact, so that would only match exactly /SERVICE_NAME and not /SERVICE_NAME/foo for example.

I suggest doing it like this instead:

MY_NAME.duckdns.org {
	handle_path /SERVICE_NAME* {
		reverse_proxy localhost:8123
	}
	
	handle {
		# Fallback for other paths
	}
}

But it’s true that Home Assistant may not well handle being served under a subpath, and it may be better to serve it under another subdomain instead, like home.MY_NAME.duckdns.org.

Thanks for the handle suggestion. Will test it tomorrow. Otherwise, I think I’ll go for the subdomain solution.

I did not manage to get it working with your suggestions for subpath. Thus, I’m now using the subdomain approach.

Thanks for helping out.

1 Like

This topic was automatically closed after 30 days. New replies are no longer allowed.