littleshop/NGINX-PROXY-MANAGER-FIX.md

Nginx-Proxy-Manager Push Notification Fix

Current Status

✅ nginx-proxy-manager is running ✅ LittleShop container is healthy ❌ VAPID endpoint returns empty response (CORS blocking)

Fix Steps via nginx-proxy-manager UI

Step 1: Access nginx-proxy-manager

1. Connect to VPN
2. Open browser and go to: http://10.13.13.1:81
3. Login with admin credentials

Step 2: Find the Admin.Dark.Side Proxy Host

1. Go to "Hosts" → "Proxy Hosts"
2. Find the entry for admin.dark.side
3. Click the 3-dot menu → "Edit"

Step 3: Add Custom nginx Configuration

1. Go to the "Advanced" tab
2. In the "Custom nginx Configuration" box, add the following:

# CORS headers for push notifications - dark.side domain
location ~ ^/(api/push|service-worker\.js|manifest\.json|pwa\.js) {
    # Set CORS headers for dark.side domains
    set $cors_origin "";
    if ($http_origin ~* (https?://.*\.dark\.side|https?://admin\.dark\.side)) {
        set $cors_origin $http_origin;
    }

    # If no specific origin match, allow the dark.side domain generally
    if ($cors_origin = "") {
        set $cors_origin "https://admin.dark.side";
    }

    # Apply CORS headers
    add_header 'Access-Control-Allow-Origin' $cors_origin always;
    add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, PUT, DELETE' always;
    add_header 'Access-Control-Allow-Headers' 'Content-Type, Authorization, X-Requested-With' always;
    add_header 'Access-Control-Allow-Credentials' 'true' always;
    add_header 'Access-Control-Max-Age' '3600' always;

    # Handle preflight OPTIONS requests
    if ($request_method = 'OPTIONS') {
        add_header 'Access-Control-Allow-Origin' $cors_origin always;
        add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, PUT, DELETE' always;
        add_header 'Access-Control-Allow-Headers' 'Content-Type, Authorization, X-Requested-With' always;
        add_header 'Access-Control-Allow-Credentials' 'true' always;
        add_header 'Access-Control-Max-Age' '3600' always;
        add_header 'Content-Length' '0';
        add_header 'Content-Type' 'text/plain charset=UTF-8';
        return 204;
    }
}

# Additional CORS for Admin area
location /Admin {
    add_header 'Access-Control-Allow-Origin' 'https://admin.dark.side' always;
    add_header 'Access-Control-Allow-Credentials' 'true' always;
}

Step 4: Save and Deploy

1. Click "Save"
2. Wait for nginx-proxy-manager to reload the configuration

Step 5: Test the Fix

1. Open browser to https://admin.dark.side
2. Open Developer Tools (F12)
3. Go to Console tab
4. Try to enable notifications
5. Check for CORS errors (should be none now)

Verification Commands

Once applied, test from command line:

# Test VAPID endpoint with CORS headers
curl -H "Origin: https://admin.dark.side" https://admin.dark.side/api/push/vapidpublickey

# Test OPTIONS preflight request
curl -X OPTIONS -H "Origin: https://admin.dark.side" -H "Access-Control-Request-Method: POST" https://admin.dark.side/api/push/subscribe

Both should return proper CORS headers and valid responses.

Alternative: Direct Database Update

If UI access is not available, you can update via the nginx-proxy-manager database:

# SSH to server
ssh -i vps_hardening_key -p 2255 sysadmin@10.13.13.1

# Access the database
docker exec nginx-proxy-manager sh -c "sqlite3 /data/database.sqlite"

# Find the proxy host ID
SELECT id, domain_names FROM proxy_host WHERE domain_names LIKE '%dark.side%';

# Update the advanced config (replace ID with actual ID from above)
UPDATE proxy_host SET advanced_config = '[CUSTOM_CONFIG_HERE]' WHERE id = [ID];

Expected Results After Fix

• ✅ Push notification subscription works
• ✅ No CORS errors in browser console
• ✅ VAPID endpoint returns public key
• ✅ Service worker registers successfully
• ✅ Notifications can be sent and received