角度post调用作为选项提交给springboot

Question

我正在使用JWT令牌开发端到端应用程序UI Angular、后端Spring Boot。

它达到了我的方法jwtFilter从邮递员和角度。

在jwtFilter之后，我的postman请求到达createJWTtoken方法

从角度来看，它没有到达创建令牌方法，它返回200 OK响应。

Angular将我的请求作为选项提交

角度计程仪

config.JwtRequestFilter    : JWT Token does not begin with Bearer String
DispatcherServlet        : ***OPTIONS*** "/myapp/authenticate", parameters={}
RequestMappingHandlerMapping : Mapped to com.myapp.controller.JwtAuthenticationController#createAuthenticationToken(JwtRequest)
DispatcherServlet        : Completed 200 OK

来自邮递员日志的请求

config.JwtRequestFilter    : JWT Token does not begin with Bearer String
DispatcherServlet        : ***POST*** "/myapp/authenticate", parameters={}
RequestMappingHandlerMapping : Mapped to com.myapp.controller.JwtAuthenticationController#createAuthenticationToken(JwtRequest)
RequestResponseBodyMethodProcessor : Read "application/json;charset=UTF-8" to [com.myapp.model.security.JwtRequest@8d233a8]
JwtAuthenticationController      : Creating jwt token
StatisticsImpl         : HHH000117: HQL: select generatedAlias0 from Users as generatedAlias0 where generatedAlias0.userName=:param0, time: 297ms, rows: 1
HttpEntityMethodProcessor  : Using 'application/json', given [*/*] and supported [application/json, application/*+json, application/json, application/*+json, application/x-jackson-smile, application/cbor]
HttpEntityMethodProcessor  : Writing [com.myapp.model.security.JwtResponse@2127c1d5]
DispatcherServlet        : Completed 200 OK

**@覆盖受保护的void doFilterInternal（HttpServletRequest请求、HttpServletResponse响应、FilterChain链）引发ServletException、IOException{

    final String requestTokenHeader = request.getHeader("Authorization");

    String username = null;
    String jwtToken = null;
    if (requestTokenHeader != null && requestTokenHeader.startsWith("Bearer ")) {
        jwtToken = requestTokenHeader.substring(7);
        try {
            username = jwtTokenUtil.getUsernameFromToken(jwtToken);
        } catch (IllegalArgumentException e) {
            System.out.println("Unable to get JWT Token");
        } catch (ExpiredJwtException e) {
            System.out.println("JWT Token has expired");
        }
    } else {
        logger.warn("JWT Token does not begin with Bearer String");
    }
    if (username != null && SecurityContextHolder.getContext().getAuthentication() == null) {
        UserDetails userDetails = this.jwtUserDetailsService.loadUserByUsername(username);
        if (jwtTokenUtil.validateToken(jwtToken, userDetails)) {
            UsernamePasswordAuthenticationToken usernamePasswordAuthenticationToken = new UsernamePasswordAuthenticationToken(
                    userDetails, null, userDetails.getAuthorities());
            usernamePasswordAuthenticationToken.setDetails(new WebAuthenticationDetailsSource().buildDetails(request));
            SecurityContextHolder.getContext().setAuthentication(usernamePasswordAuthenticationToken);
        }
    }
    chain.doFilter(request, response);//Both postman and angular reach this point.
}**
@Configuration
@EnableWebSecurity
@EnableGlobalMethodSecurity(prePostEnabled = true)
public class WebSecurityConfig extends WebSecurityConfigurerAdapter {
    @Override
    protected void configure(HttpSecurity httpSecurity) throws Exception {
        httpSecurity.csrf().disable()
                .authorizeRequests().antMatchers("/authenticate", "/myapp/authenticate").permitAll().antMatchers(HttpMethod.OPTIONS, "/**").permitAll()
.anyRequest().authenticated().and().
                exceptionHandling().authenticationEntryPoint(jwtAuthenticationEntryPoint).and().sessionManagement()
                    .sessionCreationPolicy(SessionCreationPolicy.STATELESS);
    
    httpSecurity.addFilterBefore(jwtRequestFilter, UsernamePasswordAuthenticationFilter.class);
        }

角度post调用

public baseUrl = 'http://localhost:8081/myapp/authenticate';

  public callService(userInfo:User){
    var username=userInfo.username;
    var password = userInfo.password;
    return this.http.post(this.baseUrl,
    {
      'username': username,
    'password': password
    },
    { headers: new HttpHeaders({
    'Content-Type': 'application/json',
    'Access-Control-Allow-Credentials': 'true',
    'Access-Control-Allow-Origin': '*',
    'Access-Control-Allow-Methods': 'POST',
    'Access-Control-Allow-Headers': 'Origin, Content-Type, Accept, Access-Control-Allow-Origin',
    }), observe: 'response'}
    ).pipe(
      map(userData => {
        sessionStorage.setItem("username", username);
        let tokenStr = "Bearer " + '';
        console.log(tokenStr);
        sessionStorage.setItem("token", tokenStr);
        return userData;
      })
    );
  }

代理配置。json

{
"/api": {
  "target": "http://localhost:8080/",
  "changeOrigin": true,
  "secure": false,
  "pathRewrite": {
  "^/api": ""
}
 }
}

Answer 1

发布飞行前选项请求的不是角度，而是您的浏览器。检查此Angular$超文本传输协议正在发送选项而不是PUT/POST

结论：您必须在spring boot中修复CORS策略，以及spring boot如何处理安全配置中的选项请求。你能在你的问题中添加这部分代码吗。