Java “如何显示”；登录失败。请重试；Api返回响应时的角度消息？

实际上，我在angular中有一个简单的登录屏幕，如下所示：

当输入用户名和密码时，它会成功点击/login url，如果正确，它会转到userdashboard或admindashboard，当用户名和密码不正确时，它会显示我/403 fobidden页面

控制台中的输出如下所示：

实际上我想显示“登录失败，请输入正确的用户名和Passowrd消息”，但api正在表单中返回响应

@PostMapping(value="/login")
    public ResponseEntity<UserDTO> login(@RequestBody User user,HttpServletRequest request,HttpServletResponse response){
        try {
            Authentication authentication= authenticationManager.authenticate(new UsernamePasswordAuthenticationToken(user.getEmail(), user.getPassword()));
            final JwtUser userDetails=(JwtUser) authentication.getPrincipal();
            System.out.println(userDetails.getAuthorities());
            SecurityContextHolder.getContext().setAuthentication(authentication);
            final String token=jwtTokenUtil.generateToken(userDetails);
            response.setHeader("Token",token);
            return new ResponseEntity<UserDTO>(new UserDTO(userDetails.getUser(), token),HttpStatus.OK);
            }catch(Exception e) {
            throw new UnauthorizedExcpetion(e.getMessage());

        } 

userservice.ts

loginUser(user:any):Observable<any>{
         const headers=new HttpHeaders({'Access-Control-Allow-Origin':'*'});
         return this.http.post("http://localhost:8080/login",user,{headers:headers});
   } 

loginUser（用户：任意）：可观察{
const headers=新的HttpHeaders（{'Access-Control-Allow-Origin'：'*'）；
返回此.http.post（“http://localhost:8080/login，用户，{headers:headers}）；
} 

您需要捕捉可观察对象的错误。Observe最多使用3个函数，第一个处理良好数据，第二个处理错误，第三个是最终调用，例如

let subscription = this.data.subscribe(
          (value) => { /* Do something with value */ },
          (error) => { /* Do something with error */ },
          () => { /* Do something with done*/ }
      );

因此，您需要添加一个错误处理程序来捕获您正在讨论的条件

---

参考资料：

您需要捕捉可观测数据的误差。Observe最多使用3个函数，第一个处理良好数据，第二个处理错误，第三个是最终调用，例如

let subscription = this.data.subscribe(
          (value) => { /* Do something with value */ },
          (error) => { /* Do something with error */ },
          () => { /* Do something with done*/ }
      );

因此，您需要添加一个错误处理程序来捕获您正在讨论的条件

---

参考：

在这种情况下，您将在可观测的误差函数中得到响应。所以，只要抓住错误

这里我已经更新了代码。

---

在这种情况下，您将在可观测的误差函数中得到响应。所以，只要抓住错误

这里我已经更新了代码。

---

在subscribe中传递第二个函数以捕获错误

  loginUser(user:any){
    this.userService.loginUser(user).subscribe(
      (response) => {
      console.log("test");
        if(response){
        console.log(response.token);
            if(response.token){
                localStorage.setItem('currentUser',JSON.stringify(response));
                if(response.user.role==='ADMIN'){
                    this.router.navigate(['/admindashboard']);
                }else{
                    this.router.navigate(['/userdashboard']);
                }
            }else{
              console.log("No Token");
            }
        } 
      },
      (error)=>{
        console.log(error.message);
      }
    )
  }

---

在subscribe中传递第二个函数以捕获错误

  loginUser(user:any){
    this.userService.loginUser(user).subscribe(
      (response) => {
      console.log("test");
        if(response){
        console.log(response.token);
            if(response.token){
                localStorage.setItem('currentUser',JSON.stringify(response));
                if(response.user.role==='ADMIN'){
                    this.router.navigate(['/admindashboard']);
                }else{
                    this.router.navigate(['/userdashboard']);
                }
            }else{
              console.log("No Token");
            }
        } 
      },
      (error)=>{
        console.log(error.message);
      }
    )
  }

---

您得到的响应进入前端的错误块，因此将布尔变量声明为false，将消息声明为false，并用html编写以下代码

  <div *ngIf="showErrorMessage">
    <h1>Invalid username and password Please try again</h1>
  </div>

)

---

}

您得到的响应进入前端的错误块，因此将布尔变量声明为false，将消息声明为false，并用html编写以下代码

  <div *ngIf="showErrorMessage">
    <h1>Invalid username and password Please try again</h1>
  </div>

)

---

}

为什么要将

访问控制允许原点

标题添加到请求？为什么要将

访问控制允许原点

标题添加到请求？