title: Access to XMLHttpRequest at 'http://localhost:8080/api/auth/userdetails' from origin 'http://localhost:4200' has been blocked by CORS policy
body: <p>I have create a REST service to authenticate and It was successful.</p>
  <p>I have created another service and calling the service by passing token.</p>
  <p>It's working fine in Postman.</p>
  <p><a href="https://i.stack.imgur.com/9H3EC.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/9H3EC.jpg" alt="enter image description here" /></a></p>
  <p>I am trying to call it from Angular.</p>
  <p><a href="https://i.stack.imgur.com/DGVn1.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/DGVn1.jpg" alt="enter image description here" /></a></p>
  <p>The login form working fine.</p>
  <pre class="lang-js prettyprint-override"><code>loginURL: string = 'localhost:8080/authenticate';
  
  this.http.post(this.loginURL, {
      username: 'headoffice',
      password: 'guest'
  }).subscribe((successResp) =&gt; {
          resolve(successResp);
      },
      (errorResp) =&gt; {
          resolve(errorResp);
      }
  );
  </code></pre>
  <p>But when I am calling the localhost:8080/api/auth/userdetails</p>
  <pre class="lang-js prettyprint-override"><code>userDetailsURL: string = 'localhost:8080/api/auth/userdetails';
  token: string = '.....';
  
  this.http.post(this.userDetailsURL, null, {
      headers: new HttpHeaders({
          'Authorization': 'Bearer ' + token
      })
  }).subscribe((successResp) =&gt; {
          resolve(successResp);
      },
      (errorResp) =&gt; {
          resolve(errorResp);
      }
  );
  </code></pre>
  <p>I am getting the error like</p>
  <pre><code>Access to XMLHttpRequest at 'http://localhost:8080/api/auth/userdetails' from origin 'http://localhost:4200' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.
  zone-evergreen.js:2845 POST http://localhost:8080/api/auth/userdetails net::ERR_FAILED
  </code></pre>
  <p>This is the websecurityconfigurer</p>
  <pre class="lang-java prettyprint-override"><code> protected void configure(HttpSecurity httpSecurity) throws Exception {
       httpSecurity.csrf().disable().authorizeRequests()
           .antMatchers(&quot;/authenticate&quot;).permitAll().anyRequest()
           .authenticated().and().exceptionHandling()
           .authenticationEntryPoint(jwtAuthenticationEntryPoint)
           .and().sessionManagement()
           .sessionCreationPolicy(SessionCreationPolicy.STATELESS).and()
           .addFilterBefore(customJwtAuthenticationFilter, UsernamePasswordAuthenticationFilter.class);
   }
  </code></pre>
  <p>This is WebMvcConfigurer</p>
  <pre class="lang-java prettyprint-override"><code> public void addCorsMappings(CorsRegistry registry) {
       registry.addMapping(&quot;/**&quot;)
           .allowedMethods(&quot;GET&quot;, &quot;POST&quot;, &quot;PUT&quot;, &quot;PATCH&quot;, &quot;DELETE&quot;, &quot;OPTIONS&quot;, &quot;HEAD&quot;, &quot;TRACE&quot;, &quot;CONNECT&quot;)
           .allowedOrigins(&quot;http://localhost:4200&quot;);
   }
  </code></pre>
  <p>Please help me out.</p>
  <p>Why it's working in postman and not working in Angular.</p>
  <p>What did I miss?</p>