无法通过 Reactjs 在 Springboot Security 中进行身份验证
Unable to Authenticate in Springboot Security through Reactjs
我目前正在构建一个应用程序,后台使用 Springboot,前端使用 Reactjs。
springboot的安全功能很好。后端在 http://localhost:8080/ 上运行,Reactjs(前端)在 http://localhost:3000/ 上运行。
我怎样才能在我的 Reactjs 登录页面上获得默认的 springboot 登录页面。
这是我的安全配置 class
@EnableGlobalMethodSecurity(prePostEnabled = true)
@EnableWebSecurity
public class SecurityConfiguration extends WebSecurityConfigurerAdapter {
...
@Override
protected void configure(HttpSecurity http) throws Exception {
http.authorizeRequests()
.antMatchers("/").permitAll()
.antMatchers("/login/*").permitAll()
.antMatchers("/createNewUser/*").hasAnyRole("Admin")
.antMatchers("/deleteUser/*").hasAnyRole("Admin")
.antMatchers("/test1/**").hasAnyRole("Admin","RegularUser")
.antMatchers("/test5/**").hasAnyRole("Admin")
.antMatchers("/test2/**").authenticated()
.antMatchers("/test4/**").authenticated()
// .antMatchers("/test/**").hasAnyRole("ADMIN")
.and().formLogin()
.loginProcessingUrl("/login/process")
.successHandler(customLoginSuccessHandler)
.and().csrf().disable()
.logout(logout -> logout
.permitAll()
.logoutUrl("/logout")
.logoutSuccessHandler((request, response, authentication) -> {
response.setStatus(HttpServletResponse.SC_OK);
}
));
}
}
对于其他 URL 不安全的,我可以在我的 React 应用程序上毫无问题地访问它。
但是当我用 Axios 在 Reactjs 中调用例如 http://localhost:8080/test2/ 时,我得到一个 403 错误(禁止访问)。
但是在浏览器上,当我调用相同的 url 时,我可以对自己进行身份验证并访问所需的资源。
因此可以得出结论,这两个应用程序可以完美运行,但它们之间没有任何联系。
经过大量研究,我终于找到了问题的答案。
我需要实现 JWT(Json Web Token)
然后摆脱,因为身份验证是通过 Url
.and().formLogin()
.loginProcessingUrl("/login/process")
.successHandler(customLoginSuccessHandler)
.and().csrf().disable()
.logout(logout -> logout
.permitAll()
.logoutUrl("/logout")
.logoutSuccessHandler((request, response, authentication) -> {
response.setStatus(HttpServletResponse.SC_OK);
}
));
我目前正在构建一个应用程序,后台使用 Springboot,前端使用 Reactjs。 springboot的安全功能很好。后端在 http://localhost:8080/ 上运行,Reactjs(前端)在 http://localhost:3000/ 上运行。 我怎样才能在我的 Reactjs 登录页面上获得默认的 springboot 登录页面。
这是我的安全配置 class
@EnableGlobalMethodSecurity(prePostEnabled = true)
@EnableWebSecurity
public class SecurityConfiguration extends WebSecurityConfigurerAdapter {
...
@Override
protected void configure(HttpSecurity http) throws Exception {
http.authorizeRequests()
.antMatchers("/").permitAll()
.antMatchers("/login/*").permitAll()
.antMatchers("/createNewUser/*").hasAnyRole("Admin")
.antMatchers("/deleteUser/*").hasAnyRole("Admin")
.antMatchers("/test1/**").hasAnyRole("Admin","RegularUser")
.antMatchers("/test5/**").hasAnyRole("Admin")
.antMatchers("/test2/**").authenticated()
.antMatchers("/test4/**").authenticated()
// .antMatchers("/test/**").hasAnyRole("ADMIN")
.and().formLogin()
.loginProcessingUrl("/login/process")
.successHandler(customLoginSuccessHandler)
.and().csrf().disable()
.logout(logout -> logout
.permitAll()
.logoutUrl("/logout")
.logoutSuccessHandler((request, response, authentication) -> {
response.setStatus(HttpServletResponse.SC_OK);
}
));
}
}
对于其他 URL 不安全的,我可以在我的 React 应用程序上毫无问题地访问它。 但是当我用 Axios 在 Reactjs 中调用例如 http://localhost:8080/test2/ 时,我得到一个 403 错误(禁止访问)。 但是在浏览器上,当我调用相同的 url 时,我可以对自己进行身份验证并访问所需的资源。 因此可以得出结论,这两个应用程序可以完美运行,但它们之间没有任何联系。
经过大量研究,我终于找到了问题的答案。 我需要实现 JWT(Json Web Token) 然后摆脱,因为身份验证是通过 Url
.and().formLogin()
.loginProcessingUrl("/login/process")
.successHandler(customLoginSuccessHandler)
.and().csrf().disable()
.logout(logout -> logout
.permitAll()
.logoutUrl("/logout")
.logoutSuccessHandler((request, response, authentication) -> {
response.setStatus(HttpServletResponse.SC_OK);
}
));