首页 > 解决方案 > Vue js axios 请求 Spring Boot API 身份验证

问题描述

我的 Vue js (Nuxt) 前端向后端 Spring Boot API 发出 axios 请求。一切正常。现在我尝试使用 Spring Boot 安全性 (LDAP) 启用基本身份验证。

当我直接访问我的 API 时,会出现一个简单的浏览器登录弹出窗口。有用。问题是当我的前端发出 API axios 请求时,我得到 HTTP 401。

未捕获(承诺中)错误:请求失败,状态码为 401

Spring Boot 没有注册任何东西......

我的 Spring Boot 安全配置

@Override
    protected void configure(final HttpSecurity http)
            throws Exception {
        http.httpBasic()
            .and()
            .cors()
            .and()
            .authorizeRequests()
            .anyRequest()
            .authenticated()
            .and()
            .csrf()
            .disable();
    }
    @Override
    protected void configure(final AuthenticationManagerBuilder auth)
            throws Exception {
        auth.ldapAuthentication()
            .contextSource().url(ldapUrl)
            .and()
            .userSearchFilter(userSearchFilter);
    }
    @Bean
    CorsConfigurationSource corsConfigurationSource() {
        final UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        CorsConfiguration configuration = new CorsConfiguration().applyPermitDefaultValues();
        configuration.setAllowedOrigins(Collections.singletonList("*"));
        configuration.addAllowedMethod(HttpMethod.GET);
        configuration.addAllowedMethod(HttpMethod.POST);

        source.registerCorsConfiguration("/**", configuration);
        return source;
    }

我需要另外配置我的前端吗?此外,我的前端使用 NGINX

标签: springspring-bootvue.jsnginxspring-security

解决方案


因为我只能猜测,而您没有收到任何进一步的信息。

尝试添加configuration.addAllowedMethod(HttpMethod.GET);到 CorsConfiguration。

喜欢:

@Bean
CorsConfigurationSource corsConfigurationSource() {
    final UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
    CorsConfiguration configuration = new CorsConfiguration().applyPermitDefaultValues();
    configuration.setAllowedOrigins(Collections.singletonList("*"));
    configuration.addAllowedMethod(HttpMethod.GET);
    configuration.addAllowedMethod(HttpMethod.POST);
    configuration.addAllowedMethod(HttpMethod.OPTIONS);

    source.registerCorsConfiguration("/**", configuration);
    return source;
}

由于预检请求,这将(或可以)工作。

此外,您是否检查过它是否在没有身份验证的情况下工作?


推荐阅读