Social blog management system and method based on Vue and SpringBoot

Abstract

The invention discloses a social blog management system and method based on Vue and SpringBoot, belongs to the technical field of social networks, and solves the problems that an existing system only focuses on user information collection, activity registration and basic data storage and cannot meet the complex requirements of a blog platform for content creation, personalized recommendation and multi-dimensional social interaction, and the social blog management efficiency is improved. The system comprises a front-end module, a rear-end module and a database module, and the front-end module and the rear-end module carry out data interaction through AJAX and RESTful API (Application Program Interface); according to the system, a front-end and back-end separation framework of Vue.js and SpringBoot is adopted, and a relational database MySQL, a memory database Redis and OSS storage are combined, so that efficient storage and cache management of data are realized, the system performance is optimized, a back-end module can generate personalized recommendation information by analyzing user blog information, the user experience is improved, and the user experience is improved. Rich user management and social contact functions are provided, and interaction between users is enhanced.

Description

Technical Field

[0001] The present invention belongs to the technical field of social network, and in particular relates to a social blog management system and method based on Vue and SpringBoot. Background Art

[0002] With the rapid development of internet technology, personal blogging has become a common online application. It not only provides a platform for people to showcase themselves and share their experiences, but also facilitates the exchange and dissemination of information. In recent years, with the rise of social media, social blogging has gradually become a comprehensive platform that integrates personal expression and social interaction.

[0003] Traditional personal blog systems often adopt a single development model, tightly coupling the front-end interface and back-end logic. While this development model is simple, it often suffers from low development efficiency and maintenance difficulties when faced with complex functional requirements and frequent updates and iterations. In recent years, with the continuous advancement of front-end and back-end technologies, a separate front-end and back-end development model has gradually become mainstream. In this model, the front-end focuses on user interface interaction design and user experience, while the back-end focuses on business logic implementation and data processing. The two interact through APIs, greatly improving development efficiency and system maintainability.

[0004] In the front-end space, Vue.js, as an emerging front-end framework, is gaining popularity among developers with its simple API, component-based development model, and robust ecosystem. Vue.js's declarative data binding and component system enable efficient construction of dynamic user interfaces, while its rich ecosystem of plugins and tools provides significant convenience for developers. The emergence of Vue.js has made front-end development more modular and efficient, enabling the rapid implementation of complex user interaction features. In the back-end space, Spring Boot, a simplified development model based on the Spring framework, offers many built-in, out-of-the-box features, such as database connectivity, security, and messaging, significantly improving development efficiency. Through mechanisms like automatic configuration and dependency injection, Spring Boot simplifies the initialization and configuration of Spring applications, allowing developers to focus more on implementing business logic. Furthermore, Spring Boot offers powerful scalability and flexibility, enabling easy integration of various third-party libraries and services to meet the needs of diverse projects.

[0005] Chinese patent CN118485487A discloses an operation activity management system based on social software, which relates to the technical field of operation activity management. The system includes a user information collection unit, which is used to obtain relevant information of users on the social software and process the obtained relevant information of the users to provide information support for the subsequent operation, and store and manage the processed relevant information of the users. However, the existing system only focuses on user information collection, activity registration and basic data storage, and cannot meet the complex needs of the blog platform for content creation, personalized recommendation and multi-dimensional social interaction, making it difficult to cope with high concurrency scenarios and complex business logic. To address the above problems, we propose a social blog management system and method based on Vue and SpringBoot. Summary of the Invention

[0006] The purpose of the present invention is to address the shortcomings of the existing technology and provide a social blog management system and method based on Vue and SpringBoot, which solves the problem that the existing system only focuses on user information collection, event registration and basic data storage, and cannot meet the complex needs of the blog platform for content creation, personalized recommendation, and multi-dimensional social interaction, resulting in difficulty in coping with high concurrency scenarios and complex business logic.

[0007] The present invention is implemented in this way: a social blog management system based on Vue and SpringBoot, the system comprising: The front-end module, built on the Vue.js framework, is used to obtain user login information and user blog information, and respond to the verification results of the back-end module to visualize the user blog information and personalized recommendation information; The backend module, built on the SpringBoot framework, is used to handle business logic and data interaction, verify user login information, and generate personalized recommendation information based on user blog information; Database module, used to store and cache user login information and user blog information; The front-end module and the back-end module interact with each other via AJAX and RESTful API.

[0008] Preferably, the front-end module includes: User login unit, used to collect user login information and present login verification results based on a visual interface; Article presentation unit, used to visually present article categories, article searches, article content, likes and favorites, and article comments; Activity presentation unit, used to visually present activity content, registration activities, likes and favorite activities, and comment activity information; The personal center presentation unit is used to visually present user blog information, where the user blog information includes personal information, published articles, query of published articles, editing and deletion of published articles, query of registered activities, query of liked and collected articles and activities, and viewing of commented articles and activity information.

[0009] Preferably, the back-end module includes: A user verification unit, configured to obtain user login information and verify and identify the user login request based on the user login information; Backend management unit, based on SpringBoot framework, implements blog classification management, blog information management, activity information management, comment information management, activity registration management, announcement information management, administrator information management, and user information management; Personalized recommendation unit, which obtains user blog information, generates personalized recommendation information based on the user blog information, and pushes relevant recommendation sequence diagrams; The data access layer interacts with the database module through MyBatis and performs data storage, query, update, and delete operations; The RESTful API interface is used for data interaction between front-end modules and back-end modules, and realizes synchronous update and asynchronous loading of data.

[0010] Preferably, the database module includes: MySQL, a relational database, stores user login information, user blog information, and activity data; In-memory database Redis, used for caching frequently accessed data and session management; OSS storage database, used for storing and managing static resource information.

[0011] Preferably, the relational database MySQL includes: User information table, used to store user login information, including user name, password, nickname, phone number, email address, avatar, character ID, birthday, and profile; Administrator information table, used to store administrator information, including user name, password, nickname, phone number, email address, avatar, and role identification; Article information table, used to store article content, category, release time, views, likes, and favorites; The activity information table is used to store activity information, including the activity name, activity introduction, activity content, start time, end time, activity form, activity address, organizer, page views, and cover; Comment information table, used to store comment content, publishing time, article, user, root comment ID, and reply comment ID information; The like information table is used to store the user's like records for articles or activities. The like information table includes the like time, like object ID, and like user ID; The collection information table is used to store the user's collection records of articles or activities. The collection information table includes the collection time, collection object ID, and collection user ID.

[0012] Preferably, the method for verifying and identifying a user login request based on user login information includes: In response to a user login instruction, the user login unit starts a login security mechanism based on the user login instruction, generates a random verification code, and presents the random verification code based on a visual interface; Collect random verification codes, user account information, and user identity information in real time, and package the random verification codes, user account information, and user identity information into user login information; Forming a login request based on the user login information and pushing the login request to the user verification unit, the user verification unit receives the login request, identifies the user account information and user identity information in the user login information, retrieves the account information record and password information record stored in the database module respectively, and determines whether the user account information and user identity information exist based on the account information record and password information record; If the user account information and user identity information both have corresponding account information records and password information records, it is determined that the login request verification is successful, the user login information is verified, and the login request verification is pushed to the user login unit.

[0013] Preferably, the method for performing login verification on user login information includes: Load the user login information. The user verification unit generates an authentication token based on the user login information. The authentication token is the user's identity credential in the logged-in state. When the user performs an operation, the front-end module attaches the authentication token to the header of the HTTP request for identity authentication by the user verification unit of the back-end module. The user verification unit searches for information associated with the user ID in the in-memory database Redis. If the corresponding user account information is not found in the in-memory database Redis, the user verification unit searches for information in the relational database MySQL. If matching user account information is found in the relational database MySQL, the user verification unit will synchronously update the user account information to the in-memory database Redis; Get the user account information, parse the user account information, and store the user ID parsed from the user account information in ThreadLocal.

[0014] Preferably, the personalized recommendation unit includes: Article classification module, identifies the author's article classification information in the user's blog information and generates article classification results; Article search module, users identify search keywords in user blog information and use fuzzy query to generate article search results; Article ranking module, which sorts articles based on article reading volume information and generates article ranking lists; The activity overview module pushes the top two groups of activities based on the number of activity views and presents them through a visual interface.

[0015] Preferably, the personalized recommendation unit further includes: The related recommendation module is used to obtain article search results, generate a related recommendation time series diagram based on the article search results, query articles of the same type and present the pageview ranking results through a visual interface; The likes and favorites optimization module is used to receive like or favorite requests, store the number of likes and favorites in the Redis cache of the in-memory database Redis, and synchronize the number of likes and favorites based on the preset data synchronization strategy; The comment optimization module is used to identify user comment information in user blog information. The front-end module encapsulates the user comment information, verifies the user account information based on the back-end module, and records the root ID and reply ID corresponding to the user comment information.

[0016] On the other hand, the present invention also provides a social blog management method based on Vue and SpringBoot, the social blog management method based on Vue and SpringBoot comprising: S10, collect user registration information through the front-end module, and the back-end module persists the user registration information to the MySQL database and generates an encrypted salt value to store the password; S20, when the user logs in, the front-end module sends the username / password to the back-end through axios. The back-end module generates an authentication token and returns it. The front-end stores the authentication token and attaches it to the header of the HTTP request. S30, the front-end module obtains the user blog information, and the back-end module receives the user blog information and stores it in the database module; S40, when a user visits the article details page, the front-end module sends the user's blog information, and the back-end module uses fuzzy query to generate article search results, performs associated query, and reads the cached popular article list from Redis; S50, when a user performs a like or collection operation, a like or collection request is received, the number of likes and the number of collections are stored in the Redis cache of the in-memory database Redis, and the number of likes and the number of collections are synchronized based on a preset data synchronization strategy and synchronized to MySQL via RabbitMQ; S60, when the user makes a comment operation, the user comment information in the user blog information is identified, the front-end module encapsulates the user comment information, verifies the user account information based on the back-end module, and records the root ID and reply ID corresponding to the user comment information.

[0017] Compared with the prior art, the embodiments of the present application have the following beneficial effects: In an embodiment of the present invention, the system adopts a front-end and back-end separation architecture of Vue.js and SpringBoot, and combines the relational database MySQL, the in-memory database Redis and OSS storage to achieve efficient data storage and cache management, optimize system performance, and the back-end module can generate personalized recommendation information by analyzing user blog information, thereby improving user experience, providing rich user management and social functions, and enhancing interaction between users.

[0018] In this embodiment of the present invention, the front-end module is built on the Vue.js framework, leveraging its powerful functionality and rich component ecosystem, such as vue-router and vuex, to implement routing and state management for front-end applications. By integrating these tools, development efficiency is greatly improved while also ensuring application maintainability and scalability. The outstanding performance of Vue.js makes front-end module applications more stable, efficient, and easy to maintain.

[0019] In this embodiment of the present invention, the social blog management system based on Vue and Spring Boot adopts a front-end and back-end separation architecture, making the front-end and back-end modules two independent yet closely coordinated components. This design greatly improves the system's flexibility and maintainability. The front-end module focuses on providing an intuitive and easy-to-use user interface, ensuring smooth user interaction and an optimal user experience. The back-end module, on the other hand, focuses on data processing and business logic implementation, ensuring data accuracy and efficient business operations.

[0020] In an embodiment of the present invention, a method for performing login verification on user login information is provided. By performing login verification on user login information, the system ensures that each request can be correctly verified and authorized, while improving the efficiency of processing requests. The access speed of the in-memory database Redis is faster than that of traditional databases. At the same time, the use and verification of authentication tokens ensures that only legitimate users can perform specific operations, which also enhances the security of the system. BRIEF DESCRIPTION OF THE DRAWINGS

[0021] Figure 1 This is an architecture diagram of a social blog management system based on Vue and SpringBoot provided by the present invention.

[0022] Figure 2 This is a use case diagram of the article presentation unit provided by the present invention.

[0023] Figure 3 This is a use case diagram of the personal center presentation unit provided by the present invention.

[0024] Figure 4 This is a user login sequence diagram provided by the present invention.

[0025] Figure 5 The following shows the system entity ER diagram of the relational database MySQL in an embodiment of the present invention.

[0026] Figure 6 It shows the user information representation provided by the present invention.

[0027] Figure 7 The diagram shows the administrator information representation provided by the present invention.

[0028] Figure 8 Shown is a login verification sequence diagram when performing login verification on user login information.

[0029] Figure 9 A schematic diagram showing the flow of the author information module generating the author information timing diagram.

[0030] Figure 10 The figure shows a flow chart of the related recommendation module generating a related recommendation sequence diagram based on the article search results.

[0031] Figure 11 The figure shows a flow chart of the like and favorite optimization module generating a like and favorite timing diagram based on a like or favorite request.

[0032] Figure 12 It shows the operation interface diagram of editing personal data based on the personal center presentation unit.

[0033] Figure 13 Shown is a swim lane diagram for blog information management provided by the present invention.

[0034] Figure 14 A schematic diagram of the blog classification management operation interface provided by the present invention is shown.

[0035] Figure 15 A schematic diagram of the activity information management operation interface provided by the present invention is shown.

[0036] In the figure: 100-front-end module, 110-user login unit, 120-article presentation unit, 130-activity presentation unit, 140-personal center presentation unit, 200-back-end module, 210-user verification unit, 220-back-end management unit, 230-personalized recommendation unit, 231-article classification module, 232-article search module, 233-article list module, 234-activity quick overview module, 235-related recommendation module, 236-like collection optimization module, 237-comment optimization module, 238-author information module, 240-data access layer, 250-RESTful API interface, 300-database module, 310-relational database MySQL, 320-memory database Redis, 330-OSS storage database. DETAILED DESCRIPTION

[0037] Unless otherwise defined, all technical and scientific terms used herein have the same meanings as commonly understood by those skilled in the art to which this application belongs. The terms used in the specification of the application are only for the purpose of describing specific embodiments and are not intended to limit this application. The terms "including" and "having" and any variations thereof in the specification and claims of this application and the above-mentioned drawings are intended to cover non-exclusive inclusions. The terms "first", "second", etc. in the specification and claims of this application or the above-mentioned drawings are used to distinguish different objects, not to describe a specific order.

[0038] Existing systems only focus on user information collection, event registration, and basic data storage, and are unable to meet the complex needs of blog platforms for content creation, personalized recommendations, and multi-dimensional social interactions, making it difficult to cope with high-concurrency scenarios and complex business logic. To address the above problems, we propose a social blog management system and method based on Vue and SpringBoot. In short, the system consists of a front-end module 100, a back-end module 200, and a database module 300. The front-end module 100 and the back-end module 200 interact with each other through AJAX and RESTful APIs. The front-end module 100 is built based on the Vue.js framework, while the back-end module 200 is built based on the SpringBoot framework. In an embodiment of the present invention, the system adopts a front-end and back-end separation architecture of Vue.js and SpringBoot, and combines the relational database MySQL310, the in-memory database Redis320, and OSS storage to achieve efficient data storage and cache management, optimize system performance, and the back-end module 200 can generate personalized recommendation information by analyzing user blog information, thereby improving user experience, providing rich user management and social functions, and enhancing interaction between users.

[0039] The embodiment of the present invention provides a social blog management system based on Vue and SpringBoot. Figure 1 The following is a schematic diagram of the structure of a social blog management system based on Vue and SpringBoot. The social blog management system based on Vue and SpringBoot specifically includes: The front-end module 100 is built based on the Vue.js framework and is used to obtain user login information and user blog information, and visually present the user blog information and personalized recommendation information in response to the verification results of the back-end module 200; The front-end module 100 includes: The user login unit 110 is used to collect user login information and present the login verification result based on the visual interface; It should be noted that the user login information includes but is not limited to user account information and user identity information. Figure 4 The user login sequence diagram is shown. The user enters the account number, password and other information in the login interface and submits the request. The user login unit 110 receives the user login instruction, where the user login instruction includes but is not limited to the Controller layer, Service layer, and DAO layer. The request is first received by the Controller layer and preliminarily verified (such as verification code check). After the verification is passed, the login information is encapsulated as a userLogin object and passed to the Service layer. The Service layer further calls the DAO layer to interact with the database module 300 to query whether the account exists. After the database module 300 returns the query result, the Service layer determines whether the user exists. If the user exists, the Service layer will obtain the user information and return it to the Controller layer. The user login is successful and jumps to the homepage; if the user does not exist, the Controller layer will return a login failure prompt to the user. The entire login process covers multiple links such as user interface, request processing, business logic and database operations to ensure the security and accuracy of the login process.

[0040] Article presentation unit 120, for visually presenting article classification, article search, article content, likes and favorites, and article comments; In the embodiment of the present invention, users can view article categories, article searches, article content, like and save articles, and comment on articles through the article presentation unit 120. Figure 2 A use case diagram of the article presentation unit 120 is shown.

[0041] The activity presentation unit 130 is used to visually present the activity content, registration activity, likes and favorites, and comments on the activity; In the embodiment of the present invention, users can view activity content, register for activities, like and collect activities, and comment on activities through the activity presentation unit 130.

[0042] The personal center presentation unit 140 is used to visually present user blog information, wherein the user blog information includes personal information, published articles, query of published articles, editing and deletion of published articles, query of registered activities, query of liked and collected articles and activities, and viewing of commented articles and activity information.

[0043] In the embodiment of the present invention, the user can use the personal center presentation unit 140 to edit personal information, publish articles, edit and delete published articles, query published articles, query liked and favorited articles and activities, query registered activities, and query commented articles and activities. Figure 3 The use case diagram of the personal center presentation unit 140 is shown, wherein the personal center presentation unit can display the user's personal information, and the user can modify his nickname, phone number, email address, password, avatar, etc. Figure 12 A diagram of an operation interface for editing personal data based on the personal center presentation unit 140 is shown.

[0044] It should be noted that the front-end module 100 is built on the Vue.js framework, a popular front-end JavaScript framework that utilizes a declarative programming paradigm, enabling developers to efficiently and concisely build single-page applications (SPAs) and more complex multi-page applications. Vue.js features a lightweight architecture, intuitive data response mechanisms, and a flexible modular component system. In this embodiment, building the front-end module 100 on the Vue.js framework fully leverages the framework's powerful features and rich component ecosystem, such as vue-router and vuex, to implement routing and state management for the front-end application. The integration of these tools significantly improves development efficiency while ensuring application maintainability and scalability. The outstanding performance of Vue.js makes the front-end module 100 application more stable, efficient, and easy to maintain. Furthermore, during deployment, the Vue.js application is deployed on an Nginx server, providing external services through a reverse proxy mechanism. Developers need to place the compiled static files in the directory specified by Nginx and accurately configure the virtual host and routing rules to ensure that every user request can be accurately mapped to the Vue.js application. The Nginx server plays a vital role in the front-end module 100. As a reverse proxy server, it is responsible for receiving the user's HTTP request and efficiently forwarding the request to the back-end module 200 for processing according to the preset configuration rules. Nginx's load balancing capability is particularly outstanding. It can evenly distribute traffic to multiple servers of the back-end module 200, effectively cope with high-concurrency scenarios, and ensure the stable operation of the system. At the same time, Nginx can also directly process requests for static resources, such as images, style files, etc., thereby reducing the burden on the back-end server and further improving the system's response speed.

[0045] Backend module 200, built on the SpringBoot framework, is used to process business logic and data interaction, verify user login information, and generate personalized recommendation information based on user blog information; In an embodiment of the present invention, the backend module 200 includes: The user verification unit 210 is used to obtain user login information and verify and identify the user login request based on the user login information; Backend management unit 220 implements blog classification management, blog information management, activity information management, comment information management, activity registration management, announcement information management, administrator information management, and user information management based on the SpringBoot framework; In the embodiment of the present invention, Figure 13 Shows a swimlane diagram of blog information management, and Figure 14The schematic diagram of the blog classification management operation interface is shown. Through the blog classification management, the blog information can be added, deleted, modified and checked. The front-end module 100 can use the plug-in wangEditor to view the content of the blog after typeset. The back-end management unit 220 can add, delete, modify and manage the activity information. Figure 15 Shows a schematic diagram of the activity information management operation interface.

[0046] The personalized recommendation unit 230 is used to obtain user blog information, generate personalized recommendation information based on the user blog information, and push relevant recommendation sequence diagrams; The data access layer 240 interacts with the database module 300 through MyBatis and performs data storage, query, update and delete operations; The RESTful API interface 250 is used for data interaction between the front-end module 100 and the back-end module 200, and realizes synchronous update and asynchronous loading of data.

[0047] It should be noted that backend module 200 is built on the SpringBoot framework. SpringBoot's automatic configuration features significantly reduce system startup time. Furthermore, the SpringBoot framework's built-in container support simplifies the application deployment process, improving development and maintenance efficiency. Leveraging the SpringBoot framework, the system can easily integrate other powerful components in the Spring ecosystem. These components provide comprehensive data access capabilities, robust authentication and authorization mechanisms, and flexible microservices architecture support, collectively building an efficient and reliable backend service. Therefore, this system uses SpringBoot as its foundational framework, aiming to deliver fast, reliable, and easy-to-maintain backend services.

[0048] Database module 300, used to store and cache user login information and user blog information; The front-end module 100 and back-end module 200 interact with each other via AJAX and RESTful APIs, enabling efficient data exchange and rapid response. This interaction allows the front-end module 100 to focus on interface construction and interaction optimization without having to worry too much about data processing in the back-end module 200. Back-end developers can focus on data processing and business logic implementation without having to worry too much about the details of the front-end interface.

[0049] In this embodiment, the front-end module 100, back-end module 200, and database module 300 communicate via the HTTP protocol to ensure reliable data transmission. In this embodiment of the present invention, the social blog management system based on Vue and Springboot adopts a front-end and back-end separation architecture, making the front-end module 100 and the back-end module 200 two independently operating but closely cooperating components. This design greatly improves the flexibility and maintainability of the system. The front-end module 100 focuses on providing an intuitive and easy-to-use user interface, ensuring that users can interact with the system smoothly and obtain the best user experience. It also ensures that the back-end module 200 focuses on data processing and business logic implementation, ensuring data accuracy and efficient business operation.

[0050] In this embodiment, the database module 300 includes: MySQL310 relational database, which stores user login information, user blog information, and activity data; It should be noted that the relational database MySQL310 supports multiple data types and has data storage and retrieval capabilities, allowing developers to efficiently organize and manage data. By creating databases and tables, users can easily classify and store data and perform a series of complex data operations to meet diverse business needs. This embodiment is based on the relational database MySQL310 as a data storage system. By utilizing the powerful functions of MySQL, it is possible to ensure accurate, secure, and efficient data processing, providing solid data support for the stable operation of the system. Figure 5 The system entity ER diagram of the relational database MySQL310 in an embodiment of the present invention is shown.

[0051] In the embodiment of the present invention, the relational database MySQL 310 includes: The user information table is used to store user login information, including but not limited to user name, password, nickname, phone number, email address, avatar, character ID, birthday, and profile. Figure 6 Shows the user information representation intention; Administrator information table, used to store administrator information, including but not limited to user name, password, nickname, phone number, email address, avatar, role identification, Figure 7 Shows the administrator information representation intent; Article information table, used to store article content, category, release time, views, likes, and favorites; The activity information table is used to store activity information, including the activity name, activity introduction, activity content, start time, end time, activity form, activity address, organizer, page views, and cover; Comment information table, used to store comment content, publishing time, article, user, root comment ID, and reply comment ID information; Like information table, used to store user like records for articles or activities, where the like information table includes but is not limited to like time, like object ID, and like user ID; The collection information table is used to store the user's collection records of articles or activities. The collection information table includes but is not limited to the collection time, collection object ID, and collection user ID.

[0052] The announcement information table is used to store announcement information, wherein the announcement information table includes but is not limited to the announcement title, announcement content, creation time, and creator.

[0053] The in-memory database Redis320 is used to cache frequently accessed data and session management. Redis is a high-performance open source key-value storage system written in ANSI C language with network and data persistence capabilities. As a multi-model database, Redis provides rich data structure support, including strings, hashes, lists, sets, and ordered sets, etc., thereby meeting diverse data storage needs. Due to its excellent performance and wide range of application scenarios, in this embodiment, the in-memory database Redis320 is used as a login status verification tool and a caching tool. Redis can efficiently manage the user's login status, ensuring the user's secure access and convenient experience. At the same time, Redis's caching function also greatly improves the system's response speed and performance, making data processing faster and more efficient.

[0054] OSS storage database 330 is used to store and manage static resource information. It should be noted that OSS storage database 330 can be Alibaba Cloud OSS storage database 330. OSS storage database 330 can store files such as article covers, event covers, and user avatars. By leveraging the high performance, high security, and high reliability of OSS, users are provided with a stable and efficient file storage and access experience.

[0055] In an embodiment of the present invention, the system adopts a front-end and back-end separation architecture of Vue.js and SpringBoot, and combines the relational database MySQL310, the memory database Redis320 and OSS storage to achieve efficient storage and cache management of data, optimize system performance, and the back-end module 200 can generate personalized recommendation information by analyzing user blog information, thereby improving user experience, providing rich user management and social functions, and enhancing interaction between users.

[0056] An embodiment of the present invention provides a method for verifying and identifying a user login request based on user login information. The method for verifying and identifying a user login request based on user login information specifically includes: S101, in response to a user login instruction, the user login unit 110 activates a login security mechanism based on the user login instruction and generates a random verification code. The random verification code is a basic security measure designed to prevent automated malicious login attempts. The user is required to correctly enter the displayed verification code to prove that they are a real human user, and the random verification code is presented based on a visual interface; S102: In real time, a random verification code, user account information, and user identity information are collected and packaged into user login information. In this embodiment, the user login unit 110 provides two login options: administrator login and ordinary user login, which correspond to the browsing and commenting functions of the blog frontend and the advanced operation and maintenance functions of the backend module 200, respectively. The user selects the corresponding login type based on their identity, enters the corresponding account information, and after confirming that the account is correct, enters the verification code; S103: Forming a login request based on the user login information and pushing the login request to the user verification unit 210. The user verification unit 210 receives the login request, identifies the user account information and user identity information in the user login information, retrieves the account information record and password information record stored in the database module 300, and determines whether the user account information and user identity information exist based on the account information record and password information record. After receiving a login request, the user verification unit 210 first identifies the login type selected by the user. If the login is an administrator, the user verification unit 210 searches the database module 300 based on the provided administrator account. Similarly, if the login is a regular user, the user verification unit 210 also searches the database module 300 for the corresponding user record. This step verifies the existence of the account and ensures that only legitimate users can proceed with the login operation. Once the corresponding user record is found in the database module 300, the user verification unit 210 then performs password verification. It compares the password entered by the user with the encrypted password stored in the database module 300.

[0057] S104 , if the user account information and user identity information both have corresponding account information records and password information records, it is determined that the login request verification is successful, the user login information is verified, and the login request verification success is pushed to the user login unit 110 .

[0058] In this embodiment, if the password verification is successful, the user verification unit 210 will perform identity authentication and permission allocation, generate a secure authentication token, and send it back to the front-end module 100. The authentication token is a credential of the user's login status, and the front-end module 100 needs to save it so that subsequent requests can carry the authentication token for identity authentication. At the same time, the back-end module 200 will store the user's login information and status in the Redis cache to quickly perform session management and status query. If the password verification fails, the user verification unit 210 will send an error message to the user login unit 110, prompting the user that the password is incorrect and needs to be re-entered.

[0059] It should be noted that the system also has a registration function. Users can enter the registration page by clicking the "Register" button in the lower right corner of the login interface. On the registration page, users are required to enter their account information and password, which is then transmitted to the back-end module 200 via the front-end module 100. Upon receiving the registration request, the back-end module 200 inserts the new user's information into the database module 300 and completes the account creation. After successful registration, the user can log in using the newly created account.

[0060] The embodiment of the present invention provides a method for verifying user login information. Figure 8 The following is a sequence diagram of a login verification process when verifying user login information. The method of verifying user login information specifically includes: S201, loading user login information, the user verification unit 210 generates an authentication token based on the user login information. The authentication token is the user's identity credential in the logged-in state. When the user performs an operation, the front-end module 100 attaches the authentication token to the header of the HTTP request for identity authentication by the user verification unit 210 of the back-end module 200; It should be noted that, except for login and registration requests, all other requests will be checked by the interceptor of the backend module 200. The backend module 200 will first check whether the request header contains an authentication token. If so, the backend module 200 will parse the authentication token to extract the corresponding user ID.

[0061] S202, the user verification unit 210 searches the in-memory database Redis 320 for information associated with the user ID. If the corresponding user account information is not found in the in-memory database Redis 320, the user verification unit 210 searches the relational database MySQL 310; S203, if matching user account information is found in the relational database MySQL 310, the user verification unit 210 synchronously updates the user account information to the in-memory database Redis 320; S204, obtaining user account information, parsing the user account information, and storing the user ID parsed from the user account information into ThreadLocal.

[0062] In this embodiment, ThreadLocal is a thread-level storage space that allows data to be bound to the execution flow of the current thread, so that the user ID can be easily accessed anywhere in the request processing without having to query the database or Redis every time.

[0063] In an embodiment of the present invention, a method for performing login verification on user login information is provided. By performing login verification on user login information, the system ensures that each request can be correctly verified and authorized, while improving the efficiency of processing requests. The access speed of the in-memory database Redis320 is faster than that of traditional databases. At the same time, the use and verification of authentication tokens ensures that only legitimate users can perform specific operations, which also enhances the security of the system.

[0064] In this embodiment of the present invention, the personalized recommendation unit 230 includes: Article classification module 231, identifies the author's article classification information in the user's blog information and generates article classification results; Article search module 232, the user identifies the search keywords in the user's blog information and generates article search results using fuzzy query; Article ranking module 233, sorts articles based on article reading volume information and generates an article ranking list; The activity overview module 234 pushes the top two groups of activities with the highest ranking based on the activity views and presents them through a visual interface.

[0065] The related recommendation module 235 is used to obtain article search results, generate a related recommendation time sequence diagram based on the article search results, query articles of the same type and present the pageview ranking results through a visual interface. Figure 10 A schematic diagram showing a process of generating a relevant recommendation sequence diagram based on article search results by the relevant recommendation module 235 is shown; Like and Collection Optimization Module 236, for receiving like or collection requests, generating like and collection time series diagrams based on the like or collection requests, storing the number of likes and collections in the Redis cache of the in-memory database Redis 320, and synchronizing the number of likes and collections based on a preset data synchronization strategy; In the embodiment of the present invention, Figure 11As shown, a flow chart of the like and favorite optimization module 236 generating a like and favorite sequence diagram based on a like or favorite request is shown. In order to improve the user experience and reduce the pressure on the database module 300, this embodiment optimizes the like and favorite of articles through the like and favorite optimization module 236. The specific method is as follows: Front-end interaction: On the front-end module 100 page, intuitive like and favorite buttons are provided for users. When the user clicks the button, the front-end module 100 will send a corresponding request to the back-end module 200 instead of directly operating the database module 300.

[0066] Using Redis cache: When the backend module 200 first receives a request to like or save a post, it does not directly access the relational database MySQL 310. Instead, it stores the number of likes and saves in the Redis cache of the in-memory database Redis 320. This leverages Redis's high performance to handle frequent like and cancel operations, reducing direct access to the database module 300.

[0067] Implementing the logic for like and unlike: In the backend module 200, when a user clicks "Like," the article's like count increases; when the user clicks "Unlike" again, the article's like count decreases. These increment and decrement operations are performed in the in-memory database Redis 320.

[0068] Data synchronization strategy: To avoid frequent synchronization from Redis to MySQL, this embodiment presets a synchronization strategy. For example, only when the number of likes or favorites of an article is a multiple of 5, the count in Redis is synchronized to the relational database MySQL 310. This strategy can reduce the frequency of database write operations and improve the overall performance of the system. Through the above optimization measures, not only the response speed of user operations is improved and the pressure on the database module 300 is reduced, but also the persistence and consistency of data are ensured, thereby improving the stability and efficiency of the entire system.

[0069] The comment optimization module 237 is used to identify user comment information in user blog information. The front-end module 100 encapsulates the user comment information, verifies the user account information based on the back-end module 200, and records the root ID and reply ID corresponding to the user comment information.

[0070] In an embodiment of the present invention, after receiving a comment request, the comment optimization module 237 will first perform identity authentication to ensure that the user has the right to make a comment. Next, the comment optimization module 237 will determine whether the user submitted a root comment or a reply to a specific comment. Each comment will record its corresponding root ID and reply ID, which is crucial for correctly displaying the comment tree and reply chain. If the user sends a root comment, the backend will add it to the comment list of the article and assign a new root ID to the comment. If the user is replying to an existing comment, the comment optimization module 237 will mark the comment as a sub-comment and set its reply ID to the ID of the comment being replied to. In addition, in order to maintain the neatness and order of the comments, the system also provides comment management and deletion functions. Users can delete comments they have posted, and the author or administrator of the article can manage and delete inappropriate comments.

[0071] The author information module 238 queries the author information based on the article information, displays the author information in the author card area, generates the author information time sequence diagram based on the author ID, and indexes the number of articles, the number of likes and the number of favorites. Figure 9 A schematic diagram of the process of the author information module 238 generating an author information timing diagram is shown.

[0072] On the other hand, an embodiment of the present invention further provides a social blog management method based on Vue and SpringBoot, wherein the social blog management method based on Vue and SpringBoot specifically includes: S10, collecting user registration information through the front-end module 100, and the back-end module 200 persisting the user registration information to the MySQL database and generating an encrypted salt value to store the password; S20, when the user logs in, the front-end module 100 sends the username / password to the back-end through axios, the back-end module 200 generates an authentication token and returns it, the front-end stores the authentication token and attaches the authentication token to the header of the HTTP request; S30, the front-end module 100 obtains the user blog information, and the back-end module 200 receives the user blog information and stores it in the database module 300; S40, when a user visits the article details page, the front-end module 100 sends the user's blog information, and the back-end module 200 uses fuzzy query to generate article search results, and performs associated query to read the cached popular article list from Redis; S50, when a user performs a like or collection operation, a like or collection request is received, the number of likes and the number of collections are stored in the Redis cache of the in-memory database Redis320, and the number of likes and the number of collections are synchronized based on a preset data synchronization strategy and synchronized to MySQL via RabbitMQ; S60, when the user makes a comment operation, the user comment information in the user blog information is identified, the front-end module 100 encapsulates the user comment information, verifies the user account information based on the back-end module 200, and records the root ID and reply ID corresponding to the user comment information.

[0073] In this embodiment, by storing the number of likes and favorites in the Redis cache, the pressure on direct database access is reduced and the response speed of operations is improved. Users can receive immediate feedback when performing like and favorite operations, which improves the smoothness of interaction. In addition, the back-end module 200 uses fuzzy queries to generate article search results and reads the cached popular article list from Redis, which can quickly provide users with search results and personalized recommendations, reducing waiting time and enhancing the efficiency of users in discovering content of interest.

[0074] In summary, the present invention provides a social blog management system and method based on Vue and SpringBoot. In an embodiment of the present invention, the system adopts a front-end and back-end separation architecture of Vue.js and SpringBoot, and combines the relational database MySQL310, the memory database Redis320 and OSS storage to achieve efficient data storage and cache management, optimize system performance, and the back-end module 200 can generate personalized recommendation information by analyzing user blog information, thereby improving user experience, providing rich user management and social functions, and enhancing interaction between users.

[0075] It should be noted that for the aforementioned embodiments, for simplicity of description, they are all expressed as a series of action combinations. However, those skilled in the art should be aware that the present invention is not limited by the order of the actions described, because according to the present invention, certain steps may be performed in other orders or simultaneously. Secondly, those skilled in the art should also be aware that the embodiments described in this specification are all preferred embodiments, and the actions and modules involved are not necessarily required by the present invention.

[0076] The above embodiments are only used to illustrate the technical solutions of the present invention, rather than to limit the scope of protection of the invention. Obviously, the embodiments described are only some embodiments of the present invention, rather than all embodiments. Based on these embodiments, all other embodiments obtained by ordinary technicians in this field without making creative work are within the scope of protection of the present invention. Although the present invention has been described in detail with reference to the above embodiments, ordinary technicians in this field can still combine, add, delete or make other adjustments to the features in the various embodiments of the present invention according to the circumstances without conflict, without making creative work, so as to obtain different other technical solutions that do not deviate from the concept of the present invention in essence, and these technical solutions also fall within the scope of protection of the present invention.

Claims

1. A social blog management system based on Vue and SpringBoot, characterized by: include: The front-end module, built on the Vue.js framework, is used to obtain user login information and user blog information, and respond to the verification results of the back-end module to visualize the user blog information and personalized recommendation information; The backend module, built on the SpringBoot framework, is used to handle business logic and data interaction, verify user login information, and generate personalized recommendation information based on user blog information; Database module, used to store and cache user login information and user blog information; The front-end module and the back-end module interact with each other via AJAX and RESTful API.

2. The social blog management system based on Vue and SpringBoot as claimed in claim 1, characterized in that: The front-end module includes: User login unit, used to collect user login information and present login verification results based on a visual interface; Article presentation unit, used to visually present article categories, article searches, article content, likes and favorites, and article comments; Activity presentation unit, used to visually present activity content, registration activities, likes and favorite activities, and comment activity information; The personal center presentation unit is used to visually present user blog information, where the user blog information includes personal information, published articles, query of published articles, editing and deletion of published articles, query of registered activities, query of liked and collected articles and activities, and viewing of commented articles and activity information.

3. The social blog management system based on Vue and SpringBoot as claimed in claim 1, characterized in that: The back-end module includes: A user verification unit, configured to obtain user login information and verify and identify the user login request based on the user login information; Backend management unit, based on SpringBoot framework, implements blog classification management, blog information management, activity information management, comment information management, activity registration management, announcement information management, administrator information management, and user information management; Personalized recommendation unit, which obtains user blog information, generates personalized recommendation information based on the user blog information, and pushes relevant recommendation sequence diagrams; The data access layer interacts with the database module through MyBatis and performs data storage, query, update, and delete operations; The RESTful API interface is used for data interaction between front-end modules and back-end modules, and realizes synchronous update and asynchronous loading of data.

4. The social blog management system based on Vue and SpringBoot as claimed in claim 1, characterized in that: The database module includes: MySQL, a relational database, stores user login information, user blog information, and activity data; In-memory database Redis, used for caching frequently accessed data and session management; OSS storage database, used for storing and managing static resource information.

5. The social blog management system based on Vue and SpringBoot as claimed in claim 4, characterized in that: The relational database MySQL includes: User information table, used to store user login information, including user name, password, nickname, phone number, email address, avatar, character ID, birthday, and profile; Administrator information table, used to store administrator information, including user name, password, nickname, phone number, email address, avatar, and role identification; Article information table, used to store article content, category, release time, views, likes, and favorites; The activity information table is used to store activity information, including the activity name, activity introduction, activity content, start time, end time, activity form, activity address, organizer, page views, and cover; Comment information table, used to store comment content, publishing time, article, user, root comment ID, and reply comment ID information; The like information table is used to store the user's like records for articles or activities. The like information table includes the like time, like object ID, and like user ID; The collection information table is used to store the user's collection records of articles or activities. The collection information table includes the collection time, collection object ID, and collection user ID.

6. The social blog management system based on Vue and SpringBoot as claimed in claim 3, characterized in that: The method for verifying and identifying a user login request based on user login information includes: In response to a user login instruction, the user login unit starts a login security mechanism based on the user login instruction, generates a random verification code, and presents the random verification code based on a visual interface; Collect random verification codes, user account information, and user identity information in real time, and package the random verification codes, user account information, and user identity information into user login information; Forming a login request based on the user login information and pushing the login request to the user verification unit, the user verification unit receives the login request, identifies the user account information and user identity information in the user login information, retrieves the account information record and password information record stored in the database module respectively, and determines whether the user account information and user identity information exist based on the account information record and password information record; If the user account information and user identity information both have corresponding account information records and password information records, it is determined that the login request verification is successful, the user login information is verified, and the login request verification is pushed to the user login unit.

7. The social blog management system based on Vue and SpringBoot according to claim 6, characterized in that: The method for performing login verification on user login information includes: Load the user login information. The user verification unit generates an authentication token based on the user login information. The authentication token is the user's identity credential in the logged-in state. When the user performs an operation, the front-end module attaches the authentication token to the header of the HTTP request for identity authentication by the user verification unit of the back-end module. The user verification unit searches for information associated with the user ID in the in-memory database Redis. If the corresponding user account information is not found in the in-memory database Redis, the user verification unit searches for information in the relational database MySQL. If matching user account information is found in the relational database MySQL, the user verification unit will synchronously update the user account information to the in-memory database Redis; Get the user account information, parse the user account information, and store the user ID parsed from the user account information in ThreadLocal.

8. The social blog management system based on Vue and SpringBoot as claimed in claim 3, characterized in that: The personalized recommendation unit includes: Article classification module, identifies the author's article classification information in the user's blog information and generates article classification results; Article search module, users identify search keywords in user blog information and use fuzzy query to generate article search results; Article ranking module, which sorts articles based on article reading volume information and generates article ranking lists; The activity overview module pushes the top two groups of activities based on the number of activity views and presents them through a visual interface.

9. The social blog management system based on Vue and SpringBoot as claimed in claim 8, characterized in that: The personalized recommendation unit further includes: The related recommendation module is used to obtain article search results, generate a related recommendation time series diagram based on the article search results, query articles of the same type and present the pageview ranking results through a visual interface; The likes and favorites optimization module is used to receive like or favorite requests, store the number of likes and favorites in the Redis cache of the in-memory database Redis, and synchronize the number of likes and favorites based on the preset data synchronization strategy; The comment optimization module is used to identify user comment information in user blog information. The front-end module encapsulates the user comment information, verifies the user account information based on the back-end module, and records the root ID and reply ID corresponding to the user comment information.

10. A social blog management method based on Vue and SpringBoot, implemented using the social blog management system based on Vue and SpringBoot according to any one of claims 1 to 9, characterized in that: The social blog management method based on Vue and SpringBoot includes: S10, collect user registration information through the front-end module, and the back-end module persists the user registration information to the MySQL database and generates an encrypted salt value to store the password; S20, when the user logs in, the front-end module sends the username / password to the back-end through axios. The back-end module generates an authentication token and returns it. The front-end stores the authentication token and attaches it to the header of the HTTP request. S30, the front-end module obtains the user blog information, and the back-end module receives the user blog information and stores it in the database module; S40, when a user visits the article details page, the front-end module sends the user's blog information, and the back-end module uses fuzzy query to generate article search results, performs associated query, and reads the cached popular article list from Redis; S50, when a user performs a like or collection operation, a like or collection request is received, the number of likes and the number of collections are stored in the Redis cache of the in-memory database Redis, and the number of likes and the number of collections are synchronized based on a preset data synchronization strategy and synchronized to the relational database MySQL via RabbitMQ; S60, when the user makes a comment operation, the user comment information in the user blog information is identified, the front-end module encapsulates the user comment information, verifies the user account information based on the back-end module, and records the root ID and reply ID corresponding to the user comment information.

Images