OAuth Providers Setup

Enable social login with Google, GitHub, Facebook, and Envato OAuth providers.

Overview

OAuth login allows users to sign in using their existing accounts from popular platforms, reducing friction and improving user experience.

Supported providers:

• Google
• GitHub
• Facebook
• Envato

Benefits

• Faster user onboarding
• No password management for users
• Verified email addresses
• Reduced support requests

Accessing OAuth Settings

1. Navigate to Settings → Authentication Settings
2. Scroll to OAuth Providers section
3. Enable desired providers
4. Enter API credentials
5. Save changes

Google OAuth Setup

Step 1: Create Google Cloud Project

1. Go to Google Cloud Console
2. Create a new project or select existing
3. Navigate to APIs & Services → Credentials

Step 2: Create OAuth Client ID

1. Click Create Credentials → OAuth client ID
2. Application type: Web application
3. Name: "FeedbackFlow"
4. Authorized redirect URIs:

   https://yourdomain.com/auth/google/callback

5. Click Create

Step 3: Copy Credentials

Copy the Client ID and Client Secret.

Step 4: Configure in FeedbackFlow

1. Navigate to Settings → Authentication Settings
2. Enable Google Login
3. Enter:
   • Client ID: Your Google Client ID
   • Client Secret: Your Google Client Secret
   • Redirect URL: https://yourdomain.com/auth/google/callback (auto-filled)
4. Save changes

GitHub OAuth Setup

Step 1: Register OAuth App

1. Go to GitHub Developer Settings
2. Click New OAuth App
3. Fill in details:
   • Application name: FeedbackFlow
   • Homepage URL: https://yourdomain.com
   • Authorization callback URL: https://yourdomain.com/auth/github/callback
4. Click Register application

Step 2: Generate Client Secret

1. Click Generate a new client secret
2. Copy the Client ID and Client Secret

Step 3: Configure in FeedbackFlow

1. Navigate to Settings → Authentication Settings
2. Enable GitHub Login
3. Enter:
   • Client ID: Your GitHub Client ID
   • Client Secret: Your GitHub Client Secret
4. Save changes

Facebook OAuth Setup

Step 1: Create Facebook App

1. Go to Facebook Developers
2. Click My Apps → Create App
3. Select Consumer app type
4. Enter app name and contact email
5. Create the app

Step 2: Add Facebook Login

1. In app dashboard, click Add Product
2. Select Facebook Login
3. Choose Web platform
4. Site URL: https://yourdomain.com

Step 3: Configure OAuth Redirect

1. Go to Facebook Login → Settings
2. Add to Valid OAuth Redirect URIs:

   https://yourdomain.com/auth/facebook/callback

3. Save changes

Step 4: Get App Credentials

1. Navigate to Settings → Basic
2. Copy App ID and App Secret

Step 5: Configure in FeedbackFlow

1. Navigate to Settings → Authentication Settings
2. Enable Facebook Login
3. Enter:
   • Client ID: Your Facebook App ID
   • Client Secret: Your Facebook App Secret
4. Save changes

Facebook App Review

For public Facebook apps, you may need to submit for app review. During development, test with users assigned as developers/testers in the Facebook app settings.

Envato OAuth Setup

Step 1: Create Envato API Application

1. Go to Envato API
2. Click Create a new app
3. Fill in details:
   • App name: FeedbackFlow
   • Confirmation URL: https://yourdomain.com/auth/envato/callback
   • App description: Brief description
4. Agree to terms and create

Step 2: Copy Credentials

Copy the Client ID and Client Secret.

Step 3: Configure in FeedbackFlow

1. Navigate to Settings → Authentication Settings
2. Enable Envato Login
3. Enter:
   • Client ID: Your Envato Client ID
   • Client Secret: Your Envato Client Secret
4. Save changes

Testing OAuth Login

After configuring a provider:

1. Log out of admin dashboard
2. Go to the login page
3. Click the OAuth provider button (e.g., "Sign in with Google")
4. Authorize the application
5. Verify successful login

User Data Handling

When a user logs in via OAuth:

Data stored:

• Email address
• First name and last name (if provided)
• OAuth provider name
• OAuth user ID
• Profile avatar (if available)

Security:

• OAuth tokens are encrypted in the database
• No passwords are stored for OAuth users
• Email verification is automatically marked as verified

Disabling OAuth Providers

To disable a provider:

1. Navigate to Settings → Authentication Settings
2. Toggle off the provider
3. Save changes

Existing users who logged in via that provider can still access their accounts but cannot use OAuth login until re-enabled.

Troubleshooting OAuth

"Redirect URI mismatch" Error

Cause: Callback URL doesn't match provider configuration

Solution:

1. Verify callback URL matches exactly in provider settings:

   https://yourdomain.com/auth/{provider}/callback

2. Ensure protocol matches (http vs https)
3. No trailing slash

OAuth Login Button Not Appearing

Check:

• Provider is enabled in Authentication Settings
• Client ID and Client Secret are saved
• Cache has been cleared

"Invalid Client" Error

Cause: Incorrect Client ID or Client Secret

Solution:

• Double-check credentials copied correctly
• Ensure no extra spaces
• Regenerate secret if necessary

Users Cannot Complete OAuth Flow

Check:

• Application is approved/published (Facebook, Google)
• Email scope is requested
• OAuth app is not in development mode (for production)

Security Considerations

HTTPS Required

OAuth providers require HTTPS for production apps. Never use OAuth with plain HTTP in production.

Callback URL Validation

Ensure callback URLs cannot be manipulated. FeedbackFlow validates redirect URIs automatically.

Token Security

OAuth tokens are encrypted at rest using Laravel's encryption features.

OAuth vs Email/Password

Users can have both OAuth and email/password login enabled:

OAuth-only users:

• Cannot reset password (none exists)
• Must use OAuth provider to log in

Email/password users:

• Can add OAuth providers to existing account
• Can use either method to log in

Next Steps

• RECAPTHA setup - Captcha Setup
• Advanced Settings - More advance Settings