Reactjs 如何允许使用Spring Security访问特定的React哈希路由?

Reactjs 如何允许使用Spring Security访问特定的React哈希路由?,reactjs,spring-security,react-router,jwt,spring-security-oauth2,Reactjs,Spring Security,React Router,Jwt,Spring Security Oauth2,我试图限制未经验证的用户访问我们的Reactjs单页应用程序中的任何路由。我们使用HashRouter来处理UI端的路由,所以我们的URL看起来像,等等。我们使用SpringSecurityOAuth2和JWT 当向应用程序发送请求时,所有请求都以/app/,而不是/app/#/Login、/app/#/Home等形式出现。这对我来说很有意义,因为路由是在客户端上完成的,以呈现正确的路由,但在尝试保护应用程序时会出现问题。为了允许访问登录路径,我需要在Spring Security中允许访问/a

我试图限制未经验证的用户访问我们的Reactjs单页应用程序中的任何路由。我们使用HashRouter来处理UI端的路由,所以我们的URL看起来像,等等。我们使用SpringSecurityOAuth2和JWT

当向应用程序发送请求时,所有请求都以/app/,而不是/app/#/Login、/app/#/Home等形式出现。这对我来说很有意义,因为路由是在客户端上完成的,以呈现正确的路由,但在尝试保护应用程序时会出现问题。为了允许访问登录路径,我需要在Spring Security中允许访问/app/to all,这将打开所有内容

是否可以在Spring Security中保护React哈希路由,或者我必须在路由器的UI端处理这个问题

登录配置

@EnableWebSecurity(debug = true)
@Configuration
@Order(Ordered.HIGHEST_PRECEDENCE + 1)
public class LoginConfig extends WebSecurityConfigurerAdapter {

    @Override
    public void configure(HttpSecurity http) throws Exception {
        http
                .antMatcher("/app/#/login")
                .httpBasic().disable()
                .formLogin().disable()
                .authorizeRequests()
                .antMatchers(HttpMethod.OPTIONS).permitAll()
                .antMatchers(HttpMethod.GET, "/favicon.ico").permitAll()
                .antMatchers("/app/#/login").permitAll()
                .anyRequest().authenticated()
        ;
    }
}
登录配置授予对所有

@EnableWebSecurity(debug = true)
@Configuration
@Order(Ordered.HIGHEST_PRECEDENCE + 1)
public class LoginConfig extends WebSecurityConfigurerAdapter {

    @Override
    public void configure(HttpSecurity http) throws Exception {
        http
                .antMatcher("/app/**")
                .httpBasic().disable()
                .formLogin().disable()
                .authorizeRequests()
                .antMatchers(HttpMethod.OPTIONS).permitAll()
                .antMatchers(HttpMethod.GET, "/favicon.ico").permitAll()
                .antMatchers("/app/**").permitAll()
                .anyRequest().authenticated()
        ;
    }
}
所有其他请求的默认配置

@EnableWebSecurity(debug = true)
@Configuration
@Order(2)
public class SecurityConfig extends WebSecurityConfigurerAdapter {
    @Override
    public void configure(HttpSecurity http) throws Exception {
        http
                .httpBasic().disable()
                .formLogin().disable()
                .csrf().disable()
                .authorizeRequests()
                .antMatchers(HttpMethod.OPTIONS).permitAll()
                .antMatchers(HttpMethod.GET, "/**/favicon.ico").permitAll()
                .antMatchers(HttpMethod.POST, "/oa/oauth/token").permitAll()
                .anyRequest().authenticated()
        ;
    }
}

提前谢谢

你不能。在构建SPA时,您将安全重点转移到保护SPA正在访问的API端点,而不是保护“页面”或“SPA路由”。因此,只需保护向SPA提供数据和功能的服务器端点

例如,如果不允许用户访问“管理”功能,而不是试图阻止路由
/app/#admin
,则您应确保并阻止所有与管理相关的api端点(如
/api/admin
/api/adduser
,…)


这并不意味着您不应该在SPA中包含隐藏禁止链接或阻止用户访问该路线的代码——您应该这样做,因为这有助于获得更好的用户体验。要知道,在SPA中隐藏路由纯粹是为了用户体验,而不是为了安全。安全性是通过保护api来处理的。

谢谢,这就是我要说的,只是想确保我没有遗漏什么。