Initial commit - Current state of vip-coordinator

REVERSE_PROXY_OAUTH_SETUP.md

@@ -0,0 +1,217 @@
+# 🌐 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)!