How to login/authenticate with Spring Security + Angular

I am trying to do a webapp using Spring boot 2.3.1 + spring security + angular 7.
Right now, my main goal is if the user wants to log in (using the custom angular login page), the frontend sends the datas (username and password) to backend and there I want to authenticate and send back a message to frontend(like: OK message or something)

My project works like this:
With maven I build the angular frontend and from the "dist" folder I copy the files/folders and put into the backend resources folder. With this solution, everything is working, now I want to add the spring security part.

SecurityConfig.java

@Configuration
@EnableWebSecurity
public class SecurityConfiguration extends WebSecurityConfigurerAdapter {
@Override
protected void configure(final AuthenticationManagerBuilder auth) throws Exception {
auth.inMemoryAuthentication()
.withUser("user1").password("{noop}password123").roles("USER");
}
@Override
protected void configure(final HttpSecurity http) throws Exception {
http
.csrf().disable()
.authorizeRequests()
//.antMatchers(HttpMethod.POST, "/auth").permitAll() // I tried this but nothing
.antMatchers(HttpMethod.GET, "/login", "/index*", "/static/**", "/*.js", "/*.json", "/*.ico", "/*.sccs", "/*.woff2", "/*.css").permitAll()
.anyRequest().authenticated()
.and()
.formLogin()
.loginPage("/")
.loginProcessingUrl("/auth")
.usernameParameter("username")
.passwordParameter("password")
.failureUrl("/index.html?error=true")
.permitAll();
}
}

ApiController.java

@RestController
public class ApiController {
@PostMapping("/auth")
public boolean login(@RequestBody User user) {
return user.getUserName().equals("user") && user.getPassword().equals("password"); // I would like to authenticate with auth.inMemoryAuthentication()
}
}

I have a User.java with 2 variables (username and password)

login.components.ts

import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
import { FormGroup } from '@angular/forms';
import { LoggerService } from '@app/core/services/logger.service';
import { Http } from "@angular/http";
import { FormControlHelper, Globals } from '@app/core/helpers/index';
import { loginValidation } from '@app/models/form-validations/index';
import { HttpParams, HttpHeaders} from "@angular/common/http";
import { URLSearchParams } from "@angular/http"
import { MatSnackBar } from '@angular/material/snack-bar';
@Component({
selector: 'app-login',
templateUrl: './login.component.html',
})
export class LoginComponent implements OnInit {
// Properties
globals: Globals;
public loginForm: FormGroup;
public loginValidationModel: any;
public waiting: boolean;
public hidePassword: boolean;
public params = new HttpParams();
constructor(
globals: Globals,
private router: Router,
private logger: LoggerService,
public http : Http,
private snackBar: MatSnackBar
) {
this.loginValidationModel = loginValidation;
this.hidePassword = true;
this.globals = globals;
}
openSnackBar(message: string, action: string) {
this.snackBar.open(message, action, {
duration: 5000,
verticalPosition: 'top', // 'top' | 'bottom'
horizontalPosition: 'center', //'start' | 'center' | 'end' | 'left' | 'right'
panelClass: ['red-snackbar'],
});
}
ngOnInit() {
const formGroupObj = FormControlHelper.generateFormControls(this.loginValidationModel);
if (formGroupObj) {
this.loginForm = new FormGroup(formGroupObj);
} else {
this.logger.error(new Error('Error generating the form modal & validations'));
}
}
public onSubmit() {
let urlSearchParams = new URLSearchParams();
urlSearchParams.append('username', this.loginForm.value.username );
urlSearchParams.append('password', this.loginForm.value.password );
console.log("urlSearchParams: " + urlSearchParams);
this.http.post("auth", urlSearchParams)
.subscribe(
response => {
if(response) { //Here I always get code 200 with "OK" status, even if the username/password is bad, I don't know how to fix this part
this.globals.loggeduser=this.loginForm.value.username;
this.router.navigateByUrl('/somewhere');
} else {
alert("Authentication failed");
}
}
);
} 
}

I tried this <https://spring.io/guides/tutorials/spring-security-and-angular-js/> to understand it (with some Baeldung tutorials), but I am a bit confused now. Can somebody help me? Thank you and have a nice day.

Edit: I build a .war file and using a Tomcat.

Edit2: More details and some progession. I show 2 examples, login with 1 valid and 1 invalid username/password. I can see that I get this "?error" part in the url, if the username/password is invalid. My problem: despite of the error, on the frontend side I am able to login and I can reach everything (subpages). How can I solve this issue? (if the login is valid -> redirect and authenticate on backend/frontend and store it, so I don't have to login on subpages ALSO if the login is invalid, don't redirect just stay on the login page with some error message) I know I have to rework the "public onSubmit()" method inside of login.component, but I am not sure how. Note: both response have "OK" true and status 200, which is not okay I guess

Edit3: I have 1 more question: If i am correct, with loginProcessingUrl I can't handle the datas with controller (mapping to /auth). So it is useless in this case, right?

I found a possible solution.

I reworked the SecurityConfiguration.java a little bit (added succesHandler/failureHandler)

SecurityConfiguration.java

@Override
protected void configure(final HttpSecurity http) throws Exception {
http.csrf().disable().authorizeRequests()
.antMatchers(HttpMethod.GET, "/login", "/index*", "/static/**", "/*.js", "/*.json", "/*.ico", "/*.sccs","/*.woff2", "/*.css").permitAll()
.anyRequest()
.authenticated()
.and()
.formLogin()
.loginPage("/")
.loginProcessingUrl("/auth")
.usernameParameter("username")
.passwordParameter("password")
.successHandler(successHandler())
.failureHandler(failureHandler())
.permitAll()
.and()
.logout().permitAll();
}
private AuthenticationSuccessHandler successHandler() {
return new AuthenticationSuccessHandler() {
@Override
public void onAuthenticationSuccess(HttpServletRequest httpServletRequest,
HttpServletResponse httpServletResponse, Authentication authentication)
throws IOException, ServletException {
httpServletResponse.getWriter().append("OK");
httpServletResponse.setStatus(200);
}
};
}
private AuthenticationFailureHandler failureHandler() {
return new AuthenticationFailureHandler() {
@Override
public void onAuthenticationFailure(HttpServletRequest httpServletRequest,
HttpServletResponse httpServletResponse, AuthenticationException e)
throws IOException, ServletException {
httpServletResponse.getWriter().append("Authentication failure");
httpServletResponse.setStatus(401);
}
};
}

And after that I changed frontend login component too.

    let urlSearchParams = new URLSearchParams();
urlSearchParams.append('username', this.loginForm.value.username );
urlSearchParams.append('password', this.loginForm.value.password );
if(this.loginForm.value.username != null && this.loginForm.value.password != null) {
this.http.post("auth", urlSearchParams).subscribe(
response => {
if(response.status == 200 && response.ok == true) {
this.globals.loggeduser=this.loginForm.value.username;
this.router.navigateByUrl('/somewhere');
} else {
this.openSnackBar("Wrong username or password!","");
}
} 
);
}

And after these changes everything is working.