Angular Basic Auth Spring Boot

Question

i work with this tutorial https://spring.io/guides/tutorials/spring-security-and-angular-js/#_sso_with_oauth2_angular_js_and_spring_security_part_v using angular 7 and spring boot 2.1.0

my authenticate function in the frontend looks like:

  private api = 'http://localhost:8080/v1/api';

  authenticate(credentials): Observable<User> {
    const headers = new HttpHeaders(credentials ? {
      authorization: 'Basic ' + btoa(credentials.username + ':' + credentials.password)
    } : {});

    return this.http.get<User>(`${this.api}/user`, {headers: headers})
      .pipe(
        retry(3),
        map(user => this.currentUser = user),
        catchError(this.errorHandler)
      );
  }

My security config like that:

@Throws(Exception::class)
override fun configure(http: HttpSecurity) {
    http.cors()
            .and().httpBasic()
            .and().authorizeRequests().antMatchers("/index.html", "/", "/home", "/login").permitAll()
            .anyRequest().authenticated()
            .and().csrf().disable()
}

@Bean
fun corsConfigurationSource(): CorsConfigurationSource {
    val configuration = CorsConfiguration()
    configuration.allowedOrigins = Arrays.asList("http://localhost:4200")
    configuration.allowedMethods = Arrays.asList("GET", "POST", "PUT", "PATCH", "DELETE", "OPTIONS")
    configuration.allowedHeaders = Arrays.asList("authorization", "content-type", "x-auth-token")
    configuration.exposedHeaders = Arrays.asList("x-auth-token")
    val source = UrlBasedCorsConfigurationSource()
    source.registerCorsConfiguration("/**", configuration)
    return source
}

And my Browser sends a OPTIONS with the following headers:

Accept  text/html,application/xhtml+xm…plication/xml;q=0.9,*/*;q=0.8 
Accept-Encoding gzip, deflate 
Accept-Language de,en-US;q=0.7,en;q=0.3 
Access-Control-Request-Headers  authorization,x-requested-with 
Access-Control-Request-Method   GET 
Cache-Control   no-cache 
Connection  keep-alive 
Host    localhost:8080 
Origin  http://localhost:4200 
Pragma  no-cache 
Referer http://localhost:4200/login 
User-Agent  Mozilla/5.0 (Windows NT 10.0; …) Gecko/20100101 Firefox/64.0

Spring Boot answers with 200 OK

Access-Control-Allow-Headers    authorization
Access-Control-Allow-Methods    GET,POST,PUT,PATCH,DELETE,OPTIONS
Access-Control-Allow-Origin http://localhost:4200
Access-Control-Expose-Headers   x-auth-token
Cache-Control   no-cache, no-store, max-age=0, must-revalidate
Content-Length  0
Date    Thu, 22 Nov 2018 19:43:53 GMT
Expires 0
Pragma  no-cache
Vary    Origin
Vary    Access-Control-Request-Method
Vary    Access-Control-Request-Headers
X-Content-Type-Options  nosniff
X-Frame-Options DENY
X-XSS-Protection 1; mode=block

as far as i understand with cors the browser should send the get request with the auth header afterwards? But nothing happened ... what is wrong?

thx

Answer 1

okay got it:

changed the spring config to

http.cors()
        .and().httpBasic()
        .and().authorizeRequests().antMatchers("/index.html", "/", "/home", "/login").permitAll()
        .anyRequest().authenticated()
        .and().csrf().csrfTokenRepository(CookieCsrfTokenRepository.withHttpOnlyFalse());

and add the HttpClientXsrfModule to my angular app. not it works fine.