前端调用集成Okta SAML 2.0的后端API遇302重定向求助

可能的原因 #

• 认证Cookie未传递：浏览器地址栏访问时会自动携带认证后的Session Cookie，但前端AJAX/fetch请求默认不会携带Cookie，后端无法识别已认证会话，触发SAML登录重定向。
• 跨域请求的CORS配置缺失：当前后端配置直接禁用了CORS（cors().disable()），如果前端和后端跨域，浏览器会阻止Cookie传递，导致后端判定未认证。
• 请求上下文差异：浏览器直接访问会携带完整的浏览器会话上下文（如User-Agent、Session Cookie），而前端请求可能缺少关键标识，后端SAML认证流程无法匹配已存在的会话。
• API请求的认证处理逻辑缺失：后端当前配置对所有请求强制认证，但未区分页面请求和API请求，API请求未认证时默认返回302重定向到SAML登录页，而非适合前端处理的401响应。

排查步骤 #

• 对比浏览器直接访问API和前端调用API的请求头：重点检查Cookie、X-Requested-With、Origin字段是否一致。
• 测试前端请求手动添加认证Cookie：在开发者工具中修改请求头加入认证后的Session Cookie，观察是否仍返回302，验证Cookie传递是否为核心问题。
• 查看后端认证日志：确认前端请求到达时，后端是否检测到已存在的认证会话，还是直接进入SAML认证流程。
• 检查前端请求配置：确认是否开启了withCredentials（或credentials: 'include'）选项。

解决方法 #

前端侧调整 #

• 同域请求：在AJAX/fetch请求中开启凭证携带：
  • Axios示例：

    axios.get('/api/your-endpoint', { withCredentials: true })
    

  • Fetch示例：

    fetch('/api/your-endpoint', { credentials: 'include' })
    

• 跨域请求：除了上述配置，还需要后端配合开启CORS并允许凭证传递。

后端配置优化（基于提供的SecurityConfig） #

1. 修复CORS配置：替换直接禁用CORS的逻辑，配置允许前端域名和凭证传递：

   @Bean
   public CorsConfigurationSource corsConfigurationSource() {
       CorsConfiguration config = new CorsConfiguration();
       // 替换为实际前端域名，支持多个域名用Arrays.asList
       config.setAllowedOrigins(Arrays.asList("https://your-frontend-domain.com"));
       config.setAllowedMethods(Arrays.asList("GET", "POST", "PUT", "DELETE"));
       config.setAllowedHeaders(Arrays.asList("*"));
       config.setAllowCredentials(true);
   
       UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
       source.registerCorsConfiguration("/**", config);
       return source;
   }
   

   然后在configure(HttpSecurity http)中启用CORS：

   http.cors().configurationSource(corsConfigurationSource())
       .and()
       .authorizeRequests(authorize -> authorize.anyRequest().authenticated())
       .saml2Login()
       .and()
       .csrf().disable();
   

2. 区分API和页面请求的认证响应：对API请求返回401而非302，避免前端被重定向：

   http.exceptionHandling()
       .authenticationEntryPoint((request, response, authException) -> {
           // 识别API请求：通过XHR标识或URL前缀判断
           boolean isApiRequest = "XMLHttpRequest".equals(request.getHeader("X-Requested-With")) 
                                   || request.getRequestURI().startsWith("/api/");
           if (isApiRequest) {
               response.setStatus(HttpServletResponse.SC_UNAUTHORIZED);
               response.setContentType("application/json");
               response.getWriter().write("{\"error\": \"Unauthorized\"}");
           } else {
               // 页面请求仍重定向到SAML登录
               response.sendRedirect("/saml2/login/" + registrationId);
           }
       })
       .and();
   

3. 优化Session Cookie配置：确保跨域/子域场景下Cookie能正常传递：

   http.sessionManagement()
       .sessionCreationPolicy(SessionCreationPolicy.IF_REQUIRED)
       .and()
       .cookieConfig(cookie -> {
           cookie.sameSite("Lax"); // 跨域场景可改为"None"，需配合HTTPS
           cookie.secure(true); // 生产环境开启HTTPS时启用
           cookie.httpOnly(true);
       });
   

内容的提问来源于stack exchange，提问作者Vikas Konaparthi