# 🌐 Reverse Proxy OAuth Setup Guide

## Your Current Setup
- **Internet** → **Router (ports 80/443)** → **Reverse Proxy** → **Frontend (port 5173)**
- **Backend (port 3000)** is only accessible locally
- **OAuth callback fails** because Google can't reach the backend

## The Problem
Google OAuth needs to redirect to your **backend** (`/auth/google/callback`), but your reverse proxy only forwards to the frontend. The backend port 3000 isn't exposed to the internet.

## Solution: Configure Reverse Proxy for Both Frontend and Backend

### Option 1: Single Domain with Path-Based Routing (Recommended)

Configure your reverse proxy to route both frontend and backend on the same domain:

```nginx
# Example Nginx configuration
server {
    listen 443 ssl;
    server_name bsa.madeamess.online;
    
    # Frontend routes (everything except /auth and /api)
    location / {
        proxy_pass http://localhost:5173;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
    }
    
    # Backend API routes
    location /api/ {
        proxy_pass http://localhost:3000;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
    }
    
    # Backend auth routes (CRITICAL for OAuth)
    location /auth/ {
        proxy_pass http://localhost:3000;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
    }
}
```

### Option 2: Subdomain Routing

If you prefer separate subdomains:

```nginx
# Frontend
server {
    listen 443 ssl;
    server_name bsa.madeamess.online;
    
    location / {
        proxy_pass http://localhost:5173;
        # ... headers
    }
}

# Backend API
server {
    listen 443 ssl;
    server_name api.bsa.madeamess.online;
    
    location / {
        proxy_pass http://localhost:3000;
        # ... headers
    }
}
```

## Update Environment Variables

### For Option 1 (Path-based - Recommended):

```bash
# backend/.env
GOOGLE_CLIENT_ID=308004695553-6k34bbq22frc4e76kejnkgq8mncepbbg.apps.googleusercontent.com
GOOGLE_CLIENT_SECRET=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
GOOGLE_REDIRECT_URI=https://bsa.madeamess.online/auth/google/callback
FRONTEND_URL=https://bsa.madeamess.online
```

### For Option 2 (Subdomain):

```bash
# backend/.env
GOOGLE_CLIENT_ID=308004695553-6k34bbq22frc4e76kejnkgq8mncepbbg.apps.googleusercontent.com
GOOGLE_CLIENT_SECRET=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
GOOGLE_REDIRECT_URI=https://api.bsa.madeamess.online/auth/google/callback
FRONTEND_URL=https://bsa.madeamess.online
```

## Update Google Cloud Console

### For Option 1 (Path-based):

**Authorized JavaScript origins:**
```
https://bsa.madeamess.online
```

**Authorized redirect URIs:**
```
https://bsa.madeamess.online/auth/google/callback
```

### For Option 2 (Subdomain):

**Authorized JavaScript origins:**
```
https://bsa.madeamess.online
https://api.bsa.madeamess.online
```

**Authorized redirect URIs:**
```
https://api.bsa.madeamess.online/auth/google/callback
```

## Frontend Configuration Update

If using Option 2 (subdomain), update your frontend to call the API subdomain:

```javascript
// In your frontend code, change API calls from:
fetch('/auth/google/url')

// To:
fetch('https://api.bsa.madeamess.online/auth/google/url')
```

## Testing Your Setup

### 1. Test Backend Accessibility

```bash
# Should work from internet
curl https://bsa.madeamess.online/auth/setup
# or for subdomain:
curl https://api.bsa.madeamess.online/auth/setup
```

### 2. Test OAuth URL Generation

```bash
curl https://bsa.madeamess.online/auth/google/url
# Should return a Google OAuth URL
```

### 3. Test Complete Flow

1. Visit `https://bsa.madeamess.online`
2. Click "Continue with Google"
3. Complete Google login
4. Should redirect back and authenticate

## Common Issues and Solutions

### Issue: "Invalid redirect URI"
- **Cause**: Google Console redirect URI doesn't match exactly
- **Fix**: Ensure exact match including `https://` and no trailing slash

### Issue: "OAuth not configured"
- **Cause**: Backend environment variables not updated
- **Fix**: Update `.env` file and restart containers

### Issue: Frontend can't reach backend
- **Cause**: Reverse proxy not configured for `/auth` and `/api` routes
- **Fix**: Add backend routing to your reverse proxy config

### Issue: CORS errors
- **Cause**: Frontend and backend on different origins
- **Fix**: Update CORS configuration in backend:

```javascript
// In backend/src/index.ts
app.use(cors({
  origin: [
    'https://bsa.madeamess.online',
    'http://localhost:5173' // for local development
  ],
  credentials: true
}));
```

## Recommended: Path-Based Routing

I recommend **Option 1 (path-based routing)** because:
- ✅ Single domain simplifies CORS
- ✅ Easier SSL certificate management
- ✅ Simpler frontend configuration
- ✅ Better for SEO and user experience

## Quick Setup Commands

```bash
# 1. Update environment variables
cd /home/kyle/Desktop/vip-coordinator
# Edit backend/.env with your domain

# 2. Restart containers
docker-compose -f docker-compose.dev.yml restart

# 3. Test the setup
curl https://bsa.madeamess.online/auth/setup
```

Your OAuth should work once you configure your reverse proxy to forward `/auth` and `/api` routes to the backend (port 3000)!