The problem
I'm trying to build a login page backend with Spring Boot that allows both authentication using credentials stored in database (with UserDetails / UserDetailsService) and OAuth 2 with Google account, esentially a backend for something like this (https://prnt.sc/11krtsi). Problem I'm facing is that I can't create something like a custom page that encapsulates both of those authentication methods at some route like /login. At most I've managed to have both the default Spring form and default OAuth inputs on same page (photos: https://prnt.sc/11kt2fw ; https://prnt.sc/11ktdci ) but they have problems like showing alerts in two different places. The backend part works good, in the sense that I can login with both of those only for default Spring forms.What I'm trying to do
I want to create a small custom form that binds with Spring Boot back end, that allows similar functionality (checks credentials, shows alerts when bad credentials are sent or when user is disabled or when you sign out) but with different appearence (hence something like this : https://prnt.sc/11krtsi).
Also I'd like to have the login page at a different end point (something like api/v1/login).
What I've tried.
-I've tried to do something like creating a new view drawn by a controller mapped at api/v1/login and removing the login form from security config but as expected it broke the login validation part as I couldn't change the endpoint in the config. I previously thought of having UserDetailsService login at api/v1/login/auth and Google auth at /api/v1/login/googleAuth that redirect to the given google api link.
-I've also tried to create a custom login form just for the UserDetailsService Login .formLogin() and than chaining it .oauth2Login() but I've had OAuth input not showing up (.formLogin() styled and showed perfectly and the login validated credentials properly, showed notifications etc).
Questions I have
How to have multiple login methods on a rendered view (https://prnt.sc/11krtsi) What could be a decent approach?
(X/Y) How to change .formLogin() to be available at a custom endpoint and ouath2 to another endpoint in order to redirect from a common form having links to both endpoints?
My WebSecurityConfig at this moment (only serves a /login page with default forms (formLogin, oauth2) on top of the other) looks like this:
@Configuration
@AllArgsConstructor
@EnableWebSecurity
public class WebSecurityConfig extends WebSecurityConfigurerAdapter {
private final UserService userService;
private final BCryptPasswordEncoder bCryptPasswordEncoder;
@Override
protected void configure(HttpSecurity http) throws Exception {
http.csrf().disable()
.authorizeRequests()
.antMatchers("/api/v*/**", "/css/**")
.permitAll()
.anyRequest().permitAll()
.and()
.oauth2Login().defaultSuccessUrl("/api/v1/index")
.and()
.formLogin().defaultSuccessUrl("/api/v1/index")
.and()
.logout()
.invalidateHttpSession(true)
.clearAuthentication(true);
}
@Override
protected void configure(AuthenticationManagerBuilder auth) throws Exception {
auth.authenticationProvider(daoAuthenticationProvider());
}
@Bean
public DaoAuthenticationProvider daoAuthenticationProvider(){
DaoAuthenticationProvider provider =
new DaoAuthenticationProvider();
provider.setPasswordEncoder(bCryptPasswordEncoder);
provider.setUserDetailsService(userService);
return provider;
}
}
Also one thing that could be important is that I need to integrate this backend part with the frontend done in Angular. I'm trying to create this custom form just so I know what I need to do when I need to integrate our Spring Boot back end part with their front end.
Thank you very much for taking time to read my question. Any kind of feedback is greatly appreciated.