This is Part 2 of the tutorial on How to a authenticate from React application to Spring Boot API.<\/p>\n
In this part you will actually implement user authentication in Spring Boot. Then you will see how to store user credentials in in React using local storage (session or cookies).<\/p>\n
We would cover the following:<\/p>\n
<\/p>\n
The LoginRequest would be used to hold the username and password coming from the request body of a login request. I would just have fields:<\/p>\n
We would also add the passwordHash field to the user model and this is going to be a string field<\/p>\n
Update the addUser method of the UserService so that when a new user is being saved, the passwordHash field is also set.<\/p>\n
<\/p>\n
Write the authenticate method in the UserService. This method would take a LoginRequest object (username and password) and checks if the values are valid<\/p>\n
The authenticate method placed in the UserService and is given below:<\/p>\n
<\/p>\n
public<\/span> boolean<\/span> authenticate<\/span>(<\/span>String username,<\/span> String password)<\/span> {<\/span>\r\n User user =<\/span> userRepository.<\/span>findByUsername<\/span>(<\/span>username);<\/span>\r\n\r\n if<\/span> (!<\/span>user.<\/span>getUsername<\/span>().<\/span>equals<\/span>(<\/span>username)){<\/span>\r\n throw<\/span> new<\/span> UsernameNotFoundException<\/span>(<\/span>\"User not found in the database\"<\/span>);<\/span>\r\n }<\/span>\r\n\r\n if<\/span>(<\/span>user.<\/span>getPasswordHash<\/span>().<\/span>equals<\/span>(<\/span>bCryptPasswordEncoder.<\/span>encode<\/span>(<\/span>password)))<\/span> {<\/span>\r\n throw<\/span> new<\/span> BadCredentialsException<\/span>(<\/span>\"The password is incorrect\"<\/span>);<\/span>\r\n }<\/span>\r\n return<\/span> true<\/span>;<\/span>\r\n}<\/span>\r\n<\/pre>\n <\/p>\n
3. Write the Login Controller Method<\/strong><\/h4>\nYou will write the controller method for \/login<\/em>.<\/p>\nThis method would receive the LoginRequest in the request body and call the authenticate method. At successful authentication it returns an Ok status code<\/p>\n
The login()<\/em> method is given below:<\/p>\n@PostMapping<\/span>(<\/span>\"\/login\"<\/span>)<\/span>\r\npublic<\/span> ResponseEntity<<\/span>String><\/span> login<\/span>(<\/span>@RequestBody<\/span> LoginRequest loginRequest,<\/span> HttpSession session)<\/span> {<\/span>\r\n try<\/span> {<\/span>\r\n boolean<\/span> isAuthenticated =<\/span> authenticationService.<\/span>authenticate<\/span>(<\/span>loginRequest.<\/span>getUsername<\/span>(),<\/span> loginRequest.<\/span>getPassword<\/span>());<\/span>\r\n if<\/span> (<\/span>isAuthenticated)<\/span> {<\/span>\r\n session.<\/span>setAttribute<\/span>(<\/span>\"user\"<\/span>,<\/span> loginRequest.<\/span>getUsername<\/span>());<\/span>\r\n return<\/span> ResponseEntity.<\/span>ok<\/span>(<\/span>\"Login successful\"<\/span>);<\/span>\r\n }<\/span> else<\/span> {<\/span>\r\n return<\/span> ResponseEntity.<\/span>status<\/span>(<\/span>HttpStatus.<\/span>UNAUTHORIZED<\/span>).<\/span>body<\/span>(<\/span>\"Invalid username or password\"<\/span>);<\/span>\r\n }<\/span>\r\n }<\/span> catch<\/span> (<\/span>Exception e)<\/span> {<\/span>\r\n return<\/span> ResponseEntity.<\/span>status<\/span>(<\/span>HttpStatus.<\/span>INTERNAL_SERVER_ERROR<\/span>).<\/span>body<\/span>(<\/span>\"An error occurred during login\"<\/span>);<\/span>\r\n }<\/span>\r\n}<\/span>\r\n<\/pre>\n <\/p>\n
Note that this method has HttpSession as its second parameter but you don’t need to worry about it as Spring would handle creating and managing sessions.<\/p>\n
<\/p>\n
4. Implement the Registration and RegistrationSuccessful Components<\/strong><\/h4>\nCreate a Registration Component that would contain\u00a0 the following fields:<\/p>\n