Skip to content

Latest commit

 

History

History
209 lines (173 loc) · 5.47 KB

File metadata and controls

209 lines (173 loc) · 5.47 KB

Security Guide for OAuth Implementation

🔒 Current Security Measures

Implemented Security Features:

  1. Immediate URL Cleanup: OAuth tokens are immediately removed from URL parameters
  2. Token Validation: Basic JWT format validation before using tokens
  3. Error Handling: Secure error handling without exposing sensitive information
  4. Supabase Security: Leveraging Supabase's built-in security features

🔧 OAuth Configuration Security:

// Current secure configuration
const { error } = await supabase.auth.signInWithOAuth({
  provider: 'google',
  options: {
    redirectTo: 'http://localhost:8080/dashboard',
    queryParams: {
      access_type: 'offline',  // Get refresh token
      prompt: 'consent'        // Always show consent screen
    }
  }
});

🚨 Security Considerations

Development Environment (Current):

  • Acceptable for development
  • ⚠️ Tokens briefly visible in URL (mitigated by immediate cleanup)
  • ⚠️ HTTP instead of HTTPS (acceptable for localhost)

Production Environment (Required Changes):

1. HTTPS Enforcement:

// Production OAuth configuration
redirectTo: 'https://yourdomain.com/dashboard'

2. Environment Variables:

# .env.production
VITE_SUPABASE_URL=https://your-project.supabase.co
VITE_SUPABASE_ANON_KEY=your-anon-key

3. Additional Security Headers:

// Add to your server configuration
{
  headers: {
    'X-Frame-Options': 'DENY',
    'X-Content-Type-Options': 'nosniff',
    'Referrer-Policy': 'strict-origin-when-cross-origin',
    'Content-Security-Policy': "default-src 'self'"
  }
}

🛡️ Recommended Security Enhancements

1. State Parameter (CSRF Protection):

const signInWithGoogle = async () => {
  const state = crypto.randomUUID(); // Generate random state
  
  const { error } = await supabase.auth.signInWithOAuth({
    provider: 'google',
    options: {
      redirectTo: 'http://localhost:8080/dashboard',
      queryParams: {
        access_type: 'offline',
        prompt: 'consent',
        state: state // Add CSRF protection
      }
    }
  });
  
  return { error };
};

2. PKCE (Proof Key for Code Exchange):

// For additional security, implement PKCE
const generateCodeVerifier = () => {
  const array = new Uint8Array(32);
  crypto.getRandomValues(array);
  return btoa(String.fromCharCode(...array))
    .replace(/\+/g, '-')
    .replace(/\//g, '_')
    .replace(/=/g, '');
};

3. Token Refresh Security:

// Implement secure token refresh
const refreshToken = async () => {
  const { data, error } = await supabase.auth.refreshSession();
  if (error) {
    // Handle refresh error securely
    await supabase.auth.signOut();
    window.location.href = '/login';
  }
  return data;
};

🔍 Security Audit Checklist

Before Production Deployment:

  • HTTPS enabled on all OAuth redirect URLs
  • Environment variables configured for production
  • Security headers implemented
  • Token validation enhanced
  • Error logging without sensitive data exposure
  • Session timeout configured
  • Rate limiting implemented
  • CORS policy properly configured

OAuth Provider Security:

  • Google Cloud Console configured with production URLs
  • Supabase configured with production settings
  • Redirect URIs limited to your domain only
  • Client secrets stored securely
  • OAuth scopes limited to necessary permissions

🚀 Production Security Best Practices

1. Domain Verification:

// Verify redirect domain
const allowedDomains = ['yourdomain.com', 'www.yourdomain.com'];
const currentDomain = window.location.hostname;

if (!allowedDomains.includes(currentDomain)) {
  throw new Error('Unauthorized domain');
}

2. Session Security:

// Configure secure session settings
const supabase = createClient(url, key, {
  auth: {
    storage: localStorage,
    persistSession: true,
    autoRefreshToken: true,
    detectSessionInUrl: true,
    flowType: 'pkce' // Enable PKCE for enhanced security
  }
});

3. Error Handling:

// Secure error handling
const handleAuthError = (error: any) => {
  // Log error without sensitive data
  console.error('Auth error:', {
    code: error.code,
    message: error.message,
    timestamp: new Date().toISOString()
  });
  
  // Don't expose internal error details to user
  return 'Authentication failed. Please try again.';
};

📊 Security Risk Assessment

Low Risk:

  • ✅ OAuth flow implementation
  • ✅ Token cleanup
  • ✅ Basic validation

Medium Risk:

  • ⚠️ No CSRF protection (add state parameter)
  • ⚠️ No PKCE (implement for production)
  • ⚠️ HTTP in development (use HTTPS in production)

High Risk (Must Fix for Production):

  • 🚨 HTTPS enforcement
  • 🚨 Environment variable security
  • 🚨 Domain validation
  • 🚨 Rate limiting

🎯 Conclusion

Current Implementation:

  • Safe for development
  • Basic security measures in place
  • ⚠️ Needs enhancements for production

For Production:

  • Implement HTTPS
  • Add CSRF protection
  • Configure environment variables
  • Add rate limiting
  • Implement comprehensive error handling

The current implementation is safe for development but requires the above enhancements for production deployment.