MayaTheShy/Homepage
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add troubleshooting section for Cloudflare HTTPS and mixed content issues; update services-loader.js to support local IP for health checks

Browse Source
This commit is contained in:
MayaChat
2025-11-24 12:32:38 -05:00
parent af2658bfce
commit 423557fe5c
2 changed files with 25 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
README.md
View File

@@ -325,6 +325,22 @@ docker-compose restart
## Troubleshooting
### Cloudflare, HTTPS and Mixed Content
If you're serving the homepage over HTTPS (for example, via Cloudflare), your browser will block active (programmatic) HTTP requests to local IPs — this is "mixed content". That can cause the health checks for local services to fail or to be marked offline.
Recommendations:
- Enable HTTPS for your local services (e.g., configure TLS or use a reverse proxy with a valid certificate) and/or use Cloudflare Tunnel to serve the service with a domain and TLS.
- Or configure a server-side proxy that performs health checks and serves the results over HTTPS (for example, add a proxy endpoint in your nginx config and proxy_pass to the local IP/port); the browser will then make a same-origin secure request to the proxy rather than directly to the IP.
- In `services.xml`, use the `tailscale-ip` attribute to supply an easily-editable Tailscale IP for local services that should be used for links and health checks.
- In `services.xml`, use the `tailscale-ip` attribute to supply an easily-editable Tailscale IP for local services that should be used for links and health checks.
Per-service `local-ip` override:
- If a specific service has a `local-ip` attribute (for example, `local-ip="192.168.2.180"`), the server-side health proxy will use that local IP for the health check. This allows per-service control when the internal IP differs from the household-wide Tailscale IP or when services are bound to different hosts.
Cloudflare Insights & CORS:
- If you see console errors about `static.cloudflareinsights.com` or messages like "CORS request did not succeed" or "integrity mismatch", this is likely a script injected by Cloudflare. This is not part of the homepage codebase and is injected by Cloudflare's edge. You can disable Cloudflare Analytics/Insights or adjust settings in the Cloudflare dashboard to remove or avoid that script if it's causing issues with CSP or integrity.
### Services Not Loading
1. Check `services.xml` syntax:

12
js/services-loader.js
View File

@@ -85,7 +85,8 @@
const proto = s.getAttribute('proto') || 'http';
const port = s.getAttribute('port') || '';
const logo = s.getAttribute('logo') || '';
const hostAttr = s.getAttribute('host'); // optional public hostname or full URL
const hostAttr = s.getAttribute('host'); // optional public hostname or full URL
const localIpAttr = s.getAttribute('local-ip'); // optional local IP for proxied health-check
const manualStatus = s.getAttribute('status'); // optional: 'online', 'offline', 'maintenance'
const checkHealth = s.getAttribute('check-health') !== 'false'; // default true, set to false to disable
@@ -126,7 +127,7 @@
healthCheckUrl = `/healthcheck?host=${encodedHost}&port=${encodeURIComponent(hcPort)}&proto=${encodeURIComponent(parsedProto)}`;
} else {
// Local service - use Tailscale IP if configured, otherwise current hostname
const targetHost = tailscaleIP || host;
const targetHost = localIpAttr || tailscaleIP || host;
let portPart = '';
if(port && !((proto==='http'&&port==='80')||(proto==='https'&&port==='443'))){ portPart = ':'+port; }
// Keep the link protocol as the defined proto (so clicking uses the intended protocol),
@@ -134,7 +135,12 @@
href = `${proto}://${targetHost}${portPart}`;
// Use our same-origin proxy path which nginx will forward to the health-proxy service.
const encodedHost = encodeURIComponent(targetHost);
const hcPort = port || (desiredProto === 'https' ? '443' : '80');
const hcPort = port || (desiredProto === 'https' ? '443' : '80');
if(localIpAttr){
console.log(`Service ${name}: using local-ip ${localIpAttr} for proxied health checks`);
} else if(tailscaleIP){
console.log(`Service ${name}: using tailscale-ip ${tailscaleIP} for proxied health checks`);
}
healthCheckUrl = `/healthcheck?host=${encodedHost}&port=${encodeURIComponent(hcPort)}&proto=${encodeURIComponent(desiredProto)}`;
// Warn when site is secure but service link is HTTP and target is a private IP
if(pageIsSecure && proto === 'http' && targetHost === tailscaleIP){