Java Spring Security ionic4 HTTPリクエスト

Question

私は、Java Springboot REST APIを使用して、ionic4 WebアプリケーションからPOSTリクエストを送信しようとしています。残念ながら、私はログインポストを動作させることができません。プリフライトオプションの要求のみを送信する場合は、HTTPステータス401、403または200を受信します。

thisなど存在するStackOverflowの類似の記事を確認しましたが、エラーが発生しました。以下は、私が様々なチュートリアル&他の投稿からビットを取った後に終わったものです。

私のエラーがSpring SecurityConfigurationまたはTypeScriptのポストリクエストであるかどうかわかりません。私は上記のコードで取得

私の春のセキュリティ設定

@EnableWebSecurity 
@Configuration 
@Order(SecurityProperties.ACCESS_OVERRIDE_ORDER) 
@EnableGlobalMethodSecurity(securedEnabled = true) 
class SecurityConfiguration extends WebSecurityConfigurerAdapter { 

    @Override 
    public void configure(HttpSecurity http) throws Exception { 

     http 
      .authorizeRequests() 

      .requestMatchers(CorsUtils::isPreFlightRequest).permitAll() 
      .antMatchers("/login").permitAll() 
      .antMatchers(HttpMethod.OPTIONS).permitAll() 
      .anyRequest().authenticated() 
      .and() 
      .addFilterBefore(new RestConfig().corsFilter(), CsrfFilter.class) 
      .csrf().csrfTokenRepository(csrfTokenRepository()).and().addFilterAfter(csrfHeaderFilter(), CsrfFilter.class) 
      .formLogin().loginProcessingUrl("/login") 
      .successHandler(successHandler()) 
      .failureHandler(failureHandler()) 
      .and() 
      .exceptionHandling() 
      .and() 
      .csrf().disable(); 
    } 

    private AuthenticationSuccessHandler successHandler() { 
     return new AuthenticationSuccessHandler() { 

      @Override 
      public void onAuthenticationSuccess(HttpServletRequest httpServletRequest, HttpServletResponse httpServletResponse, Authentication authentication) throws IOException, ServletException { 
       httpServletResponse.getWriter().append("OK"); 
       httpServletResponse.setStatus(200); 
      } 
     }; 
    } 

    private AuthenticationFailureHandler failureHandler() { 
     return new AuthenticationFailureHandler() { 

      @Override 
      public void onAuthenticationFailure(HttpServletRequest httpServletRequest, HttpServletResponse httpServletResponse, AuthenticationException e) throws IOException, ServletException { 
       httpServletResponse.getWriter().append("Authentication failure"); 
       httpServletResponse.setStatus(401); 
      } 
     }; 
    } 

    private AccessDeniedHandler accessDeniedHandler() { 
     return new AccessDeniedHandler() { 

      @Override 
      public void handle(HttpServletRequest httpServletRequest, HttpServletResponse httpServletResponse, AccessDeniedException e) throws IOException, ServletException { 
       httpServletResponse.getWriter().append("Access denied"); 
       httpServletResponse.setStatus(403); 
      } 
     }; 
    } 

    private AuthenticationEntryPoint authenticationEntryPoint() { 
     return new AuthenticationEntryPoint() { 

      @Override 
      public void commence(HttpServletRequest httpServletRequest, HttpServletResponse httpServletResponse, AuthenticationException e) throws IOException, ServletException { 
       httpServletResponse.getWriter().append("Not authenticated"); 
       httpServletResponse.setStatus(401); 
      } 
     }; 
    } 

    private Filter csrfHeaderFilter() { 
     return new OncePerRequestFilter() { 

      @Override 
      protected void doFilterInternal(HttpServletRequest request, 
             HttpServletResponse response, FilterChain filterChain) 
       throws ServletException, IOException { 
        CsrfToken csrf = (CsrfToken) request.getAttribute(CsrfToken.class.getName()); 
        if (csrf != null) { 
         Cookie cookie = WebUtils.getCookie(request, "XSRF-TOKEN"); 
         String token = csrf.getToken(); 
         if (cookie == null || token != null 
         && !token.equals(cookie.getValue())) { 
          cookie = new Cookie("XSRF-TOKEN", token); 
          cookie.setPath("/"); 
          response.addCookie(cookie); 
         } 
        } 
       response.setHeader("Access-Control-Allow-Origin", "*"); 
       response.setHeader("Access-Control-Allow-Headers", "*"); 
       response.setHeader("Access-Control-Allow-Credentials", "*"); 
       response.setHeader("Access-Control-Allow-Methods", "*"); 
       response.setHeader("Access-Control-Max-Age", "3600"); 
       filterChain.doFilter(request, response); 
      } 
     }; 
    } 

    private CsrfTokenRepository csrfTokenRepository() { 
     HttpSessionCsrfTokenRepository repository = new HttpSessionCsrfTokenRepository(); 
     repository.setHeaderName("X-XSRF-TOKEN"); 
     repository.setSessionAttributeName("_csrf"); 
     return repository; 
    } 

私の活字体POST

onLogin(loginData: {username: string, password: string}) { 
    let headers = new Headers(); 
    headers.append('Access-Control-Allow-Credentials', 'true'); 
    headers.append('Content-Type','application/x-www-form-urlencoded'); 
    headers.append("Authorization", "Basic " + btoa(loginData.username + ":" + loginData.password)); 


    let body = { 
     username: loginData.username, 
     password: loginData.password 
    } 
    this.http.post('http://localhost:5000/login', body, {headers: headers, withCredentials: true}) 
     .map(res => res.json()) 
     .subscribe(data => { 
      console.log(data); 
      console.log(data.status) 
     }); 
    } 
} 

エラー、私はそれは同じユーザー名&パスワードので、ログインの詳細はありません知っていますPOSTではなく、まあまあで完璧に動作します。

Answer 1

これは私が問題を解決する方法です。

onLogin(loginData: {username: string, password: string}) { 
    let headers = new Headers(); 
    headers.append('Access-Control-Allow-Credentials', 'true'); 
    headers.append('Content-Type','application/x-www-form-urlencoded'); 

    let body = `username=${loginData.username}&password=${loginData.password}`; 

    this.http.post('http://localhost:5000/login', body, {headers: headers}) 

    .map(res => res) 
    .subscribe(data => { 
     console.log(data.status); 
     if (data.status == 200) { 
     this.navCtrl.push(TabsPage); 
     } 
     else { 
     this.showError("Invalid username or password"); 
     } 

    }); 
} 

更新： 主な問題は、URL-encodingこのラインだった：dur