diff --git a/PROXY_SETUP.md b/PROXY_SETUP.md index 7312dd6..c08779b 100644 --- a/PROXY_SETUP.md +++ b/PROXY_SETUP.md @@ -15,9 +15,24 @@ Rebuild the Jumble image with the correct proxy URL: ```bash # Build with the correct proxy URL (baked into the JS bundle) -# Users access via https://jumble.imwald.eu, so proxy must be HTTPS too +# +# IMPORTANT: Since users access via HTTPS (https://jumble.imwald.eu), +# the proxy URL MUST also use HTTPS or browsers will block it (mixed content). +# +# You have two options: +# +# Option 1: Configure HTTPS for port 8090 (requires SSL certificate) +# docker build --build-arg VITE_PROXY_SERVER=https://jumble.imwald.eu:8090 ... +# +# Option 2: Route proxy through your reverse proxy (recommended if you have nginx/Apache) +# Configure reverse proxy to route /proxy/* to http://localhost:8090/ +# The code constructs: ${proxyServer}/sites/${encodeURIComponent(url)} +# So /proxy/sites/... is forwarded to http://localhost:8090/sites/... +# Then use: https://jumble.imwald.eu/proxy +# +# Using Option 2 (recommended - route through Apache reverse proxy): docker build \ - --build-arg VITE_PROXY_SERVER=https://jumble.imwald.eu:8090 \ + --build-arg VITE_PROXY_SERVER=https://jumble.imwald.eu/proxy \ -t silberengel/imwald-jumble:12 \ . @@ -55,7 +70,8 @@ docker network create jumble-network ### 1. Set Environment Variables Before Building ```bash -export JUMBLE_PROXY_SERVER_URL="https://jumble.imwald.eu:8090" +# Use the reverse proxy route if you've configured Apache/nginx +export JUMBLE_PROXY_SERVER_URL="https://jumble.imwald.eu/proxy" export JUMBLE_SOCIAL_URL="https://jumble.imwald.eu" ``` @@ -101,13 +117,106 @@ docker run -d \ ghcr.io/danvergara/jumble-proxy-server:latest ``` +## HTTPS Certificate Setup for Port 8090 + +Since users access via `https://jumble.imwald.eu`, you need HTTPS for the proxy to avoid mixed content errors. + +**Option A: SSL Certificate for Port 8090** + +If you want to access the proxy directly on port 8090 with HTTPS, you'll need an SSL certificate: + +```bash +# Using Let's Encrypt with certbot +certbot certonly --standalone -d jumble.imwald.eu --expand + +# Then configure your reverse proxy or the proxy server itself to use the certificate +# The exact steps depend on your setup (nginx, Apache, or direct in the proxy container) +``` + +**Option B: Route Through Reverse Proxy (Recommended)** + +If you already have a reverse proxy (nginx/Apache) handling HTTPS for `jumble.imwald.eu`, route the proxy through it: + +### Apache Reverse Proxy Setup + +1. **Enable required Apache modules:** +```bash +sudo a2enmod proxy +sudo a2enmod proxy_http +sudo a2enmod rewrite +sudo a2enmod headers +sudo systemctl restart apache2 +``` + +2. **Add reverse proxy configuration to your Apache virtual host** (typically in `/etc/apache2/sites-available/jumble.imwald.eu-le-ssl.conf` or similar): + +```apache + + + ServerName jumble.imwald.eu + ServerAlias www.jumble.imwald.eu + + # Reverse Proxy Configuration + ProxyPreserveHost On + + # Proxy for the jumble-proxy-server (must come BEFORE the catch-all / rule) + # The code constructs: ${proxyServer}/sites/${encodeURIComponent(url)} + # So /proxy/sites/... needs to be forwarded to http://127.0.0.1:8090/sites/... + ProxyPass /proxy/ http://127.0.0.1:8090/ + ProxyPassReverse /proxy/ http://127.0.0.1:8090/ + + # Reverse Proxy for the main Jumble app + ProxyPass / http://127.0.0.1:32768/ + ProxyPassReverse / http://127.0.0.1:32768/ + + # Headers for proper proxying + Header always set X-Forwarded-Proto https + Header always set X-Forwarded-Port 443 + +Include /etc/letsencrypt/options-ssl-apache.conf +SSLCertificateFile /etc/letsencrypt/live/jumble.imwald.eu/fullchain.pem +SSLCertificateKeyFile /etc/letsencrypt/live/jumble.imwald.eu/privkey.pem + + +``` + +**Important:** The code constructs URLs like `https://jumble.imwald.eu/proxy/sites/https%3A%2F%2Fexample.com`. Apache receives `/proxy/sites/https%3A%2F%2Fexample.com` and forwards it to `http://127.0.0.1:8090/sites/https%3A%2F%2Fexample.com` (strips `/proxy` prefix). + +3. **Enable the site (if not already enabled):** +```bash +sudo a2ensite jumble.imwald.eu-le-ssl.conf +``` + +4. **Reload Apache:** +```bash +sudo apache2ctl configtest # Check for errors first +sudo systemctl reload apache2 +``` + +5. **Test the proxy route:** +```bash +# Test with a real URL - the code constructs /proxy/sites/{encoded-url} +curl -I https://jumble.imwald.eu/proxy/sites/https%3A%2F%2Fexample.com +# Should return 200 OK if working correctly +``` + +6. **Build with the proxy URL:** +```bash +docker build \ + --build-arg VITE_PROXY_SERVER=https://jumble.imwald.eu/proxy \ + -t silberengel/imwald-jumble:12 \ + . +``` + +**Note:** The proxy URL in `VITE_PROXY_SERVER` should be `https://jumble.imwald.eu/proxy` (without trailing slash), and the code will append `/sites/...` automatically. + ## Important Notes - The `VITE_PROXY_SERVER` value is baked into the JavaScript bundle during build time - You MUST rebuild the Docker image if you change `VITE_PROXY_SERVER` - The proxy server's `ALLOW_ORIGIN` must match the frontend URL users access (`https://jumble.imwald.eu`) -- Both must use the same protocol (http vs https) -- If the proxy is accessed via HTTPS on port 8090, make sure HTTPS is configured for that port +- Mixed content: HTTPS pages cannot load HTTP resources - both must use HTTPS +- If using direct port access (8090), you need an SSL certificate for that port ## Troubleshooting