← Back to File Tree
GOOGLE_OAUTH_SETUP.md
Language: markdown |
Path: backend/GOOGLE_OAUTH_SETUP.md |
Lines: 157
# Google OAuth Setup Guide
This guide explains how to enable Google OAuth login for the Tech Stack Advisor application.
## Overview
The application now supports Google OAuth 2.0 authentication, allowing users to sign in with their Google accounts. **Important: Your Google password never leaves Google's servers** - the application only receives your email, name, and Google user ID.
## What Was Implemented
### Backend Changes
1. **Configuration** (`src/core/config.py`):
- Added `google_client_id`, `google_client_secret`, and `google_redirect_uri` settings
2. **OAuth Helper** (`src/core/google_oauth.py`):
- Functions to generate Google auth URLs
- Token exchange with Google
- User info retrieval
- Configuration validation
3. **API Endpoints** (`src/api/main.py`):
- `/auth/google/login` - Initiates OAuth flow
- `/auth/google/callback` - Handles Google callback and creates user session
### Frontend Changes
4. **Login Page** (`static/login.html`):
- Wired up "Continue with Google" button to OAuth flow
## How to Enable Google OAuth
### Step 1: Create Google OAuth Credentials
1. Go to [Google Cloud Console](https://console.cloud.google.com/)
2. Create a new project or select an existing one
3. Enable the Google+ API:
- Go to "APIs & Services" > "Library"
- Search for "Google+ API"
- Click "Enable"
4. Create OAuth 2.0 credentials:
- Go to "APIs & Services" > "Credentials"
- Click "Create Credentials" > "OAuth client ID"
- Select "Web application" as the application type
- Give it a name (e.g., "Tech Stack Advisor")
5. Configure authorized redirect URIs:
- For **local development**, add:
```
http://localhost:8000/auth/google/callback
```
- For **production**, add:
```
https://your-domain.com/auth/google/callback
```
- Click "Create"
6. Copy your credentials:
- You'll see your **Client ID** and **Client Secret**
- Keep these secure!
### Step 2: Configure Environment Variables
Add these variables to your `.env` file:
```bash
# Google OAuth Configuration
GOOGLE_CLIENT_ID=your_client_id_here.apps.googleusercontent.com
GOOGLE_CLIENT_SECRET=your_client_secret_here
GOOGLE_REDIRECT_URI=http://localhost:8000/auth/google/callback
```
**For production**, update the redirect URI:
```bash
GOOGLE_REDIRECT_URI=https://your-domain.com/auth/google/callback
```
### Step 3: Test the Integration
1. Restart your backend server:
```bash
cd /Users/admin/codeprojects/tech-stack-advisor
source .venv/bin/activate
python -m backend.src.api.main
```
2. Open the application in your browser:
```
http://localhost:8000/login.html
```
3. Click "Continue with Google"
4. You should be redirected to Google's login page
5. After signing in with Google, you'll be redirected back to the app and automatically logged in
## How It Works (The OAuth Flow)
1. User clicks "Continue with Google" button
2. Backend generates a random state (for security) and redirects to Google
3. User logs in on Google's website (password stays at Google)
4. Google redirects back to your app with an authorization code
5. Backend exchanges the code for an access token
6. Backend uses the token to get user info (email, name, Google ID)
7. Backend creates or authenticates the user in your database
8. User receives a JWT token for your application
9. User is automatically logged in and redirected to the home page
## Security Features
- **CSRF Protection**: Uses state parameter to prevent cross-site request forgery
- **Token Exchange**: Authorization code is exchanged server-side (more secure than client-side)
- **No Password Storage**: User passwords never touch your application
- **Automatic State Cleanup**: Expired OAuth states are cleaned up after 10 minutes
- **HTTPS Recommended**: Always use HTTPS in production
## Production Deployment
When deploying to production (e.g., Railway):
1. Add environment variables in Railway dashboard:
- `GOOGLE_CLIENT_ID`
- `GOOGLE_CLIENT_SECRET`
- `GOOGLE_REDIRECT_URI` (use your production domain)
2. Update authorized redirect URIs in Google Cloud Console to include your production domain
3. The application will automatically use the environment variables
## Troubleshooting
### "Google OAuth is not configured" error
- Make sure `GOOGLE_CLIENT_ID` and `GOOGLE_CLIENT_SECRET` are set in `.env`
- Restart your backend server after adding the variables
### "Invalid state parameter" error
- This is a security measure - the OAuth state might have expired (>10 minutes)
- Try logging in again
### "Redirect URI mismatch" error
- The redirect URI in your Google Cloud Console must EXACTLY match `GOOGLE_REDIRECT_URI` in your `.env`
- Check for trailing slashes and http vs https
### OAuth works locally but not in production
- Make sure you added your production domain to authorized redirect URIs in Google Cloud Console
- Verify environment variables are set correctly in your production environment
## What's Next?
The application also has placeholder buttons for:
- Microsoft OAuth
- LinkedIn OAuth
- Facebook OAuth
These can be implemented similarly if needed in the future.