如何將 angular 登錄表單傳遞給 spring 安全性

Question

我有一個 CRUD 項目，我正在嘗試實現 angular 前端，並且想知道如何正確地將登錄表單傳遞給 spring 安全性。 目前已執行發布請求，但在 loadUserByUsername 方法中，用戶名是 null，我認為這與我嘗試發送表單的方式有關。

登錄表單

<form #userForm="ngForm" (ngSubmit)="doLogin(userForm)">
 
  <div class="container">
    <div>
      <input type="text" name="username" id="username" ngModel placeholder="username">
      <br>
      <input type="text" name="password" id="password" ngModel placeholder="password">
    </div>
    <button class="btn btn-primary">Login</button>

  </div>
</form>

登錄組件.ts

export class LoginComponent implements OnInit {

  
  constructor(private service:RestapiService, private router:Router) { }

  ngOnInit(): void {
  }

  doLogin(form: NgForm) {
    this.service.login(form).subscribe(data=> {
      console.log("logged in")
    },
      error=>console.log("error"));
      
  
    this.router.navigate(["/"]);
  }
}

RestapiService.ts

export class RestapiService {

  constructor(private http: HttpClient) { }

  public login(user:NgForm) {
    const headers = new HttpHeaders().set('Content-Type', 'application/x-www-form-urlencoded');
    
    return this.http.post("http://localhost:8080/login", user.value, {headers: headers});
  } 

}

按用戶名加載用戶

@Override
    public UserDetails loadUserByUsername(String username) throws UsernameNotFoundException {
        AppUser user = appUserRepository.findByUsername(username);
        Collection<SimpleGrantedAuthority> authorities = new ArrayList<>();
        authorities.add(new SimpleGrantedAuthority(user.getRole()));
        return new User(user.getUsername(), user.getPassword(), authorities);   
    }

我的 controller class 沒有映射到 /login，因為我假設 spring 安全性自動允許向端點發送請求。

Answer 1

由於您尚未提供 WebSecurityConfigurations class 以及如何制作 securityContext 的詳細信息，我認為您可以在登錄過程中使用 JWT 機制（如果您還沒有嘗試過）。 為此，您應該實現自定義身份驗證過濾器並將其放在 Spring 的安全過濾器鏈中的 UsernamePasswordAuthenticationFilter 之前。 從這里，您可以找到有關在 SpringSecurity 和 Angular 中使用 JWT 實現注冊+登錄的所有信息。 如果您正確執行所有步驟，則不會有問題。

Answer 2

是的。 您是正確的 spring 安全句柄/login 。 這是登錄示例login.html

<form ngNoForm action="/login" method="POST">
<p>
    User: <input name="username"/>
</p>
<p>
    Password: <input type="password" name="password"/>
</p>
<p>
<button type="submit">Sign In</button>
</p>
</form>

要從 spring 安全上下文中獲取經過身份驗證的用戶，您可以編寫如下內容，

public User getAuthenticatedUser() {
    Authentication auth = SecurityContextHolder.getContext().getAuthentication();
    User user = null;
    if (null != auth && auth.isAuthenticated()) {
        Object principal = auth.getPrincipal();
        if (principal instanceof java.lang.String) {
            // anonymousUser
            user = new User();
            user.setUsername(principal.toString());
            user.setFirstName("anonymous");
            user.setLastName("anonymous");
            user.setId(UUID.randomUUID().toString());
        } else {
            user= (User) principal;
        }

        logger.trace("Found user " + user.getUsername());
        return user;
    }
    return user;
}

這是一個示例， AppUserDetailService.java 。

public class AppUserDetailService implements UserDetailsService {
    @Autowired
    private UserServices userServices;
    @Override
    public UserDetails loadUserByUsername(String username) throws UsernameNotFoundException {
        User user = userServices.findByUsername(username);

        if (null == user) {
          //mainly used for junits
            if (null != username && username.equalsIgnoreCase("root")) {
              user = new User();
              user.setFirstName("root");
              user.setLastName("system");
              user.setUsername(username);
              user.setPricingTag(PricingTag.GOLD_TAG);
              return user;
            }
            throw new UsernameNotFoundException("could not find the user '"
                    + username + "'");
        }

        return user;
    }
}

在上面我們假設，您創建了一個特定於您的應用程序的自定義User class。