# 🚀 Quick Guide - HTTPS Mixed Content Fix

## Problem
CSS, JS, dan asset tidak muncul saat akses via HTTPS (ngrok/Railway/Render/VPS)

## Root Cause
Laravel generate URL dengan `http://` di halaman `https://` → Browser block (Mixed Content Error)

## Solution (3 Simple Steps)

### 1. Update AppServiceProvider
**File:** `app/Providers/AppServiceProvider.php`

```php
use Illuminate\Support\Facades\URL;

public function boot(): void
{
    if ($this->app->environment('production') || request()->header('X-Forwarded-Proto') === 'https') {
        URL::forceScheme('https');
    }
}
```

### 2. Create TrustProxies Middleware
**File:** `app/Http/Middleware/TrustProxies.php` (NEW)

```php
<?php

namespace App\Http\Middleware;

use Illuminate\Http\Middleware\TrustProxies as Middleware;
use Illuminate\Http\Request;

class TrustProxies extends Middleware
{
    protected $proxies = '*';

    protected $headers =
        Request::HEADER_X_FORWARDED_FOR |
        Request::HEADER_X_FORWARDED_HOST |
        Request::HEADER_X_FORWARDED_PORT |
        Request::HEADER_X_FORWARDED_PROTO |
        Request::HEADER_X_FORWARDED_AWS_ELB;
}
```

### 3. Register Middleware
**File:** `bootstrap/app.php`

```php
->withMiddleware(function (Middleware $middleware): void {
    $middleware->trustProxies(at: '*');  // ← Add this line
    
    $middleware->alias([
        'admin' => \App\Http\Middleware\EnsureIsAdmin::class,
    ]);
})
```

## Done! ✅

### Test:
```bash
php artisan serve
ngrok http 8000
# Visit ngrok HTTPS URL → All assets loaded!
```

### Works On:
- ✅ Localhost (HTTP)
- ✅ Ngrok (HTTPS)
- ✅ Railway (HTTPS)
- ✅ Render (HTTPS)
- ✅ VPS + Nginx (HTTPS)

### No Need To:
- ❌ Update APP_URL
- ❌ Hardcode URLs
- ❌ Change config per deployment

## How It Works
1. Proxy sends `X-Forwarded-Proto: https` header
2. TrustProxies reads the header
3. Laravel forces all URLs to HTTPS
4. No Mixed Content Error!

## Troubleshooting

**Still has Mixed Content?**
```bash
php artisan config:clear
php artisan cache:clear
```

**Check proxy header:**
```bash
curl -I https://your-ngrok-url.io
# Should see: X-Forwarded-Proto: https
```

---

**Total Changes:** 34 lines across 3 files  
**Time to Implement:** 2 minutes  
**Works Forever:** Yes, automatic detection ✅