Today is the 106th day for Liu Xiaoai to learn Java by herself.
Thank you for watching. Thank you.
Without further ado, let’s begin today’s lesson:
Many websites have a navigation bar on their home page, corresponding to different modules, so that users can quickly find the content they want.
It has the following characteristics:
- Once the site loads, you need to read the content in the navigation bar.
- This navigation bar exists on multiple pages, which is common on shopping sites.
- Navigation bar data is fixed and rarely changes, unlike user registration and login data.
This causes the problem of frequently querying the MySQL database.
In order to improve the efficiency of the query, the introduction of cache technology, that is, the redis database just learned a few days ago.
One of the core points for today is a study and review of the Redis database.
First, code writing
1 The front-end sends a request
First of all, there must be a request first, and the server will make corresponding processing according to the request:
With jQuery page loading event, you can query the navigation data from the database as soon as the website page is refreshed.
The request path is categoryServlet, which carries methodName queryAll.
This means that there is a CategoryServlet on the server to accept the request and the corresponding processing is performed in the queryAll method.
The web tier 2 code
Create a CategoryServlet to accept the request:
Since there is no data in the request, only the response data is required.
The data format for the response is JSON, and the previous two days of coding were converted to JSON in the Web layer.
You can also put it in the Service layer to complete the data transformation and return it to the Web layer.
This makes the Web layer code very concise.
2 the service layer code
The service handles the specific business logic, which involves caching:
1) redis database
You can use the jedisUtils utility class directly to operate on the Redis database.
It is very convenient to use, and the encapsulation process will not be described in detail.
Use jedis’s get method to create data with the key Category_List.
② Initialize data
Query data from MySQL for the first time.
The query data is a List collection, which is a collection of Category objects, and its data format is converted to JSON.
③ Store the data in Redis
The JSON data is stored in Redis using the set() method.
Instead of checking mysql for data every time, check redis for data.
4 the dao layer code
Query all the data in the TAB_category table with jdbcTemplate.
If a row of data corresponds to a Category object, the entire table is a collection of multiple Category objects.
Two, front-end rendering
1 Data Format
After the background responds to the front-end, console.log() outputs the result, which can be viewed on the console.
To open the console, press F12 in your browser:
The three are related to each other:
- The corresponding data format in the front end is JSON.
- The corresponding data in the database is a table of data.
- The corresponding data in Java is an entity class, or rather a collection of multiple entity classes.
2 front-end page rendering
After retrieving the data for the background response, the front end needs to dynamically render it to the page:
① Iterate over the data
You can iterate over the response data using the each method in jQuery, where:
- Index is the index of data.
- Element is the element corresponding to the current index bit.
- Element. cname is the value of the cname key in the current element.
② Page splicing
The front-end static page layout is as follows:
But static pages write data to death, so the traversal of the data dynamic Mosaic into the front page.
The two labels of home page and favorite list are fixed, so only the middle 8 lines are dynamically spliced.
③ Use the selector to render the content to the corresponding label
This is done using the HTML method in jQuery, where the selector used is the class selector.
The last
Thanks for watching.
If you can, please give it a thumbs up. Thank you.