authentication
security
tutorial
Guía de Autenticación
Guía completa de autenticación en VibeAny usando Better-Auth
10 de enero de 2024
•Por VibeAny Team•8 min de lectura
Authentication Guide
VibeAny uses Better-Auth for a modern, secure authentication system. This guide covers everything you need to know.
Features
- ✅ Email/Password authentication
- ✅ OAuth providers (Google, GitHub)
- ✅ Email verification
- ✅ Password reset
- ✅ Session management
- ✅ Protected routes
Email/Password Authentication
Users can sign up with their email and password. Email verification is enabled by default.
import { signUp } from '@/lib/auth/client';
await signUp.email({
name: 'John Doe',
email: 'john@example.com',
password: 'secure-password',
});OAuth Providers
Google OAuth
- Create a project in Google Cloud Console
- Enable Google+ API
- Create OAuth 2.0 credentials
- Add credentials to
.env.local:
GOOGLE_CLIENT_ID=your-client-id
GOOGLE_CLIENT_SECRET=your-client-secretGitHub OAuth
- Go to GitHub Settings → Developer settings → OAuth Apps
- Create a new OAuth app
- Add credentials to
.env.local:
GITHUB_CLIENT_ID=your-client-id
GITHUB_CLIENT_SECRET=your-client-secretProtected Routes
Server Components
Use getSession() to protect server components:
import { getSession } from '@/lib/auth/server';
import { redirect } from 'next/navigation';
export default async function ProtectedPage() {
const session = await getSession();
if (!session) {
redirect('/auth/login');
}
return <div>Protected content</div>;
}Client Components
Use the useSession() hook:
'use client';
import { useSession } from '@/lib/auth/client';
export default function ClientComponent() {
const { data: session, isLoading } = useSession();
if (isLoading) return <div>Loading...</div>;
if (!session) return <div>Please sign in</div>;
return <div>Welcome, {session.user.name}!</div>;
}Security Best Practices
- Use strong secrets - Generate secure random strings for
BETTER_AUTH_SECRET - Enable email verification - Verify user emails before allowing access
- Implement rate limiting - Protect against brute force attacks
- Use HTTPS - Always use HTTPS in production
- Regular updates - Keep dependencies up to date
Customization
You can customize the authentication flow by editing lib/auth/config.ts:
export const auth = betterAuth({
// Your custom configuration
session: {
expiresIn: 60 * 60 * 24 * 30, // 30 days
},
});Troubleshooting
Common Issues
Problem: OAuth redirect not working
Solution: Make sure your redirect URLs match exactly in your OAuth app settings.
Problem: Session not persisting
Solution: Check that cookies are enabled and BETTER_AUTH_URL is set correctly.
Need more help? Contact support