Question

所以，我正在开发一个需要身份验证的 Angular 5 应用。 Angular app正在从 Spring Boot API中检索数据。对于身份验证，我会向API发送电子邮件和密码，如果正确，则会向我发回JWT令牌。我已经读过在localStorage中存储令牌不是一个好主意，因为它可以通过javascript访问，因此容易受到攻击。因此，我希望使用 httponly 和安全标记将JWT存储到Cookie中。

然而，问题是因为Angular app和Spring Boot应用程序在不同的源上运行，因此从Spring收到的响应无法设置cookie。

我想知道如何在登录成功时实现这一点，我的API为角度应用程序设置了cookie，这可能存在于另一个域中。

这是我的身份验证资源：

@PostMapping("/login")
    public ResponseEntity<LoginResponse> loginUser(@RequestBody LoginRequest request, HttpServletResponse res) {
        LoginResponse response = new LoginResponse("this_is_my_token");
        Cookie cookie = new Cookie("token", "this_is_my_token");
        cookie.setPath("/");
        cookie.setSecure(true);
        cookie.setHttpOnly(true);
        res.setHeader("Access-Control-Allow-Credentials", "true");
        res.addCookie(cookie);
        return ResponseEntity.ok().body(response);
    }

我还配置了CORS过滤器：

@Bean
    public WebMvcConfigurer cors() {
        return new WebMvcConfigurer() {
            @Override
            public void addCorsMappings(CorsRegistry registry) {
                registry.addMapping("/**")
                        .allowedOrigins("http://localhost:4200") //current angular host, later will be changed
                        .allowCredentials(true)
                        .allowedHeaders("*");
            }
        };
    }

然后在我的Angular应用程序中，我有这项服务：

@Injectable()
export class LoginSerivce {
    private headers: HttpHeaders;

    constructor(private http: HttpClient) {
        this.headers = new HttpHeaders({
            "Content-Type": "application/json",
            "Access-Control-Allow-Credentials": "true"
        });
    }

    public getToken() {
        const data = JSON.stringify({
            email: "test",
            geslo: "Test"
        });
        this.http.post("http://localhost:8080/v1/auth/login",
            data, {headers: this.headers, withCredentials: true})
            .toPromise()
            .then(
                (resp) => {
                    console.log(resp);
                },
                (err) => {
                    console.log("error: ", err);
                }
            );
    }
}

使用带有Spring Boot和Angular 5的httponly cookie进行JWT身份验证

0 个答案: