nginx.conf.example

# Nginx Configuration for Codev Support Chat
# Replace /path/to/your/website with your actual website path
# Replace the PHP-FPM socket path with your server's actual path

server {
    listen 80;
    server_name yourdomain.com www.yourdomain.com;
    root /path/to/your/website;
    index index.php index.html;

    # Security headers
    add_header X-Frame-Options "SAMEORIGIN" always;
    add_header X-XSS-Protection "1; mode=block" always;
    add_header X-Content-Type-Options "nosniff" always;

    # Proper MIME types for JavaScript modules and CSS
    location ~* \.js$ {
        add_header Content-Type "application/javascript; charset=utf-8";
        expires 1y;
        add_header Cache-Control "public, immutable";
    }
    
    location ~* \.css$ {
        add_header Content-Type "text/css; charset=utf-8";
        expires 1y;
        add_header Cache-Control "public, immutable";
    }

    # API routes - handle all API requests
    location /api {
        try_files $uri $uri/ /api/index.php$is_args$args;
    }

    # Admin interface static assets (CSS, JS, images) - CRITICAL: Must come before /admin location
    location /admin/assets/ {
        alias /path/to/your/website/admin/dist/assets/;
        expires 1y;
        add_header Cache-Control "public, immutable";
        
        # Ensure proper MIME types for JavaScript modules
        location ~* \.js$ {
            add_header Content-Type "application/javascript; charset=utf-8";
            expires 1y;
            add_header Cache-Control "public, immutable";
        }
        
        # Handle other asset types
        location ~* \.(css|png|jpg|jpeg|gif|ico|svg|woff|woff2|ttf|eot)$ {
            expires 1y;
            add_header Cache-Control "public, immutable";
        }
    }

    # Admin interface - serve the SPA
    # IMPORTANT: This location block MUST come after /admin/assets/ to prevent conflicts
    location /admin {
        alias /path/to/your/website/admin/dist/;
        try_files $uri $uri/ /admin/index.html;
        
        # Handle PHP files if any exist in admin
        location ~ \.php$ {
            fastcgi_pass unix:/var/run/php/php8.1-fpm.sock;
            fastcgi_index index.php;
            include fastcgi_params;
            fastcgi_param SCRIPT_FILENAME $request_filename;
        }
    }

    # Widget static assets
    location /widget/ {
        alias /path/to/your/website/widget/;
        expires 1y;
        add_header Cache-Control "public, immutable";
    }

    # Main application - handle all other requests
    # This will redirect to /install/ if not installed, or /admin/ if installed
    location / {
        try_files $uri $uri/ /index.php$is_args$args;
    }

    # Handle PHP files
    location ~ \.php$ {
        fastcgi_pass unix:/var/run/php/php8.1-fpm.sock;
        fastcgi_index index.php;
        include fastcgi_params;
        fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
    }

    # Deny access to sensitive files
    location ~ /\. {
        deny all;
    }
    
    location ~ /(config|core|vendor)/ {
        deny all;
    }

    # Logging
    access_log /var/log/nginx/yourdomain.com.access.log;
    error_log /var/log/nginx/yourdomain.com.error.log;
}

# =============================================================================
# TROUBLESHOOTING GUIDE
# =============================================================================
#
# If you encounter a white page when accessing /admin/, check the following:
#
# 1. MIME TYPE ERRORS:
#    - Error: "Failed to load module script: Expected a JavaScript-or-Wasm module script but the server responded with a MIME type of 'text/html'"
#    - Solution: Ensure the /admin/assets/ location block comes BEFORE the /admin location block
#    - Verify that JavaScript files are served with Content-Type: application/javascript
#
# 2. ASSET SERVING ISSUES:
#    - Check that /admin/assets/ requests are properly routed to admin/dist/assets/
#    - Verify the admin panel is built: npm run build:admin
#    - Ensure admin/dist/assets/ directory exists and contains JS/CSS files
#
# 3. LOCATION BLOCK ORDER:
#    - The order of location blocks in nginx is critical
#    - More specific paths (/admin/assets/) must come before general paths (/admin)
#    - Wrong order will cause assets to be served as HTML instead of their proper types
#
# 4. TESTING:
#    - Test asset URLs directly: https://yourdomain.com/admin/assets/index-XXXXX.js
#    - Should return JavaScript content with proper MIME type
#    - Check browser developer tools Network tab for 200 responses
#
# 5. COMMON FIXES:
#    - Reload nginx: sudo nginx -s reload
#    - Check nginx config: sudo nginx -t
#    - Rebuild admin panel: npm run build:admin
#    - Clear browser cache
#
# =============================================================================