mirror of https://github.com/kortix-ai/suna.git
156 lines
5.6 KiB
Markdown
156 lines
5.6 KiB
Markdown
# Google OAuth Setup Guide
|
|
|
|
This guide will help you configure Google Sign-In for your Suna application to avoid common errors like "Access blocked: This app's request is invalid".
|
|
|
|
## Prerequisites
|
|
|
|
- A Google Cloud Console account
|
|
- Your Supabase project URL and anon key
|
|
|
|
## Step 1: Create a Google Cloud Project
|
|
|
|
1. Go to [Google Cloud Console](https://console.cloud.google.com/)
|
|
2. Click "Select a project" → "New Project"
|
|
3. Enter a project name (e.g., "Suna App")
|
|
4. Click "Create"
|
|
|
|
## Step 2: Configure OAuth Consent Screen
|
|
|
|
1. In the Google Cloud Console, go to "APIs & Services" → "OAuth consent screen"
|
|
2. Select "External" user type (unless you have a Google Workspace account)
|
|
3. Click "Create"
|
|
4. Fill in the required fields:
|
|
- **App name**: Your application name (e.g., "Suna")
|
|
- **User support email**: Your email address
|
|
- **App logo**: Optional, but recommended
|
|
- **App domain**: Your domain (for local dev, skip this)
|
|
- **Authorized domains**: Add your domain(s)
|
|
- **Developer contact information**: Your email address
|
|
5. Click "Save and Continue"
|
|
6. **Scopes**: Click "Add or Remove Scopes"
|
|
- Select `.../auth/userinfo.email`
|
|
- Select `.../auth/userinfo.profile`
|
|
- Select `openid`
|
|
- Click "Update"
|
|
7. Click "Save and Continue"
|
|
8. **Test users**: Add test email addresses if in testing mode
|
|
9. Click "Save and Continue"
|
|
10. Review and click "Back to Dashboard"
|
|
|
|
## Step 3: Create OAuth 2.0 Credentials
|
|
|
|
1. Go to "APIs & Services" → "Credentials"
|
|
2. Click "Create Credentials" → "OAuth client ID"
|
|
3. Select "Web application" as the application type
|
|
4. Configure the client:
|
|
- **Name**: "Suna Web Client" (or any name you prefer)
|
|
- **Authorized JavaScript origins**:
|
|
- Add `http://localhost:3000` (for local development)
|
|
- Add `https://yourdomain.com` (for production)
|
|
- Add your Supabase URL (e.g., `https://yourproject.supabase.co`)
|
|
- **Authorized redirect URIs**:
|
|
- Add `http://localhost:3000/auth/callback` (for local development)
|
|
- Add `https://yourdomain.com/auth/callback` (for production)
|
|
- Add your Supabase auth callback URL: `https://yourproject.supabase.co/auth/v1/callback`
|
|
5. Click "Create"
|
|
6. **Important**: Copy the "Client ID" - you'll need this
|
|
|
|
## Step 4: Configure Supabase
|
|
|
|
1. Go to your [Supabase Dashboard](https://app.supabase.com)
|
|
2. Select your project
|
|
3. Go to "Authentication" → "Providers"
|
|
4. Find "Google" and enable it
|
|
5. Add your Google OAuth credentials:
|
|
- **Client ID**: Paste the Client ID from Step 3
|
|
- **Client Secret**: Leave empty (not needed for web applications)
|
|
6. **Authorized Client IDs**: Add your Client ID here as well
|
|
7. Click "Save"
|
|
|
|
## Step 5: Configure Your Application
|
|
|
|
1. Add the Google Client ID to your environment variables:
|
|
|
|
**Frontend** (`frontend/.env.local`):
|
|
```env
|
|
NEXT_PUBLIC_GOOGLE_CLIENT_ID=your-client-id-here
|
|
```
|
|
|
|
2. Restart your development server
|
|
|
|
## Step 6: Test Your Setup
|
|
|
|
1. Open your application in a browser
|
|
2. Click the "Continue with Google" button
|
|
3. You should see the Google sign-in popup
|
|
4. Select an account and authorize the application
|
|
5. You should be redirected back to your application and logged in
|
|
|
|
## Common Issues and Solutions
|
|
|
|
### "Access blocked: This app's request is invalid"
|
|
|
|
This error usually means:
|
|
- **Missing redirect URI**: Make sure all your redirect URIs are added in Google Cloud Console
|
|
- **Wrong Client ID**: Verify you're using the correct Client ID
|
|
- **OAuth consent screen not configured**: Complete all required fields in the consent screen
|
|
|
|
### "redirect_uri_mismatch"
|
|
|
|
- Check that your redirect URIs in Google Cloud Console exactly match your application URLs
|
|
- Include the protocol (`http://` or `https://`)
|
|
- Don't include trailing slashes
|
|
- For local development, use `http://localhost:3000`, not `http://127.0.0.1:3000`
|
|
|
|
### "invalid_client"
|
|
|
|
- Verify your Client ID is correct in the environment variables
|
|
- Make sure you're using the Web application client ID, not a different type
|
|
- Check that the OAuth client hasn't been deleted in Google Cloud Console
|
|
|
|
### Google button doesn't appear
|
|
|
|
- Check browser console for errors
|
|
- Verify `NEXT_PUBLIC_GOOGLE_CLIENT_ID` is set in your environment
|
|
- Make sure the Google Identity Services script is loading
|
|
|
|
## Production Deployment
|
|
|
|
When deploying to production:
|
|
|
|
1. Update Google Cloud Console:
|
|
- Add your production domain to "Authorized JavaScript origins"
|
|
- Add your production callback URL to "Authorized redirect URIs"
|
|
- Update the OAuth consent screen with production information
|
|
|
|
2. Update your production environment variables:
|
|
- Set `NEXT_PUBLIC_GOOGLE_CLIENT_ID` in your deployment platform
|
|
|
|
3. Verify Supabase settings:
|
|
- Ensure Google provider is enabled
|
|
- Confirm the Client ID is set correctly
|
|
|
|
## Security Best Practices
|
|
|
|
1. **Never commit your Client ID to version control** - always use environment variables
|
|
2. **Use HTTPS in production** - Google requires secure connections for OAuth
|
|
3. **Restrict your OAuth client** - Only add the domains you actually use
|
|
4. **Review permissions regularly** - Remove unused test users and unnecessary scopes
|
|
5. **Monitor usage** - Check Google Cloud Console for unusual activity
|
|
|
|
## Publishing Your App
|
|
|
|
If you want to remove the "unverified app" warning:
|
|
|
|
1. Go to "OAuth consent screen" in Google Cloud Console
|
|
2. Click "Publish App"
|
|
3. Google may require verification for certain scopes
|
|
4. Follow the verification process if required
|
|
|
|
## Need Help?
|
|
|
|
If you're still experiencing issues:
|
|
1. Check the browser console for detailed error messages
|
|
2. Verify all URLs and IDs are correctly copied
|
|
3. Ensure your Supabase project is properly configured
|
|
4. Try using an incognito/private browser window to rule out cache issues |