Spring Security与使用React的Rest API

16 浏览
0 Comments

Spring Security与使用React的Rest API

我正在尝试使用Spring Security、Rest API和React作为前端实现。由于这是我第一个全栈开发项目，我对如何实现适当的身份验证机制一无所知。

我进行了很多搜索，并找到了关于使用Basic Auth的Spring Security文章，但我无法弄清楚如何将该身份验证转换为rest api，然后通过会话/cookie进行管理。即使我找到了一些GitHub参考资料，但它们要么非常陈旧，要么还没有完全迁移到Spring Security 5。

因此，无法确定保护rest api的正确方法。（是仅使用Spring Security，还是Spring Security + JWT，还是Spring Security + JWT + Spring Session + Cookie）

编辑

从数据库验证用户名

@Component
CustomUserDetailsService -> loadUserByUsername -> Mongo Db

密码加密

@Bean
public PasswordEncoder passwordEncoder() { ... }

跨域

@Bean
public WebMvcConfigurer corsConfigurer() { ... }

注册控制器

@RestController
public class RegistrationController {
@PostMapping("/registration")
@ResponseStatus(HttpStatus.CREATED)
@ResponseBody
public ResponseEntity registerUserAccount(... ) { ... }
]

Mongo会话

build.gradle
implementation 'org.springframework.session:spring-session-data-mongodb'
implementation 'org.springframework.boot:spring-boot-starter-data-mongodb'
@Configuration
@EnableMongoHttpSession

以上是我已经实施的内容。之后，我在如何保持用户会话和验证用户方面遇到了困难。

0

2 答案

0 Comments

Spring Security与使用React的Rest API的问题是如何处理基本授权和JWT验证。 在基本授权中，前端应用程序在每次调用API时都必须发送用户凭据，并且需要处理跨域资源共享（CORS）。使用JWT验证可以提供更安全的身份验证，并且可以通过存储在HttpOnly cookie中的令牌来验证会话。

基本授权的解决方法是在前端应用程序的每个请求中包含授权头，并且在后端配置中验证这些凭据。同时，需要进行CORS配置以允许来自前端应用程序的跨域请求。

JWT验证的解决方法是创建一个身份验证端点，前端应用程序将用户凭据发送到该端点。后端将验证凭据并生成一个JWT令牌。该令牌将存储在HttpOnly cookie中，并在后续请求中使用。后端还需要添加一个自定义过滤器来验证请求中的令牌，并在通过验证后将用户标记为已验证。

在前端应用程序中，只需在每个请求中添加“credentials: 'include'”选项即可将cookie与请求一起发送。

通过这些解决方法，可以实现基本授权和JWT验证，从而提供更安全和可靠的身份验证机制。

0
0 Comments

Spring Security with Rest API with React的问题是如何在Spring Security和React中使用Rest API进行身份验证。这个问题出现的原因是作者想要在他的项目中实现前后端分离，并使用React作为前端，Spring Boot和Spring Security作为后端。以下是解决这个问题的步骤：

1. 在数据库中手动创建一个用户。

2. 在React登录页面中调用登录API：

const config = {
  headers: {
    'Content-Type': 'application/x-www-form-urlencoded'
  }
};
axios.post('http://localhost:9090/login',querystring.stringify( { username: username.value, password: password.value }),config).then(response => {
  setLoading(false);
  setUserSession(null, username.value);
  props.history.push('/landingpage');
})

3. 创建一个Spring Boot项目，其中包括：

- 创建一个POST的Rest API来处理登录请求。

- 在pom.xml文件中添加Spring Security的依赖。

- 创建一个实现UserDetailsService接口的类，用于从数据库获取用户详细信息并提供给Spring Security拦截器。

- 在配置文件中配置UserDetailsService类，以便Spring Security能够识别它。

- 在配置文件中继承WebSecurityConfigurerAdapter类，并根据自己的需求声明configure方法（可以在网上找到多个示例）。

这样就完成了，之后就可以使用Spring Security和React进行身份验证了。

0