Capítulo 4: OAuth2 y Login Social

Introducción

En lugar de gestionar las contraseñas usted mismo, ¿por qué no dejar que Google, GitHub o Facebook se encarguen de ello? OAuth2 permite a sus usuarios iniciar sesión con sus cuentas existentes, mejorando así la experiencia de usuario y la seguridad.

---

🎯 Objetivos del Capítulo

Al finalizar este capítulo, usted sabrá:

1. ✅ Comprender OAuth2 y sus conceptos
2. ✅ Distinguir los diferentes flujos de OAuth2
3. ✅ Configurar Spring Security OAuth2 Client
4. ✅ Implementar el login con Google
5. ✅ Recuperar la información del usuario

---

1. Conceptos de OAuth2

Los 4 Roles

Rol	Descripción	Ejemplo
Resource Owner	El usuario que posee los datos	Juan que quiere iniciar sesión
Client	Su aplicación	su-app.com
Authorization Server	Servidor que autentica	accounts.google.com
Resource Server	Servidor que tiene los datos	googleapis.com

Authorization Code Flow

El flujo más seguro para aplicaciones web:

---

2. Configuración de Spring Boot

Dependencias

<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-oauth2-client</artifactId>
</dependency>

Configuración de Google

Paso 1: Crear un Proyecto en Google Cloud

1. Ir a https://console.cloud.google.com
2. Crear un nuevo proyecto
3. Ir a "APIs & Services" → "Credentials"
4. Crear "OAuth 2.0 Client IDs"
5. Tipo: "Web application"
6. Authorized redirect URIs: http://localhost:8080/login/oauth2/code/google

Paso 2: application.properties

# Google OAuth2
spring.security.oauth2.client.registration.google.client-id=VOTRE_CLIENT_ID
spring.security.oauth2.client.registration.google.client-secret=VOTRE_CLIENT_SECRET
spring.security.oauth2.client.registration.google.scope=openid,profile,email

Configuración de GitHub

Paso 1: GitHub Developer Settings

1. Ir a https://github.com/settings/developers
2. "OAuth Apps" → "New OAuth App"
3. Homepage URL: http://localhost:8080
4. Authorization callback URL: http://localhost:8080/login/oauth2/code/github

Paso 2: application.properties

# GitHub OAuth2
spring.security.oauth2.client.registration.github.client-id=VOTRE_CLIENT_ID
spring.security.oauth2.client.registration.github.client-secret=VOTRE_CLIENT_SECRET
spring.security.oauth2.client.registration.github.scope=user:email

---

3. SecurityConfig para OAuth2

Configuración Básica

@Configuration
@EnableWebSecurity
public class SecurityConfig {

    @Bean
    public SecurityFilterChain filterChain(HttpSecurity http) throws Exception {
        return http
            .authorizeHttpRequests(auth -> auth
                .requestMatchers("/", "/login", "/error", "/css/**", "/js/**").permitAll()
                .anyRequest().authenticated()
            )
            .oauth2Login(oauth -> oauth
                .loginPage("/login")
                .defaultSuccessUrl("/dashboard")
            )
            .logout(logout -> logout
                .logoutSuccessUrl("/")
            )
            .build();
    }
}

Página de Login con Botones OAuth2

<!-- templates/login.html -->
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <title>Inicio de sesión</title>
    <style>
        .oauth-buttons { margin-top: 20px; }
        .oauth-btn {
            display: inline-block;
            padding: 10px 20px;
            margin: 5px;
            border-radius: 5px;
            text-decoration: none;
            color: white;
        }
        .google { background: #db4437; }
        .github { background: #333; }
    </style>
</head>
<body>
    <div class="login-container">
        <h1>Inicio de sesión</h1>
        
        <!-- Login clásico -->
        <form th:action="@{/login}" method="post">
            <input type="text" name="username" placeholder="Nombre de usuario">
            <input type="password" name="password" placeholder="Contraseña">
            <button type="submit">Iniciar sesión</button>
        </form>
        
        <hr>
        
        <!-- Login OAuth2 -->
        <div class="oauth-buttons">
            <p>O inicie sesión con:</p>
            <a href="/oauth2/authorization/google" class="oauth-btn google">
                🔵 Google
            </a>
            <a href="/oauth2/authorization/github" class="oauth-btn github">
                ⚫ GitHub
            </a>
        </div>
    </div>
</body>
</html>

---

4. Recuperar la Información del Usuario

En un Controller

@Controller
public class ProfileController {

    @GetMapping("/dashboard")
    public String dashboard(
            @AuthenticationPrincipal OAuth2User oauth2User,
            Model model) {
        
        if (oauth2User != null) {
            model.addAttribute("name", oauth2User.getAttribute("name"));
            model.addAttribute("email", oauth2User.getAttribute("email"));
            model.addAttribute("picture", oauth2User.getAttribute("picture"));
            model.addAttribute("attributes", oauth2User.getAttributes());
        }
        
        return "dashboard";
    }
}

Atributos por Proveedor

Google

oauth2User.getAttribute("sub");       // ID único
oauth2User.getAttribute("name");      // Nombre completo
oauth2User.getAttribute("email");     // Email
oauth2User.getAttribute("picture");   // URL de la foto

GitHub

oauth2User.getAttribute("id");        // ID único
oauth2User.getAttribute("login");     // Nombre de usuario
oauth2User.getAttribute("name");      // Nombre completo
oauth2User.getAttribute("email");     // Email (puede ser null)
oauth2User.getAttribute("avatar_url"); // URL del avatar

---

5. Vincular OAuth2 a Sus Usuarios

Estrategia

Entidad OAuth2Connection

@Entity
@Table(name = "oauth2_connections")
@Data
@NoArgsConstructor
public class OAuth2Connection {

    @Id
    @GeneratedValue(strategy = GenerationType.IDENTITY)
    private Long id;

    @ManyToOne
    @JoinColumn(name = "user_id", nullable = false)
    private User user;

    @Column(nullable = false)
    private String provider;  // google, github

    @Column(nullable = false)
    private String providerUserId;  // ID en el proveedor

    @Column(nullable = false)
    private LocalDateTime connectedAt = LocalDateTime.now();
}

CustomOAuth2UserService

@Service
@RequiredArgsConstructor
public class CustomOAuth2UserService extends DefaultOAuth2UserService {

    private final UserRepository userRepository;
    private final OAuth2ConnectionRepository connectionRepository;

    @Override
    @Transactional
    public OAuth2User loadUser(OAuth2UserRequest userRequest) throws OAuth2AuthenticationException {
        OAuth2User oauth2User = super.loadUser(userRequest);

        String provider = userRequest.getClientRegistration().getRegistrationId();
        String providerUserId = getProviderUserId(oauth2User, provider);
        String email = oauth2User.getAttribute("email");
        String name = oauth2User.getAttribute("name");

        // Buscar una conexión existente
        Optional<OAuth2Connection> existingConnection = connectionRepository
            .findByProviderAndProviderUserId(provider, providerUserId);

        User user;
        if (existingConnection.isPresent()) {
            user = existingConnection.get().getUser();
        } else if (email != null && userRepository.existsByEmail(email)) {
            // Vincular a una cuenta existente por email
            user = userRepository.findByEmail(email).orElseThrow();
            createConnection(user, provider, providerUserId);
        } else {
            // Crear una nueva cuenta
            user = createNewUser(email, name);
            createConnection(user, provider, providerUserId);
        }

        return new CustomOAuth2User(oauth2User, user);
    }

    private String getProviderUserId(OAuth2User oauth2User, String provider) {
        return switch (provider) {
            case "google" -> oauth2User.getAttribute("sub");
            case "github" -> String.valueOf(oauth2User.getAttribute("id"));
            default -> throw new OAuth2AuthenticationException("Proveedor no soportado");
        };
    }

    private User createNewUser(String email, String name) {
        User user = new User();
        user.setEmail(email);
        user.setUsername(email); // O generar un username
        user.setPassword("");    // Sin contraseña para OAuth2
        user.setEnabled(true);
        // Añadir rol por defecto
        return userRepository.save(user);
    }

    private void createConnection(User user, String provider, String providerUserId) {
        OAuth2Connection connection = new OAuth2Connection();
        connection.setUser(user);
        connection.setProvider(provider);
        connection.setProviderUserId(providerUserId);
        connectionRepository.save(connection);
    }
}

CustomOAuth2User

public class CustomOAuth2User implements OAuth2User {

    private final OAuth2User oauth2User;
    private final User user;

    public CustomOAuth2User(OAuth2User oauth2User, User user) {
        this.oauth2User = oauth2User;
        this.user = user;
    }

    @Override
    public Map<String, Object> getAttributes() {
        return oauth2User.getAttributes();
    }

    @Override
    public Collection<? extends GrantedAuthority> getAuthorities() {
        return user.getRoles().stream()
            .map(role -> new SimpleGrantedAuthority(role.getName()))
            .collect(Collectors.toList());
    }

    @Override
    public String getName() {
        return user.getUsername();
    }

    public User getUser() {
        return user;
    }
}

Configuración con Servicio Personalizado

@Configuration
@EnableWebSecurity
@RequiredArgsConstructor
public class SecurityConfig {

    private final CustomOAuth2UserService customOAuth2UserService;

    @Bean
    public SecurityFilterChain filterChain(HttpSecurity http) throws Exception {
        return http
            .authorizeHttpRequests(auth -> auth
                .requestMatchers("/", "/login", "/error").permitAll()
                .anyRequest().authenticated()
            )
            .oauth2Login(oauth -> oauth
                .loginPage("/login")
                .userInfoEndpoint(userInfo -> userInfo
                    .userService(customOAuth2UserService)
                )
                .defaultSuccessUrl("/dashboard")
            )
            .build();
    }
}

---

6. Combinar OAuth2 + Form Login

@Bean
public SecurityFilterChain filterChain(HttpSecurity http) throws Exception {
    return http
        .authorizeHttpRequests(auth -> auth
            .requestMatchers("/", "/login", "/register", "/error").permitAll()
            .anyRequest().authenticated()
        )
        // Login por formulario
        .formLogin(form -> form
            .loginPage("/login")
            .defaultSuccessUrl("/dashboard")
            .permitAll()
        )
        // Login OAuth2
        .oauth2Login(oauth -> oauth
            .loginPage("/login")
            .userInfoEndpoint(userInfo -> userInfo
                .userService(customOAuth2UserService)
            )
            .defaultSuccessUrl("/dashboard")
        )
        .logout(logout -> logout.permitAll())
        .build();
}

---

7. OAuth2 para API REST (JWT + OAuth2)

Flujo Híbrido

Endpoint para Intercambio de Token

@RestController
@RequestMapping("/api/auth")
@RequiredArgsConstructor
public class OAuth2TokenController {

    private final GoogleIdTokenVerifier verifier;
    private final UserService userService;
    private final JwtService jwtService;

    @PostMapping("/google")
    public ResponseEntity<AuthResponse> googleAuth(@RequestBody GoogleAuthRequest request) {
        try {
            // Validar el token de Google
            GoogleIdToken idToken = verifier.verify(request.getIdToken());
            if (idToken == null) {
                return ResponseEntity.status(HttpStatus.UNAUTHORIZED).build();
            }

            GoogleIdToken.Payload payload = idToken.getPayload();
            String email = payload.getEmail();
            String name = (String) payload.get("name");
            String pictureUrl = (String) payload.get("picture");

            // Crear o buscar el usuario
            User user = userService.findOrCreateGoogleUser(email, name, pictureUrl);

            // Generar JWT
            UserDetails userDetails = new CustomUserDetails(user);
            String accessToken = jwtService.generateToken(userDetails);
            String refreshToken = jwtService.generateRefreshToken(userDetails);

            return ResponseEntity.ok(AuthResponse.builder()
                .accessToken(accessToken)
                .refreshToken(refreshToken)
                .username(user.getUsername())
                .build());

        } catch (Exception e) {
            return ResponseEntity.status(HttpStatus.UNAUTHORIZED).build();
        }
    }
}

---

8. Resumen

Conceptos Clave

Término	Descripción
OAuth2	Protocolo de autorización
Authorization Code	Flujo para aplicaciones web
Access Token	Acceso a los recursos
ID Token	Identidad del usuario (OpenID Connect)

Configuración Mínima

spring.security.oauth2.client.registration.google.client-id=XXX
spring.security.oauth2.client.registration.google.client-secret=YYY

Enlaces de Login

/oauth2/authorization/google  → Login Google
/oauth2/authorization/github  → Login GitHub

---

🎯 Próximo Paso

Ahora que domina la autenticación, pasemos a las funcionalidades de seguridad avanzada (CSRF, CORS, @PreAuthorize).

➡️ Capítulo 5: Seguridad Avanzada

---

⬅️ Volver al Módulo 8