title: spring CORS and angular not working : HTTP status code 403 error
body: <p>I am new to angular and spring-security.I am having problem with CORS when trying to log in from angular login-form page using basic authentication to the rest endpoint. My Angular code is running on <a href="http://localhost:4200" rel="noreferrer">http://localhost:4200</a> and rest end point on <a href="http://localhost:8181" rel="noreferrer">http://localhost:8181</a>. My angular login-form tries to make request to <a href="http://localhost:8181/token" rel="noreferrer">http://localhost:8181/token</a> which I have specified in my login controller. Even though I have added cors configuration in server side, I get this error :-</p>
  
  <p>Failed to load <a href="http://localhost:8181/token" rel="noreferrer">http://localhost:8181/token</a>: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin '<a href="http://localhost:4200" rel="noreferrer">http://localhost:4200</a>' is therefore not allowed access. The response had HTTP status code 403.</p>
  
  <p>(angular) login.service.ts:-</p>
  
  <pre><code>@Injectable()
  export class LoginService {
    constructor(private http: Http) {}
  
    sendCredential(username: string, password: string) {
      const url = 'http://localhost:8181/token';
      const encodedCredential = username + ':' + password;
      const basicHeader = 'Basic ' + btoa(encodedCredential);
      const headers = new Headers();
      headers.append('Content-Type', 'application/x-wwww-form-urlencoded');
      headers.append('Authorization' ,  basicHeader);
      const opts = new RequestOptions({headers: headers});
      return this.http.get(url, opts);
    }
  </code></pre>
  
  <p>}</p>
  
  <p>(spring) SecurityConfig.java</p>
  
  <pre><code>@Configuration
  @EnableWebSecurity
  public class SecurityConfig extends WebSecurityConfigurerAdapter {
  
  private static final String[] PUBLIC_MATCHERS = {
              "/css/**",
              "/js/**",
              "/image/**",
              "/book/**",
              "/user/**"
      };
  
  @Override
      protected void configure(HttpSecurity http) throws Exception{
          http
                  .cors().and()
                  .csrf().disable()
                  .httpBasic()
                  .and()
                  .authorizeRequests()
                  .antMatchers(PUBLIC_MATCHERS)
                  .permitAll()
                  .anyRequest()
                  .authenticated();
      }
   @Bean
      CorsConfigurationSource corsConfigurationSource() {
          CorsConfiguration configuration = new CorsConfiguration();
          configuration.setAllowedOrigins(Arrays.asList("*"));
          configuration.setAllowedMethods(Arrays.asList("GET","POST","DELETE","PUT","OPTIONS"));
          UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
          source.registerCorsConfiguration("/**", configuration);
          return source;
      }
  
      @Autowired
      public void configureGlobal(AuthenticationManagerBuilder auth) throws Exception {
          auth.userDetailsService(userSecurityService).passwordEncoder(passwordEncoder());
      }
  </code></pre>
  
  <p>LoginController.java</p>
  
  <pre><code>@RestController
  public class LoginController {
  
      @Autowired
      private UserService userService;
  
      @RequestMapping("/token")
      public Map&lt;String, String&gt; token(HttpSession session, HttpServletRequest request) {
          String remoteHost = request.getRemoteHost();
          int portNumber = request.getRemotePort();
          String remoteAddr = request.getRemoteAddr();
  
          System.out.println(remoteHost + ":" + portNumber);
          System.out.println(remoteAddr);
  
  
          return Collections.singletonMap("token", session.getId());
      }
  }
  </code></pre>