Page rendering method and device, computer equipment and storage medium

By matching the class name identifier of the cascading style sheet based on account information for page rendering, the problem of low browser rendering efficiency in traditional permission control is solved, and more efficient and flexible permission management and page rendering are achieved.

CN120705433APending Publication Date: 2025-09-26SHANGHAI QIANYI TECHNOLOGY CO LTD
View PDF 0 Cites 0 Cited by

Patent Information

Application Number
CN202510948118.5
Authority / Receiving Office
CN · China
Patent Type
Applications(China)
Current Assignee / Owner
Filing Date
2025-07-10
Publication Date
2025-09-26

AI Technical Summary

Technical Problem

Traditional permission control in web applications relies on JavaScript to dynamically manipulate DOM elements, which frequently triggers the browser rendering pipeline performance overhead and affects page rendering efficiency.

Method used

By responding to the access request of the target account, obtaining account information, determining the permission identifier combination, and using the permission identifier combination to match the class name identifier of the cascading style sheet, the page is finally rendered based on the cascading style sheet, avoiding conditional judgment and DOM structure operations in JavaScript logic.

Benefits of technology

It significantly reduces the complexity of business code, lowers the performance overhead of the browser rendering pipeline, improves page rendering efficiency, and enhances the maintainability and scalability of the system.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN120705433A_ABST
    Figure CN120705433A_ABST
Patent Text Reader

Abstract

The invention relates to a page rendering method and device, computer equipment, a storage medium and a computer program product. The method comprises the steps of obtaining account information of a target account in response to an access request of the target account for a target page; determining a permission identifier combination associated with the target account according to the account information; determining a class name identifier of a cascading style sheet corresponding to each permission identifier in the permission identifier combination by utilizing the permission identifier combination; according to the class name identifier of the cascading style sheet, matching to obtain the cascading style sheet of the target page; and rendering the target page based on the cascading style sheet. By adopting the method, accounts with different permissions can access the target page more quickly and smoothly.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] The present application relates to the field of front-end development technology, and in particular to a page rendering method, apparatus, computer equipment, storage medium, and computer program product. Background Art

[0002] With the rapid development of front-end technology, permission control is becoming increasingly important in web applications. Specifically, from the perspective of user interaction, different users have different operational requirements and permissions. For example, a regular user may only have permission to view page information, while an administrator may have permission to perform advanced operations such as editing and deleting pages.

[0003] Traditional permission control relies primarily on JavaScript to dynamically manipulate DOM elements or component states. However, permission verification often requires embedding numerous conditional checks within JavaScript logic, directly manipulating the DOM structure to reflect permission status. This approach not only requires writing complex business code but also frequently triggers the performance overhead of the browser rendering pipeline, impacting page rendering performance and significantly reducing page rendering efficiency. Summary of the Invention

[0004] Based on this, it is necessary to provide a page rendering method, apparatus, computer device, computer-readable storage medium and computer program product to address the above technical issues.

[0005] In a first aspect, the present application provides a page rendering method. The method comprises:

[0006] In response to a target account's access request to a target page, obtaining account information of the target account;

[0007] Determining, based on the account information, a permission identification combination associated with the target account;

[0008] Using the permission identification combination, determining the class name identification of the cascading style sheet corresponding to each permission identification in the permission identification combination;

[0009] According to the class name identifier of the cascading style sheet, the cascading style sheet of the target page is matched and obtained; and the target page is rendered based on the cascading style sheet.

[0010] In one embodiment, determining the authority identification combination associated with the target account based on the account information includes:

[0011] According to the account information, matching is performed to obtain the role identifier of the target account;

[0012] Get the permission ID set of the role ID.

[0013] In one embodiment, before obtaining the role identifier of the target account through matching based on the account information, the method further includes:

[0014] Establish an initial access control model based on role identification;

[0015] Obtain the association relationship between the permission identifier set and the role set, and the association relationship between the permission identifier set and the class name identifier of the cascading style sheet;

[0016] The association relationship between the permission identifier set and the role set, and the association relationship between the permission identifier set and the class name identifier of the cascading style sheet are associated with the initial access control model to obtain a target access control model based on the role identifier; wherein the target access control model is used to determine the role identifier of the target account based on the account information of the target account, and match the corresponding permission identifier based on the role identifier, and match the corresponding class name identifier of the cascading style sheet based on the permission identifier of the target account.

[0017] In one embodiment, the method further comprises:

[0018] Determining an initial permission container for the cascading style sheet; wherein the initial permission container is used to determine whether to hide or display the cascading style sheet according to the permission identifier of the target account;

[0019] The target access control model is associated with the initial permission container to obtain a target permission container.

[0020] In one embodiment, the target account is matched with one or more role identifiers; and the cascading style sheet of the target page is matched according to the class name identifier of the cascading style sheet; including:

[0021] In the case where the target account matches a role identifier, the cascading style sheet of the target page is matched according to the class name identifier of the cascading style sheet;

[0022] When the target account matches multiple role identifiers, determining whether class name identifiers of cascading style sheets corresponding to the respective role identifiers conflict, and if there is a conflict in the class name identifiers of the cascading style sheets, obtaining a priority of the class name identifiers of the respective cascading style sheets;

[0023] Based on the priorities of the class name identifiers of the cascading style sheets, the class name identifier of the target cascading style sheet is determined; and according to the class name identifier of the target cascading style sheet, the cascading style sheet of the target page is matched and obtained.

[0024] In one embodiment, each permission identifier in the permission identifier combination corresponds to a class name identifier set of a stacked prototype table; the method includes:

[0025] Using the permission identification combination, determining a set of class name identifications of cascading style sheets corresponding to each permission identification in the permission identification combination;

[0026] According to the class name identification set, matching and obtaining the cascading style sheet corresponding to each class name identification set;

[0027] The cascading style sheets corresponding to the class name identification sets are rendered respectively to obtain a target page.

[0028] In a second aspect, the present application also provides a page rendering device. The device includes:

[0029] An account acquisition module, configured to acquire account information of a target account in response to an interaction request of the target account to the target page;

[0030] an authority determination module, configured to determine an authority identification combination associated with the target account based on the account information;

[0031] A class name determination module, configured to determine, by using the permission identifier combination, the class name identifiers of the cascading style sheets corresponding to the respective permission identifiers in the permission identifier combination;

[0032] The page rendering module is used to match the cascading style sheet of the target page according to the class name identifier of the cascading style sheet; and render the target page based on the cascading style sheet.

[0033] In one embodiment, the permission determination module includes:

[0034] A role determination submodule, configured to obtain a role identifier of the target account by matching the account information;

[0035] The authority determination submodule is used to obtain the authority identification set of the role identification.

[0036] In one embodiment, the device further comprises:

[0037] Model building module, used to build an initial access control model based on role identification;

[0038] An association relationship acquisition module is used to acquire the association relationship between the permission identifier set and the role set, and the association relationship between the permission identifier set and the class name identifier of the cascading style sheet;

[0039] An association model module is used to associate the association relationship between the permission identifier set and the role set, and the association relationship between the permission identifier set and the class name identifier of the cascading style sheet, into the initial access control model to obtain a target access control model based on the role identifier; wherein the target access control model is used to determine the role identifier of the target account based on the account information of the target account, and match the corresponding permission identifier based on the role identifier, and match the corresponding class name identifier of the cascading style sheet based on the permission identifier of the target account.

[0040] In one embodiment, the apparatus further comprises:

[0041] A container determination module, configured to determine an initial permission container for the cascading style sheet; wherein the initial permission container is configured to determine whether to hide or display the cascading style sheet based on the permission identifier of the target account;

[0042] The container determination module is used to associate the target access control model with the initial permission container to obtain a target permission container.

[0043] In one embodiment, the target account matches one or more role identifiers; the page rendering module includes:

[0044] A style sheet matching submodule, configured to match the cascading style sheet of the target page according to the class name identifier of the cascading style sheet when the target account matches a role identifier;

[0045] a priority determination submodule for determining, when the target account matches multiple role identifiers, whether class name identifiers of the cascading style sheets corresponding to the respective role identifiers conflict, and obtaining the priority of the class name identifiers of the cascading style sheets if there is a conflict between the class name identifiers of the cascading style sheets;

[0046] The style sheet matching submodule is further configured to determine the class name identifier of the target cascading style sheet based on the priority of the class name identifiers of each cascading style sheet; and to match the cascading style sheet of the target page according to the class name identifier of the target cascading style sheet.

[0047] In one embodiment, each permission identifier in the permission identifier combination corresponds to a class name identifier set of a stacked prototype table; the apparatus further comprises:

[0048] a class name set determination module, configured to determine, by using the permission identifier combination, a class name identifier set of a cascading style sheet corresponding to each permission identifier in the permission identifier combination;

[0049] A style sheet matching module, configured to match the class name identifier set to obtain the cascading style sheet corresponding to each class name identifier set;

[0050] The style sheet rendering module is used to render the cascading style sheets corresponding to each of the class name identifier sets respectively to obtain a target page.

[0051] In a third aspect, the present application further provides a computer device comprising a memory and a processor, wherein the memory stores a computer program, and the processor implements the page rendering method as described in any one of the embodiments of the present disclosure when executing the computer program.

[0052] In a fourth aspect, the present application further provides a computer-readable storage medium having a computer program stored thereon, which, when executed by a processor, implements the page rendering method as described in any one of the embodiments of the present disclosure.

[0053] In a fifth aspect, the present application further provides a computer program product, comprising a computer program that, when executed by a processor, implements the page rendering method as described in any one of the embodiments of the present disclosure.

[0054] The above-mentioned page rendering method, apparatus, computer equipment, storage medium and computer program product determine the permission identification combination based on the account information of the target account, and then match the class name identification of the cascading style sheet according to the permission identification combination, and finally render the page according to the cascading style sheet, avoiding the problem of embedding a large number of conditional judgments in JavaScript logic and directly manipulating the DOM structure in traditional permission control. This method significantly reduces the complexity of business code, reduces the performance overhead of the browser rendering pipeline, effectively improves page rendering efficiency, and allows accounts with different permissions to access the target page more quickly and smoothly. At the same time, this method also enhances the maintainability and scalability of the system, facilitating subsequent modification and addition of permission rules and style sheets. BRIEF DESCRIPTION OF THE DRAWINGS

[0055] Figure 1 This is an application environment diagram of a page rendering method in one embodiment;

[0056] Figure 2 A schematic diagram of a process flow of a page rendering method in one embodiment;

[0057] Figure 3 A schematic diagram of a process flow for developing a page rendering method in one embodiment;

[0058] Figure 4 A schematic diagram of developing code hints and automatic completion in one embodiment;

[0059] Figure 5 A schematic diagram of a process for implementing a page rendering method in one embodiment;

[0060] Figure 6 A schematic diagram of matching roles and permissions with accounts and rendering pages in one embodiment;

[0061] Figure 7 This is a structural block diagram of a page rendering device in one embodiment;

[0062] Figure 8 FIG. 1 is a diagram showing the internal structure of a computer device in one embodiment. DETAILED DESCRIPTION

[0063] In order to make the purpose, technical solutions and advantages of this application more clear, the following further describes this application in detail with reference to the accompanying drawings and embodiments. It should be understood that the specific embodiments described herein are only used to explain this application and are not intended to limit this application.

[0064] The page rendering method provided in the embodiment of the present application can be applied to Figure 1 In the application environment shown. Among them, the terminal 102 communicates with the server 104 through the network. The data storage system can store the data that the server 104 needs to process. The data storage system can be integrated on the server 104, or it can be placed on the cloud or other network servers. The user sends an access request for the target page to the server 104 through the terminal 102. The server 104 obtains the account information of the target account, uses the account information to match the corresponding permission identification combination, and uses the permission identification combination to match the class name identification of the cascading style sheet, and renders the target page based on the cascading style sheet, and displays it to the user through the terminal 102. Among them, the terminal 102 can be, but is not limited to, various personal computers, laptops, smart phones, tablets, Internet of Things devices and portable wearable devices. The Internet of Things devices can be smart speakers, smart TVs, smart air conditioners, smart car-mounted devices, etc. Portable wearable devices can be smart watches, smart bracelets, head-mounted devices, etc. The server 104 can be implemented as an independent server or a server cluster consisting of multiple servers.

[0065] In one embodiment, Figure 2 As shown, a page rendering method is provided, comprising the following steps:

[0066] Step S102 : in response to the target account's access request to the target page, obtaining the target account's account information.

[0067] Among them, the target account may include but is not limited to different types of accounts such as ordinary user accounts and administrator accounts. Account information may include the user's basic information, role information, permission information, etc. Different types of accounts have different permissions and resources that can be obtained when accessing the target page. For example, an ordinary user account may only be able to view part of the content of the page, while an administrator account can fully manage and operate the page. Subsequently, the permission identification combination is determined based on these account information, thereby providing an accurate style basis for page rendering, etc. Account information may include account identification, etc. The role information of the target account can be accurately determined through the account identification, wherein the role information may include roles with different permissions, for example, users are only used for search permissions, administrators are used for all permissions, managers have search and editing permissions, etc. The account identification can be used to determine the role information of the account, etc.

[0068] In an exemplary embodiment, a request to access a target page may include a request from a target account to view the target page. Specifically, a user may generate an access request by entering a URL, clicking a target link, or otherwise redirecting to the page. Account information may be obtained through interaction between a terminal device and a server. For example, when a target account initiates an access request, the terminal device may send relevant account information, such as a locally stored account identifier, to the server, which then processes and verifies the information. The server may also query the target account's detailed information from stored user information by interacting with a database.

[0069] In an exemplary embodiment, when the account information of the target account is not found, a default page of the target page may be displayed.

[0070] Step S104: Determine the authority identification combination associated with the target account according to the account information.

[0071] The permission identifier combination may include multiple permission identifiers, which represent the different permissions that the target account has when accessing the target page. For example, some permission identifiers represent the ability to view images on the page, while others represent the ability to modify text content on the page. Specifically, permission identifiers can be represented in the form of permission codes, such as "11" and "12." Permission identifiers can also be represented by permission names, such as "edit" (edit permission) and "view" (view).

[0072] In an exemplary embodiment, the permission identification combination can be determined by matching the account information with pre-set permission rules. The pre-set permission rules can be stored in a database, and the server obtains these rules from the database. Then, based on the account information of the target account, such as role information, the server finds the corresponding permission identification combination. For example, if the role of the target account is a common user, according to the permission rules, the corresponding permission identification combination may only include the permission identification for viewing the basic content of the page; if it is an administrator role, the permission identification combination may include multiple permission identifications such as viewing, modifying, and deleting.

[0073] Step S106: using the permission identifier combination, determine the class name identifier of the cascading style sheet corresponding to each permission identifier in the permission identifier combination.

[0074] Among them, the class name identifier of the cascading style sheet may include various identifiers for distinguishing different style rules. Each permission identifier is associated with a specific class name identifier of the cascading style sheet, because different permissions correspond to different page display styles. Specifically, determining the class name identifier may include determining the displayed class name identifier and the hidden class name identifier. For example, the cascading style sheet class name identifier corresponding to an account with permission to view images may set the display style of the image, while the class name identifier corresponding to an account without such permission may set the display attribute of the image to hidden, etc.

[0075] In an exemplary embodiment, such correspondence can be achieved by establishing a mapping relationship between the permission identifier and the cascading style sheet class name identifier. This mapping relationship can be stored in a configuration file or database of the server.

[0076] Step S108 : matching the cascading style sheet of the target page according to the class name identifier of the cascading style sheet, and rendering the target page based on the cascading style sheet.

[0077] Cascading style sheets (CSS) can include various style rules that define the appearance and layout of the target page. Matching the CSS for the target page involves finding the corresponding style sheet from a predefined set of style sheets based on the class name. For example, when the class name is "view-normal-user," the style sheet corresponding to that class name is found in the set of style sheets. This style sheet might specify the font, color, size, and other styles of elements used by ordinary users viewing the page.

[0078] In an exemplary embodiment, when matching a cascading style sheet, you can first search in the local cache to see if there is a style sheet corresponding to the class name identifier. If it exists in the local cache, the style sheet is used directly for rendering, which can improve rendering efficiency and reduce interaction with the server. If the corresponding style sheet is not found in the local cache, the corresponding cascading style sheet is obtained from the server and stored in the local cache for subsequent use. When the target page is rendered based on the cascading style sheet, the style of the page elements will be adjusted according to the rules in the style sheet, such as setting the background color, border style, font style, etc. of the element, so as to present a page effect that complies with the permissions of the target account. At the same time, during the rendering process, the priority of the cascading style sheet will also be considered to ensure the correct application of the style. If the style of the same element is defined differently in different style sheets, the final applied style will be determined based on the priority.

[0079] In an exemplary embodiment, the page rendering method may also employ Tailwind CSS to implement rapid style configuration and responsive design. Tailwind CSS is a utility-class-first CSS framework that provides a large number of atomic classes that can be used directly in HTML, eliminating the need to write large amounts of custom CSS code. In this page rendering method, Tailwind CSS can be used to map permission identifiers to Tailwind CSS class name identifiers. For example, the "view" permission identifier is mapped to a class name in Tailwind CSS used to control element display, such as "block" (displaying an element); the "hide" permission identifier is mapped to "hidden" (hiding an element), and so on.

[0080] In the above page rendering method, the permission identifier combination is determined based on the account information of the target account, and then the class name identifier of the cascading style sheet is matched according to the permission identifier combination. Finally, the page is rendered according to the cascading style sheet, avoiding the problem of embedding a large number of conditional judgments in JavaScript logic and directly manipulating the DOM structure in traditional permission control. This method significantly reduces the complexity of business code, reduces the performance overhead of the browser rendering pipeline, effectively improves page rendering efficiency, and allows accounts with different permissions to access the target page more quickly and smoothly. At the same time, this method also enhances the maintainability and scalability of the system, facilitating subsequent modifications and additions to permission rules and style sheets.

[0081] In one embodiment, determining the authority identification combination associated with the target account based on the account information includes:

[0082] According to the account information, the role identifier of the target account is obtained by matching.

[0083] Role identifiers can include unique identifiers corresponding to different roles, such as a regular user role identifier and an administrator role identifier. Each role identifier is associated with a specific set of permissions, and the role identifier can be used to quickly locate the scope of permissions possessed by the target account. For example, after obtaining the target account's account information, the role-related content in the account information is compared with the role identifiers in the database by querying the database storing role information, thereby accurately matching the target account's role identifier.

[0084] In an exemplary embodiment, the account information may include an account identifier, and the role identifier of the target account may be matched based on the account identifier. Specifically, a database for storing role information may be established, that is, all accounts matching the role are stored. The target account may be found in the database through the account identifier, thereby determining the role identifier of the target account.

[0085] Get the permission ID set of the role ID.

[0086] In an exemplary embodiment, the permission identification combination corresponding to the role identification can be determined based on the role identification. A mapping table of role and permission identification combinations can be established and stored in the database or configuration file of the server. After the role identification of the target account is determined, the permission identification combination corresponding to the role identification is directly searched from the mapping table. For example, if the role identification of the target account is an ordinary user, it can be known from the mapping table that its corresponding permission identification combination only includes the permission identification for viewing the basic content of the page; if the role identification is an administrator, the corresponding permission identification combination includes multiple permission identifications such as viewing, modifying, and deleting. In this way, the permission identification combination associated with the target account can be determined efficiently and accurately based on the account information, providing a key basis for subsequent page rendering.

[0087] In this embodiment, by first determining the role identifier of the target account and then obtaining the permission identifier set corresponding to the role identifier, the process of determining the permission identifier combination is made clearer and more organized. This not only improves the accuracy of permission matching, but also lays a solid foundation for subsequent page rendering operations based on the permission identifier combination. This method of associating account information with role identifiers and permission identifier sets makes the entire page rendering process more scientific and efficient, avoids the complexity and inefficiency problems existing in traditional permission control methods, and further improves the performance of the system. At the same time, this method also makes permission management more flexible and scalable, facilitating subsequent adjustment and optimization of roles and permissions.

[0088] In one embodiment, before obtaining the role identifier of the target account through matching according to the account information, the method further includes:

[0089] Establish an initial access control model based on role identification.

[0090] The initial access control model based on role identification can include the correspondence between role identification and access rights, as well as basic access control rules. This model serves as the foundational framework for permission management and page rendering, clarifying the operational permissions and access scopes of different roles within the system. For example, for a regular user role, the model can stipulate that they can only access and view specific page content, while an administrator role can be granted management and operation permissions for all pages within the system. For example, the RBAC model can be used as the initial access control model based on role identification.

[0091] Get the association between the permission identifier set and the role set, and the association between the permission identifier set and the class name identifier of the cascading style sheet.

[0092] The association relationship between the permission identifier set and the role set, and the association relationship between the permission identifier set and the class name identifier of the cascading style sheet are associated with the initial access control model to obtain a target access control model based on the role identifier; wherein the target access control model is used to determine the role identifier of the target account based on the account information of the target account, and match the corresponding permission identifier based on the role identifier, and match the corresponding class name identifier of the cascading style sheet based on the permission identifier of the target account.

[0093] In an exemplary embodiment, the association relationship between the permission identifier set and the role set, as well as the association relationship between the permission identifier set and the class name identifier of the cascading style sheet, can be obtained through database query, configuration file reading, etc. These association relationships are then integrated into the initial access control model based on the role identifier to form a more complete target access control model based on the role identifier. In actual application, the target access control model will accurately match the role identifier of the target account based on the account information of the target account, and then determine the corresponding permission identifier based on the role identifier. In this way, it is possible to achieve refined control of page rendering, ensuring that accounts of different roles can only obtain content and styles within their authority range when accessing the target page, further enhancing the security and stability of the system. At the same time, the target access control model also has good maintainability and extensibility, which facilitates the subsequent flexible adjustment and update of roles, permissions and style sheets.

[0094] In this embodiment, by establishing and improving a role-based targeted access control model, the association between permission identifier sets, role sets, and cascading style sheet class name identifiers is integrated into it, making permission management throughout the page rendering process more systematic and standardized. This model not only accurately determines role identifiers and permission identifiers based on account information, but also achieves precise control over page rendering through the mapping of permission identifiers to cascading style sheet class name identifiers.

[0095] In one embodiment, the method further comprises:

[0096] Determine an initial permission container of the cascading style sheet; wherein the initial permission container is used to determine hiding and displaying of the cascading style sheet according to the permission identifier of the target account.

[0097] The initial permission container can include an administrator-determined element type, such as a div, that holds a set of roles, a set of permissions, and a set of class names. Specifically, the administrator can control the hiding and display of elements in the initial permission container based on the target account's permission identifier. For example, a check statement can be added after the div to determine whether the target account is a certain role. If the target account is that role, the cascading style sheet is displayed; if not, the style sheet is hidden and not rendered.

[0098] The target access control model is associated with the initial permission container to obtain a target permission container.

[0099] In an exemplary embodiment, relevant information of the target access control model, such as the association between roles and permissions, permissions and class name identifiers, etc., can be added to the initial permission container in the form of data attributes. For example, custom data attributes such as data-role, data-permission, etc. can be added to the HTML tag of the initial permission container to store role information and permission information respectively. In this way, when the page is loaded, according to the information of the target account and combined with the data attributes on the target permission container, the hiding and display of the cascading style sheet can be conveniently controlled. By associating the target access control model with the initial permission container to obtain the target permission container, the permission-based style control in the page rendering process is further optimized, so that the page can be rendered more accurately according to the permissions of the target account, improving the flexibility and accuracy of page rendering, while also enhancing the security and maintainability of the system.

[0100] In this embodiment, by constructing a target permission container, the control of account permissions and page styles is further closely integrated. When the page is rendered, the target permission container can dynamically determine the display and hiding of the cascading style sheet based on the permission identifier of the target account, thereby achieving fine-grained permission control of the page content. This approach not only makes page rendering more efficient and flexible, but also avoids unnecessary rendering operations. At the same time, due to the association between the target permission container and the target access control model, permission management and style control are more intuitive and easy to maintain. When it is necessary to adjust the permission rules or style sheets, only the target access control model and the target permission container need to be modified accordingly, and they can be quickly applied to the entire system, greatly improving the scalability and maintainability of the system.

[0101] In one embodiment, the target account is matched with one or more role identifiers; and the cascading style sheet of the target page is matched according to the class name identifier of the cascading style sheet; including:

[0102] In the case where the target account matches a role identifier, the cascading style sheet of the target page is matched according to the class name identifier of the cascading style sheet.

[0103] In an exemplary embodiment, when the target account has only one role identifier that matches it, the class name identifier of the corresponding cascading style sheet and the cascading style sheet, etc. can be matched based on the role identifier.

[0104] When the target account matches multiple role identifiers, determine whether the class name identifiers of the cascading style sheets corresponding to the role identifiers conflict. If there is a conflict in the class name identifiers of the cascading style sheets, obtain the priority of the class name identifiers of the cascading style sheets.

[0105] Cascading Style Sheet (CSS) class name conflicts can occur when class name identifiers corresponding to different role identifiers point to different style rules, resulting in uncertainty about which style to apply when rendering a page. For example, a target account matches both the standard user and advanced user role identifiers. The standard user role class name specifies black page text color, while the advanced user role class name specifies blue page text color, creating a conflict.

[0106] The priority of class names in each cascading style sheet can be pre-set and stored in a server configuration file or database. Priority can be determined based on factors such as the importance of the role and the scope of permissions. For example, the class name corresponding to the administrator role may have a higher priority than the class name corresponding to the general user role.

[0107] Based on the priorities of the class name identifiers of the cascading style sheets, the class name identifier of the target cascading style sheet is determined; and according to the class name identifier of the target cascading style sheet, the cascading style sheet of the target page is matched and obtained.

[0108] In an exemplary embodiment, after determining the priority of the class name identifiers of each cascading style sheet, the class name identifier of the target cascading style sheet can be determined based on the priority. If there is a conflict, the class name identifier with a higher priority is selected as the class name identifier of the target cascading style sheet. For example, in the above-mentioned example of the conflict between the class name identifiers of ordinary users and advanced user roles, if the class name identifier corresponding to the advanced user role has a higher priority, the class name identifier corresponding to the advanced user role is selected as the target class name identifier. Then, based on the class name identifier of this target cascading style sheet, the cascading style sheet of the target page is matched from the pre-defined style sheet set. In this way, even if the target account matches multiple role identifiers, the page rendering work can be accurately completed by reasonably handling the class name identifier conflict.

[0109] In one exemplary embodiment, the RBAC model (Role-Based Access Control) can be embedded in the page rendering method. By combining the RBAC model with CSS styles, permission control and page rendering can be better integrated. In the RBAC model, permissions are associated with roles, and different roles have different sets of permissions. The roles and permissions in the RBAC model can be mapped to Cascading Style Sheet (CSS) class names, allowing the role permissions to directly correspond to the page's presentation style. For example, for a role with "Edit" permissions, the corresponding CSS class name can be set to allow editable page elements; for a role with only "View" permissions, the corresponding class name can be set to prevent editable elements, and so on. This approach further simplifies the logic of permission management and page rendering, improving the overall performance and maintainability of the system. Furthermore, the flexibility of the RBAC model allows for convenient adjustment and expansion of roles and permissions to accommodate diverse business needs.

[0110] In this embodiment, the conflict of cascading style sheet class name identifiers that may occur when the target account matches multiple role identifiers is handled by setting priorities, ensuring the accuracy and consistency of page rendering. This processing method can effectively avoid page style confusion caused by overlapping role permissions, so that users of different roles can obtain clear and stable page display effects that are consistent with their permissions when accessing the target page. At the same time, this method of determining the target cascading style sheet class name identifier based on priority further improves the flexibility and maintainability of the system when handling multi-role permissions, making it easier to quickly and accurately update and adapt the style sheet when the system is upgraded or the permission rules are adjusted.

[0111] In one embodiment, determining the authority identification combination associated with the target account based on the account information includes:

[0112] According to the account information, a target page corresponding to the target account is matched from the local cache.

[0113] Among them, the local cache may include an area where the terminal device temporarily stores data to improve access efficiency. When the target account initiates an access request to the target page, it is first checked whether the target page information corresponding to the account exists in the local cache. A cache structure indexed by account information can be established. After receiving the account information, the corresponding target page is directly searched in this cache structure. For example, the account ID is used as the index key to store relevant information about the target page last visited by the account. If the target page is matched in the local cache, the permission identification combination associated with the target page is obtained. In addition to storing the basic information of the target page, the local cache can also store the corresponding permission identification combination. A special field can be set in the local cache to store the permission identification combination. When the target page is matched, the corresponding permission identification combination is directly obtained from the field.

[0114] If the target page corresponding to the target account is not matched in the local cache, the permission identification combination of the target account is obtained from the server and stored in the local cache.

[0115] In an exemplary embodiment, if there is no target page corresponding to the target account in the local cache, the terminal device can send a request to the server, requesting the server to provide the permission identification combination of the target account. After receiving the request, the server determines the permission identification combination of the target account according to the previously described method and the account information of the target account, such as by matching the role identification, querying the mapping table of the role and permission identification combination, and returns it to the terminal device. After receiving the permission identification combination, the terminal device stores it in the local cache and stores the corresponding target page information at the same time, so that when the account accesses the target page again in the future, the permission identification combination can be directly obtained from the local cache, thereby improving access efficiency.

[0116] In one embodiment, each permission identifier in the permission identifier combination corresponds to a class name identifier set of a stacked prototype table; the method includes:

[0117] The permission identification combination is used to determine a set of class name identifications of cascading style sheets corresponding to each permission identification in the permission identification combination.

[0118] Among them, the class name identification set can correspond to the permission identification, that is, one permission identification can correspond to multiple class name identifications. Specifically, each module of the page corresponds to multiple class name identifications, and each module will have different display styles according to different permissions. For example, for the picture display module of the page, the class name identification set corresponding to the account with the permission to view high-definition pictures may set the high-definition display style of the picture, while the class name identification set corresponding to the account with only the permission to view thumbnails will set the picture to the thumbnail display style. In this way, the style of each module of the page can be finely controlled according to different permissions.

[0119] In an exemplary embodiment, determining the class name identifier set can also be achieved by establishing a mapping relationship between permission identifiers and cascading style sheet class name identifier sets. This mapping relationship can be stored in a server configuration file or database. Once the permission identifier combination is obtained, the cascading style sheet class name identifier set corresponding to each permission identifier can be quickly and accurately determined based on this mapping relationship.

[0120] According to the class name identification set, the cascading style sheets corresponding to each class name identification set are matched and obtained.

[0121] The cascading style sheets corresponding to the class name identification sets are rendered respectively to obtain a target page.

[0122] In an exemplary embodiment, after obtaining the cascading style sheets corresponding to each class name identifier set, parallel rendering can be used to improve rendering efficiency. For example, using multi-threading technology, an independent thread is assigned to the cascading style sheet corresponding to each class name identifier set for rendering. When all threads have completed rendering, the various rendering results are merged to finally present a complete target page. This not only reduces rendering time, but also makes full use of the computing resources of the device. At the same time, during the rendering process, the rendering status must be monitored in real time. If a thread has an exception or rendering times out, error handling and retry operations must be performed in a timely manner to ensure that the target page can be rendered stably and accurately.

[0123] It is understandable that each module uses a different set of class name identifiers, so different modules can be independently styled during rendering. This allows each part of the page to accurately display different style effects based on the permissions of the target account. In addition, this modular rendering method further enhances the flexibility and maintainability of the system. If the style of a module needs to be adjusted later, it is only necessary to modify the class name identifier set and cascading style sheet corresponding to the module, without affecting other modules. At the same time, when updating the permission rules, it is also more convenient to modify and adapt the class name identifier set and style sheet of the corresponding module to ensure that the page can always provide accurate and clear display effects based on the permissions of the target account.

[0124] In this embodiment, by associating the permission identification combination with the class name identification set of the cascading style sheet, and then matching and rendering the cascading style sheet based on the class name identification set, fine style control of each module of the page is achieved. This method not only improves the efficiency of page rendering, but also enhances the flexibility and maintainability of the system, and can better adapt to the access requirements of accounts with different permissions. Moreover, throughout the process, whether it is using the local cache to quickly obtain the permission identification combination, or handling the class name identification conflict when matching multiple role identifications, it reflects the efficiency and reliability of the page rendering method in practical applications, and provides a strong guarantee for the stable operation of the system.

[0125] In one embodiment, rendering the target page based on the cascading style sheet includes:

[0126] When the class name identifier of the cascading style sheet does not match a corresponding cascading style sheet, the class name identifier of the historical cascading style sheet of the target account is obtained.

[0127] Based on the class name identifier of the historical cascading style sheet, a target page is rendered.

[0128] In an exemplary embodiment, when the class name identifier of a CSS cannot be matched to a corresponding CSS, the terminal device can search for the class name identifier of the target account's historical CSS. A historical record database can be established to store the class name identifiers of the CSS used by the target account each time it accesses a page. If a match fails, the class name identifier of the most recently used CSS by the account is searched in this historical record database. For example, if the target account previously used a CSS with the class name identifier "style1" and the current class name identifier cannot be matched, "style1" can be retrieved as the class name identifier of the historical CSS. After obtaining the class name identifier of the historical CSS, the corresponding CSS is found from a predefined set of style sheets based on the class name identifier and used to render the target page. This ensures that the target page can be rendered normally even if the current class name identifier fails to match, providing users with a basic page display effect, avoiding missing or cluttered page styles, and improving the user experience. At the same time, at an appropriate time later, the unmatched class name identifiers can be checked and repaired to ensure that the corresponding cascading style sheet can be accurately matched during subsequent visits.

[0129] This embodiment uses the target account's historical CSS class name identifiers for page rendering, providing an effective solution for situations where CSS class name identifier matching fails. This approach ensures the continuity and stability of page rendering and avoids page display anomalies caused by matching failures. Furthermore, subsequent troubleshooting and repair of unmatched class name identifiers helps continuously improve the system's style matching mechanism and enhance the accuracy and reliability of page rendering.

[0130] In an exemplary embodiment, Figure 3 As shown, the page rendering method may also include pre-establishing a data mapping and a cascading style sheet used by the target account to access the target page. Specifically, it may include:

[0131] Step S202: define the permission identifier and generate corresponding permission identifier data in the backend;

[0132] Step S204: Mapping the permission identifier to a CSS class name on the front end by extending the syntax of Tailwind CSS;

[0133] Step S206: establishing different roles and creating a mapping table between different roles and authority identifiers;

[0134] Step S208: Create different cascading style sheets based on the permission identifier, role representation, and CSS class name. In the process of developing cascading style sheets, it is also possible to include integration with development tools to provide code prompts and automatic completion functions for the development process, thereby improving development efficiency. Figure 4 As shown, when editing the role identifier "auth-", "auth-12", "auth-13" and "auth-none" will be automatically displayed for users to choose from, thereby improving development efficiency.

[0135] In an exemplary embodiment, the page rendering method can also be performed as follows Figure 5 implementation, including:

[0136] Step S302: In response to the target account's access request to the target page, obtain the target account's identifier; wherein the target account's identifier is used to determine the target account's role and permission identifier;

[0137] Step S304: determining the role of the target account based on the identifier of the target account; and determining the permission identifier of the corresponding role according to the role of the target account;

[0138] Step S306: Using the permission identifier of the role corresponding to the target account, map the CSS class name corresponding to the permission identifier;

[0139] In step S308, the CSS class name corresponding to the permission identifier is used to control the hiding and display of the cascading style sheet, thereby rendering the target page. Specifically, controlling the hiding and display of the cascading style sheet can include dynamically adjusting the display status of each element in the cascading style sheet based on the permissions of the target account. For example, for roles without specific operation permissions, the cascading style sheet of the corresponding operation button is set to a hidden state, making it invisible on the page; while for roles with the corresponding permissions, the cascading style sheet of the button is set to a displayed state, allowing it to display normally on the page. When the permissions of the target account's role change, the system can update the cascading style sheet in real time based on the CSS class name corresponding to the new permission identifier, ensuring that the content displayed on the page matches the permissions of the target account. In this way, by precisely controlling the hiding and display of the cascading style sheet, the security and flexibility of page rendering can be further enhanced, enabling the page to provide customized display effects based on the permissions of different users. In actual use, class names such as "auth-*" and "role-*" can be used to control permission display, etc.

[0140] In an exemplary embodiment, the page rendering method may further include that the target page may include multiple accounts, and each user may be matched with a corresponding role; each role may be matched with a corresponding permission; each role and permission may be matched with a corresponding cascading style sheet class name, and different cascading style sheets may be matched under different combinations of roles or permissions, thereby displaying different pages; specifically, Figure 6 As shown, first determine the role of the account, and use the role to match the corresponding permissions. Different permissions control different elements, so the displayed pages are also inconsistent. In this way, different target pages can be displayed for different accounts.

[0141] It should be understood that, although the various steps in the flowcharts involved in the various embodiments described above are displayed in sequence according to the instructions of the arrows, these steps are not necessarily executed in sequence in the order indicated by the arrows. Unless otherwise specified herein, there is no strict order restriction on the execution of these steps, and these steps can be executed in other orders. Moreover, at least a portion of the steps in the flowcharts involved in the various embodiments described above can include multiple steps or multiple stages, and these steps or stages are not necessarily executed and completed at the same time, but can be executed at different times, and the execution order of these steps or stages is not necessarily to be carried out in sequence, but can be executed in turn or alternately with other steps or at least a portion of steps or stages in other steps.

[0142] Based on the same inventive concept, embodiments of the present application also provide a page rendering device for implementing the aforementioned page rendering method. The solution provided by this device is similar to the solution described in the aforementioned method. Therefore, the specific limitations of one or more of the following embodiments of the page rendering device can be found in the above-mentioned limitations of the page rendering method and will not be further elaborated here.

[0143] In one embodiment, Figure 7 As shown, a page rendering device 400 is provided, comprising: an account acquisition module 401, an authority determination module 403, a class name determination module 405 and a page rendering module 407, wherein:

[0144] An account acquisition module, configured to acquire account information of a target account in response to an interaction request of the target account to the target page;

[0145] an authority determination module, configured to determine an authority identification combination associated with the target account based on the account information;

[0146] A class name determination module, configured to determine, by using the permission identifier combination, the class name identifiers of the cascading style sheets corresponding to the respective permission identifiers in the permission identifier combination;

[0147] The page rendering module is used to match the cascading style sheet of the target page according to the class name identifier of the cascading style sheet; and render the target page based on the cascading style sheet.

[0148] In one embodiment, the permission determination module includes:

[0149] A role determination submodule, configured to obtain a role identifier of the target account by matching the account information;

[0150] The authority determination submodule is used to obtain the authority identification set of the role identification.

[0151] In one embodiment, the device further comprises:

[0152] Model building module, used to build an initial access control model based on role identification;

[0153] An association relationship acquisition module is used to acquire the association relationship between the permission identifier set and the role set, and the association relationship between the permission identifier set and the class name identifier of the cascading style sheet;

[0154] An association model module is used to associate the association relationship between the permission identifier set and the role set, and the association relationship between the permission identifier set and the class name identifier of the cascading style sheet, into the initial access control model to obtain a target access control model based on the role identifier; wherein the target access control model is used to determine the role identifier of the target account based on the account information of the target account, and match the corresponding permission identifier based on the role identifier, and match the corresponding class name identifier of the cascading style sheet based on the permission identifier of the target account.

[0155] In one embodiment, the apparatus further comprises:

[0156] A container determination module, configured to determine an initial permission container for the cascading style sheet; wherein the initial permission container is configured to determine whether to hide or display the cascading style sheet based on the permission identifier of the target account;

[0157] The container determination module is used to associate the target access control model with the initial permission container to obtain a target permission container.

[0158] In one embodiment, the target account matches one or more role identifiers; the page rendering module includes:

[0159] A style sheet matching submodule, configured to match the cascading style sheet of the target page according to the class name identifier of the cascading style sheet when the target account matches a role identifier;

[0160] a priority determination submodule for determining, when the target account matches multiple role identifiers, whether class name identifiers of the cascading style sheets corresponding to the respective role identifiers conflict, and obtaining the priority of the class name identifiers of the cascading style sheets if there is a conflict between the class name identifiers of the cascading style sheets;

[0161] The style sheet matching submodule is further configured to determine the class name identifier of the target cascading style sheet based on the priority of the class name identifiers of each cascading style sheet; and to match the cascading style sheet of the target page according to the class name identifier of the target cascading style sheet.

[0162] In one embodiment, the permission determination module includes:

[0163] A page matching submodule, configured to match a target page corresponding to the target account from a local cache according to the account information;

[0164] The authority acquisition submodule is used to obtain the authority identification combination of the target account from the server and store it in the local cache when the target page corresponding to the target account is not matched in the local cache.

[0165] In one embodiment, each permission identifier in the permission identifier combination corresponds to a class name identifier set of a stacked prototype table; the apparatus further comprises:

[0166] a class name set determination module, configured to determine, by using the permission identifier combination, a class name identifier set of a cascading style sheet corresponding to each permission identifier in the permission identifier combination;

[0167] A style sheet matching module, configured to match the class name identifier set to obtain the cascading style sheet corresponding to each class name identifier set;

[0168] The style sheet rendering module is used to render the cascading style sheets corresponding to each of the class name identifier sets respectively to obtain a target page.

[0169] In one embodiment, the page rendering module includes:

[0170] A class name acquisition submodule, configured to acquire the class name identifier of the historical cascading style sheet of the target account if the class name identifier of the cascading style sheet does not match the corresponding cascading style sheet;

[0171] The page rendering submodule is used to render a target page based on the class name identifier of the historical cascading style sheet.

[0172] Each module in the above-mentioned page rendering device can be implemented in whole or in part through software, hardware, or a combination thereof. Each module can be embedded in or independent of the processor of the computer device in hardware form, or can be stored in the memory of the computer device in software form, so that the processor can call and execute the corresponding operations of each module.

[0173] In one embodiment, a computer device is provided. The computer device may be a terminal, and its internal structure diagram may be as follows: Figure 8 As shown. The computer device includes a processor, memory, an input / output interface, a communication interface, a display unit, and an input device. The processor, memory, and input / output interface are connected via a system bus, and the communication interface, display unit, and input device are connected to the system bus via the input / output interface. The processor of the computer device is used to provide computing and control capabilities. The memory of the computer device includes a non-volatile storage medium and internal memory. The non-volatile storage medium stores an operating system and a computer program. The internal memory provides an environment for the operation of the operating system and computer program in the non-volatile storage medium. The input / output interface of the computer device is used to exchange information between the processor and external devices. The communication interface of the computer device is used to communicate with external terminals via wired or wireless means, and the wireless means can be achieved via Wi-Fi, a mobile cellular network, NFC (near-field communication), or other technologies. When executed by the processor, the computer program implements a page rendering method. The display unit of the computer device is used to form a visually visible image and can be a display screen, a projection device, or a virtual reality imaging device. The display screen can be a liquid crystal display screen or an electronic ink display screen, and the input device of the computer device can be a touch layer covering the display screen, or a button, trackball or touchpad set on the computer device casing, or an external keyboard, touchpad or mouse.

[0174] Those skilled in the art will understand that Figure 8 The structure shown in the figure is only a block diagram of a part of the structure related to the solution of the present application, and does not constitute a limitation on the computer device to which the solution of the present application is applied. The specific computer device may include more or fewer components than shown in the figure, or combine certain components, or have a different component arrangement.

[0175] It should be noted that the user information (including but not limited to user device information, user personal information, etc.) and data (including but not limited to data used for analysis, stored data, displayed data, etc.) involved in this application are all information and data authorized by the user or fully authorized by all parties, and the collection, use and processing of relevant data must comply with the relevant laws, regulations and standards of relevant countries and regions.

[0176] Those skilled in the art will appreciate that all or part of the processes in the above-mentioned embodiments can be implemented by instructing the relevant hardware through a computer program. The computer program can be stored in a non-volatile computer-readable storage medium. When the computer program is executed, it can include the processes of the above-mentioned embodiments. In particular, any reference to memory, database, or other media used in the embodiments provided in this application can include at least one of non-volatile and volatile memory. Non-volatile memory can include read-only memory (ROM), magnetic tape, floppy disk, flash memory, optical memory, high-density embedded non-volatile memory, resistive random access memory (ReRAM), magnetic random access memory (MRAM), ferroelectric random access memory (FRAM), phase change memory (PCM), graphene memory, etc. Volatile memory can include random access memory (RAM) or external cache memory, etc. By way of illustration and not limitation, RAM can take various forms, such as static random access memory (SRAM) or dynamic random access memory (DRAM). The databases involved in the various embodiments provided herein may include at least one of a relational database and a non-relational database. Non-relational databases may include, but are not limited to, distributed databases based on blockchains. The processors involved in the various embodiments provided herein may be, but are not limited to, general-purpose processors, central processing units (CPUs), graphics processing units (GPUs), digital signal processors (DSPs), programmable logic devices (PLDs), data processing logic devices based on quantum computing, and the like.

[0177] The technical features of the above embodiments can be combined arbitrarily. To make the description concise, not all possible combinations of the technical features in the above embodiments are described. However, as long as there is no contradiction in the combination of these technical features, they should be considered to be within the scope of this specification.

[0178] The above-described embodiments merely represent several implementation methods of the present application. While the descriptions are relatively specific and detailed, they should not be construed as limiting the scope of the present application. It should be noted that a person of ordinary skill in the art may make various modifications and improvements without departing from the spirit of the present application, and these modifications and improvements fall within the scope of protection of the present application. Therefore, the scope of protection of the present application shall be determined by the appended claims.

Claims

1. A page rendering method, characterized in that: The method comprises: In response to a target account's access request to a target page, obtaining account information of the target account; Determining, based on the account information, a permission identification combination associated with the target account; Using the permission identification combination, determining the class name identification of the cascading style sheet corresponding to each permission identification in the permission identification combination; According to the class name identifier of the cascading style sheet, the cascading style sheet of the target page is matched and obtained; and the target page is rendered based on the cascading style sheet.

2. The method according to claim 1, characterized in that The step of determining, based on the account information, a combination of permission identifiers associated with the target account includes: According to the account information, matching is performed to obtain the role identifier of the target account; Get the permission ID set of the role ID.

3. The method according to claim 2, characterized in that Before obtaining the role identifier of the target account through matching according to the account information, the method further includes: Establish an initial access control model based on role identification; Obtain the association relationship between the permission identifier set and the role set, and the association relationship between the permission identifier set and the class name identifier of the cascading style sheet; The association relationship between the permission identifier set and the role set, and the association relationship between the permission identifier set and the class name identifier of the cascading style sheet are associated with the initial access control model to obtain a target access control model based on the role identifier; wherein the target access control model is used to determine the role identifier of the target account based on the account information of the target account, and match the corresponding permission identifier based on the role identifier, and match the corresponding class name identifier of the cascading style sheet based on the permission identifier of the target account.

4. The method according to claim 3, characterized in that The method further comprises: Determining an initial permission container for the cascading style sheet; wherein the initial permission container is used to determine whether to hide or display the cascading style sheet according to the permission identifier of the target account; The target access control model is associated with the initial permission container to obtain a target permission container.

5. The method according to claim 2, characterized in that The target account is matched with one or more role identifiers; the cascading style sheet of the target page is matched according to the class name identifier of the cascading style sheet; including: In the case where the target account matches a role identifier, the cascading style sheet of the target page is matched according to the class name identifier of the cascading style sheet; When the target account matches multiple role identifiers, determining whether class name identifiers of cascading style sheets corresponding to the respective role identifiers conflict, and if there is a conflict in the class name identifiers of the cascading style sheets, obtaining a priority of the class name identifiers of the respective cascading style sheets; Based on the priorities of the class name identifiers of the cascading style sheets, the class name identifier of the target cascading style sheet is determined; and according to the class name identifier of the target cascading style sheet, the cascading style sheet of the target page is matched and obtained.

6. The method according to claim 1, wherein Each permission identifier in the permission identifier combination corresponds to a class name identifier set of the stacked prototype table; the method further includes: Using the permission identification combination, determining a set of class name identifications of cascading style sheets corresponding to each permission identification in the permission identification combination; According to the class name identification set, matching and obtaining the cascading style sheet corresponding to each class name identification set; The cascading style sheets corresponding to the class name identification sets are rendered respectively to obtain a target page.

7. A page rendering device, characterized in that: The device comprises: An account acquisition module, configured to acquire account information of a target account in response to an interaction request of the target account to the target page; an authority determination module, configured to determine an authority identification combination associated with the target account based on the account information; A class name determination module, configured to determine, by using the permission identifier combination, the class name identifiers of the cascading style sheets corresponding to the respective permission identifiers in the permission identifier combination; The page rendering module is used to match the cascading style sheet of the target page according to the class name identifier of the cascading style sheet; and render the target page based on the cascading style sheet.

8. A computer device comprising a memory and a processor, wherein the memory stores a computer program, wherein: When the processor executes the computer program, the steps of the method according to any one of claims 1 to 6 are implemented.

9. A computer-readable storage medium having a computer program stored thereon, characterized in that: When the computer program is executed by a processor, the steps of the method according to any one of claims 1 to 6 are implemented.

10. A computer program product comprising a computer program, characterized in that When the computer program is executed by a processor, the steps of the method according to any one of claims 1 to 6 are implemented.