Agfdhyk

So I've looked around for the answer to my problem for quite a while now and tried many suggestions but I can't seem to find an answer.

The problem is, when I use Postman to check if basic auth works I get a 200 code back and it's all good, but as soon as I try to authenticate using my Login Component I get the code 401 back and says "Full authentication is required to access this resource".

I'm fairly new to Angular and completely new to using Basic Auth so I have no idea why does it work with Postman and why doesn't it work from the app.

Any help is appreciated

Below are the relevant codes

log-in.component.ts:

onLogin(form: NgForm) {

    /* ... */

    let headers = new Headers();

    let userCredentials = user.userName + ":" + user.password;

    headers.append("Origin", "http://localhost:8080");

    headers.append("Authorization", "Basic " + btoa(userCredentials));



    return this.http.post('http://localhost:8080/api/users/login', headers).subscribe(

      (response) => {

        /* ... */

      },

      (error) => {

        console.log(error);

      }

    );

}

Endpoint on the server side:

@PostMapping(LOG_IN)

public ResponseEntity<User> login() {

    return ResponseEntity.ok().build();

}

WebSecurityConfig:

@Configuration

@EnableWebSecurity

@EnableGlobalMethodSecurity(securedEnabled = true)

public class WebSecurityConfig extends WebSecurityConfigurerAdapter {

    @Override

    protected void configure(HttpSecurity http) throws Exception {

        http

            .cors()

                .and()

            .csrf().disable()

            .authorizeRequests()

                .antMatchers("/h2/**").permitAll()

                .anyRequest().authenticated()

                .and()

            .httpBasic()

                .authenticationEntryPoint(getBasicAuthEntryPoint())

                .and()

            .headers()

                .frameOptions().disable()

                .and()

            .sessionManagement()

                .sessionCreationPolicy(SessionCreationPolicy.STATELESS);

    }



    @Autowired

    protected void configureGlobal(AuthenticationManagerBuilder auth) throws Exception {

        auth

            .inMemoryAuthentication()

            .withUser("admin").password("1234").roles("ADMIN");

    }



    @Autowired

    private UserDetailsService userDetailsService;



    @Autowired

    protected void configureAuthentication(AuthenticationManagerBuilder auth) throws Exception {

        auth

            .userDetailsService(userDetailsService)

            .passwordEncoder(passwordEncoder());

    }



    @Bean

    public CustomBasicAuthenticationEntryPoint getBasicAuthEntryPoint(){

        return new CustomBasicAuthenticationEntryPoint();

    }



    @Bean

    public BCryptPasswordEncoder passwordEncoder() {

        return new BCryptPasswordEncoder();

    }

}

CustomBasicAuthenticationEntryPoint:

public class CustomBasicAuthenticationEntryPoint extends BasicAuthenticationEntryPoint {



    @Override

    public void commence(final HttpServletRequest request, 

            final HttpServletResponse response, 

            final AuthenticationException authException) throws IOException, ServletException {

        response.setStatus(HttpServletResponse.SC_UNAUTHORIZED);

        response.addHeader("WWW-Authenticate", "Basic realm=" + getRealmName() + "");



        PrintWriter writer = response.getWriter();

        writer.println("HTTP Status 401 : " + authException.getMessage());

    }



    @Override

    public void afterPropertiesSet() throws Exception {

        setRealmName("MY REALM");

        super.afterPropertiesSet();

    }

}

MyUserDetailsService:

@Service

public class MyUserDetailsService implements UserDetailsService {

    @Autowired

    private UserRepository userRepository;



    @Autowired

    private AuthenticatedUser authenticatedUser;



    @Override

    @Transactional(readOnly = true)

    public UserDetails loadUserByUsername(String username) throws UsernameNotFoundException {

        Optional<User> oUser = userRepository.findByUserName(username);



        if (!oUser.isPresent()) {

            throw new UsernameNotFoundException(username);

        }



        User user = oUser.get();

        authenticatedUser.setUser(user);

        Set<GrantedAuthority> grantedAuthorities = new HashSet<>();

    grantedAuthorities.add(new SimpleGrantedAuthority(user.getRole().toString()));



        return new org.springframework.security.core.userdetails.User(user.getUserName(), user.getPassword(), grantedAuthorities);

    }

}

You need to pass the headers as 3rd parameter for the post method. The 2nd one is the body

return this.http.post('http://localhost:8080/api/users/login', {}, {headers}).subscribe(

  (response) => {

If you are using angular 6, you should really be using the new HttpClient class, the old Http class being deprecated

This is because the browser send OPTION method to the server before send your request, , try to update your security configuration by allowing OPTION method. like this

protected void configure(HttpSecurity http) throws Exception

{

     http

    .csrf().disable()

    .authorizeRequests()

      .antMatchers(HttpMethod.OPTIONS,"/path/to/allow").permitAll()//allow CORS option calls

      .antMatchers("/resources/**").permitAll()

      .anyRequest().authenticated()

    .and()

    .formLogin()

    .and()

    .httpBasic();

}