Shulou(Shulou.com)05/31 Report--

How to achieve SpringBoot+Angular general login, I believe that many inexperienced people do not know what to do, so this paper summarizes the causes of the problem and solutions, through this article I hope you can solve this problem.

I. basic questions

The diagram is as follows:

Data stream

For the data flow of SpringBoot+Angular, please refer to my previous article on the separation of data flow between front and back of SpringBoot+Angular.

In short: layer C is responsible for data forwarding, layer M (Service service layer) is responsible for specific data processing and sending requests, the V layer of the foreground is the page template, and the warehouse layer in charge of component rendering background is responsible for one-to-one correspondence with the foreground entities, background entities and database fields.

The division of labor between the front and the back?

In this login function, the only function of the background is to do data validation only. When the user logs in, the foreground initiates a request for user name and password verification to the background. If the background verification is successful, it returns true, otherwise it returns false. When the front desk receives the return value, it determines whether the user has logged in successfully.

Where is the login status saved?

At first, it can be saved in the app component, and then the V-tier can obtain the login status by directly getting the C-tier variables using ngIf, but it depends on the login status's

The login status is stored in a variable in the service layer of the foreground. All components go to the login service to ask for data before rendering. If the user is in the login state, jump normally, otherwise jump to the login page.

Login and logout actions

During initialization, the login status is false. When logging in, if the background return value is true, change the login status variable to true, otherwise it will not change. Logout is, just change the login status to false, you can.

Second, explain the login and logout process in detail. PNG user submits the Form form, triggers layer C onSubmit () method C layer Login () method teacher service to initiate Http request to the background, input user name and password background C layer calls M layer Login method, pass user name and password background M layer calls warehouse findByUsername method, pass in Username background warehouse to use SQL to remove objects from database And return to the M layer background, call ValidatePassword to compare the user password returned by the warehouse with the password passed in the C layer, if consistent, return the Boolean value to the True background C layer, return the Boolean value to the foreground teacher service layer, and return the accepted Boolean value to the C layer foreground C layer to determine whether the returned data is true. If so, call the M layer setLogin method and change the login status to 1. The foreground C layer returns. The corresponding interface jumps the image. PNG browser enters the Url trigger method to generate the component C layer to subscribe to the Teacher service login component C layer to obtain the login status isLogin$ and assign it to the isloginV layer rendering page of this class. According to the login status of C, decide which content to display. If you are not logged in, the login page is displayed and the page is returned to the browser to log out the picture. PNG browser triggers navigation bar C layer Logout method navigation bar calls M layer setIsLogin (flase) Change the login status to 0m layer and return the login page to the browser. 3. Merge pictures. Png4. Problems.

At present, all verification is only in the foreground, there is no verification in the background, and users can operate freely in the background through browsers or other REST tools without authentication. A non-existent login function only blocks some normal users, but does not guard against the intrusion of some illegal users. Even if the background simply does not have the ability to judge who is making the data request, access control is of course impossible. The pictures in this article just explain the logic in the tutorial and make it easier to understand, so it's better to use the more secure token token mechanism.

After reading the above, have you mastered how to realize the general login of SpringBoot+Angular? If you want to learn more skills or want to know more about it, you are welcome to follow the industry information channel, thank you for reading!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.