Mobile terminal system integration method based on cross-platform style adaptive technology

Abstract

The invention relates to the technical field of system integration processing, in particular to a mobile terminal system integration method based on a cross-platform style adaptive technology. According to the mobile terminal system integration method based on the cross-platform style adaptive technology, an integration party configures an integrated party menu, and a single sign-on page is jumped after verification is passed; loading user information, environment variables and style files on the single sign-on page, and skipping to the integrated page; the integrated party transmits a message to the integration party, and the integration party displays a return button to ensure that the return button can be returned to the main page of the integration system; the integration page of the integration party uses an Iframe framework to integrate the page of the integrated party, and system integration is achieved. According to the mobile terminal system integration method based on the cross-platform style adaptive technology, cross-platform and cross-system dynamic integration can be realized, the same language development technology does not need to be used, the method can adapt to the style of an integration party, the integration safety is ensured through a triple verification mechanism, and the user experience is greatly improved.

Description

Technical Field

[0001] The present invention relates to the technical field of system integration, and in particular to a mobile terminal system integration method based on cross-platform style adaptation technology. Background Art

[0002] Mobile system integration refers to the integration of different mobile systems and menus to achieve more efficient and convenient functions and services.

[0003] Mobile terminal system integration technology is a key task in every enterprise, which can effectively reduce enterprise costs. Existing mobile terminal system integration mainly includes cross-platform development technology, responsive design technology, etc.

[0004] Among them, cross-platform development technology allows developers to use the same set of code base to develop applications for multiple operating systems and devices. This method can greatly reduce development costs, improve development efficiency, and provide a higher user experience. However, this technology has great limitations and requires the use of the same set of code.

[0005] Responsive design technology uses CSS media query, streaming layout and other technologies to allow developers to create application interfaces that can be displayed well on different devices and adapt to different screen resolutions. However, this method requires too high technical requirements from developers and requires the use of CSS responsive layout.

[0006] In view of the deficiencies of the prior art, the present invention proposes a mobile terminal system integration method based on cross-platform style adaptation technology. Summary of the invention

[0007] In order to remedy the defects of the prior art, the present invention provides a simple and efficient mobile terminal system integration method based on cross-platform style adaptation technology.

[0008] The present invention is achieved through the following technical solutions:

[0009] A mobile terminal system integration method based on cross-platform style adaptation technology, characterized in that it includes the following steps:

[0010] Step S1, the integrator configures the menu of the integrated party, jumps to the integration page by clicking the menu of the integrated party, and accesses the integrated system information;

[0011] Step S2: After receiving the request from the integrator, the integrated party performs parameter verification. If the verification passes, the single sign-on page is jumped;

[0012] Step S3: The single sign-on page loads user information, environment variables and style files, and jumps to the integrated page;

[0013] Step S4: determine whether the integrated page is a first-level interface. If it is a first-level interface, do not load the return button, and pass a message to the integrator. The integrator displays the return button to ensure that it can return to the main page of the integrated system.

[0014] Step S5: When the page loading is completed, the integration page of the integrator uses the Iframe framework to integrate the page of the integrated party to achieve system integration.

[0015] In step S1, the integrator configures the menu code (function_id), menu name (function_name), menu icon (function_ico) and menu actual access path (function_url) in the menu of the integrated party;

[0016] When a menu function is clicked, the user is redirected to an integration page provided by the integrator; the integration page encrypts the current user information and accesses the menu of the integrated party according to the encrypted user information and menu path.

[0017] In step S1, the process of the integrated page accessing the integrated system information is as follows:

[0018] Step S1.1, the integration page collects the user ID, systemTime time and preset access key of the current user, and combines the collected information into original user information (userInfo);

[0019] Step S1.2: Use the SM3 encryption algorithm to encrypt the original user information and generate an encrypted token;

[0020] Step S1.3, the integrated page constructs an access path based on the preconfigured proxy identifier ( / ylmtm) and page ID (pageId, i.e., the configuration of function_url in the integrated system), and the access path contains encrypted user information (token) so that the integrated party can verify the identity and authority of the user.

[0021] In step S2, after receiving the request from the integrating party, the integrated party determines whether it is a third-party integration according to the page ID (pageId);

[0022] If the page ID (pageId) is not empty, it is judged as a third-party integration, and the token (token) is decrypted using the SM3Decode method to obtain the user information (userInfo);

[0023] User verification is divided into three levels:

[0024] (1) First, verify whether the key is correct based on the key value of the original user information (userInfo). If the key value is incorrect, an error message is returned;

[0025] (2) Then, the systemTime in the original user information (userInfo) is subtracted from the current time. If the difference is greater than 60 minutes, the token information is considered invalid and an error message is returned.

[0026] (3) Finally, determine whether the user ID in the original user information (userInfo) exists in the integrated system:

[0027] If it exists, the verification is successful and the single sign-on page is jumped;

[0028] If it does not exist, the verification fails and the user verification failure information is returned to the inheritance page of the integrating party.

[0029] In step S3, when the user verification is successful, the integrated party sets the page ID (pageId) as a global variable, obtains user information on the single sign-on page, loads the environment variables and the style file configured by the integrator, and then jumps to the menu page of the integrated party.

[0030] In step S3, the integrated system queries and obtains detailed information of the user according to the user ID, including the user name, company, department and user authority;

[0031] The integrated party's system loads the style file configured by the integrator. The style file is a global style file, which is used to ensure that the theme style (including border style, button style, theme color, icon style, etc.) of the integrated party is consistent with the style of the integrator;

[0032] In order to ensure page access speed, use asynchronous method when loading style files;

[0033] In order to prevent the failure of style file loading due to network delay, a compensation mechanism is provided when loading style files: if the file loading fails, the compensation mechanism is triggered, and the compensation mechanism reloads the style file after a custom time; if the loading fails after five attempts, an error message is returned;

[0034] After the user information is completely acquired and the style file is loaded successfully (whether it is loaded for the first time or through the compensation mechanism), the integrated party's system redirects the user to the integrated party's designated menu function page based on the previously set global variable pageId.

[0035] In step S4, the integrated party determines whether the currently loaded page is a first-level interface:

[0036] If the integrated page is a first-level interface, the back button will not be loaded. The integrated party will send a message to the integrating party through a specific communication mechanism to notify the integrating party to display the back button on the current page to ensure that when the user clicks the back button, they can return to the main page of the integrated system instead of the main page of the integrated party;

[0037] The communication mechanism is encapsulated as a public function named changeBackButton(hasBackButton:boolean); when the integrated page is a first-level interface, the hasBackButton parameter is set to false, and this function is called to notify the integrator not to display the back button;

[0038] If the integrated page is a secondary interface, the integrated party displays a back button so that the user can easily return to the previous interface (i.e., the primary interface); the integrated party calls the changeBackButton function, sets the hasBackButton parameter to true, and notifies the integrator to display the back button on the current page.

[0039] A mobile terminal system integration device based on cross-platform style adaptation technology is characterized by: comprising a memory and a processor; the memory is used to store a computer program, and the processor is used to implement the method steps described above when executing the computer program.

[0040] A readable storage medium, characterized in that: a computer program is stored on the readable storage medium, and when the computer program is executed by a processor, the method steps described above are implemented.

[0041] The beneficial effects of the present invention are: the mobile terminal system integration method based on cross-platform style adaptation technology can not only realize dynamic integration across platforms and systems, but also does not require the use of the same language development technology. It can adaptively integrate party styles and ensure the security of integration through a triple verification mechanism, greatly improving the user experience. BRIEF DESCRIPTION OF THE DRAWINGS

[0042] In order to more clearly illustrate the embodiments of the present invention or the technical solutions in the prior art, the drawings required for use in the embodiments or the description of the prior art will be briefly introduced below. Obviously, the drawings described below are some embodiments of the present invention. For ordinary technicians in this field, other drawings can be obtained based on these drawings without paying creative work.

[0043] Attached Figure 1 It is a schematic diagram of the mobile terminal system integration method based on the cross-platform style adaptation technology of the present invention.

[0044] Attached Figure 2Schematic diagram of the compensation mechanism of the present invention.

[0045] Attached Figure 3 It is a schematic diagram of the interface collaboration method between the integrator and the integrated party of the present invention. DETAILED DESCRIPTION

[0046] In order to enable those skilled in the art to better understand the technical solutions in the present invention, the technical solutions in the embodiments of the present invention will be clearly and completely described below in conjunction with the embodiments of the present invention. Obviously, the described embodiments are only a part of the embodiments of the present invention, not all of the embodiments. Based on the embodiments of the present invention, all other embodiments obtained by ordinary technicians in this field without creative work should fall within the scope of protection of the present invention.

[0047] The mobile terminal system integration method based on the cross-platform style adaptation technology includes the following steps:

[0048] Step S1, the integrator configures the menu of the integrated party, jumps to the integration page by clicking the menu of the integrated party, and accesses the integrated system information;

[0049] Step S2: After receiving the request from the integrator, the integrated party performs parameter verification. If the verification passes, the single sign-on page is jumped;

[0050] Step S3: The single sign-on page loads user information, environment variables and style files, and jumps to the integrated page;

[0051] Step S4: determine whether the integrated page is a first-level interface. If it is a first-level interface, do not load the return button, and pass a message to the integrator. The integrator displays the return button to ensure that it can return to the main page of the integrated system.

[0052] Step S5: When the page loading is completed, the integration page of the integrator uses the Iffame framework to integrate the page of the integrated party to achieve system integration.

[0053] In step S1, the integrator configures the menu code (function_id), menu name (function_name), menu icon (function_ico) and menu actual access path (function_url) in the menu of the integrated party;

[0054] When a menu function is clicked, the user is redirected to an integration page provided by the integrator; the integration page encrypts the current user information and accesses the menu of the integrated party according to the encrypted user information and menu path.

[0055] On the integration page, the system will perform a series of operations to ensure that users can safely access the menu of the integrated party.

[0056] In step S1, the process of the integrated page accessing the integrated system information is as follows:

[0057] Step S1.1, the integration page collects the user ID, systemTime time and preset access key of the current user, and combines the collected information into original user information (userInfo);

[0058] Step S1.2: Use the SM3 encryption algorithm to encrypt the original user information and generate an encrypted token;

[0059] Step S1.3, the integrated page constructs an access path based on the preconfigured proxy identifier ( / ylmtm) and page ID (pageId, i.e., the configuration of function_url in the integrated system), and the access path contains encrypted user information (token) so that the integrated party can verify the identity and authority of the user.

[0060] The formula for user information composition and access path is as follows;

[0061] userInfo=getUserId+&+systemTime+&+key

[0062] url= / ylmtm / ? pageId=getFunctionUrl(functionurl)+&token=sm3Encode(userInfo)

[0063] Among them, userInfo is composed of the current system user id, systemTime time and access key; / ylmtm is the proxy identifier, and the proxy path is configured according to this identifier; pageId is function_url, which is configured in the integrated system; token is the encrypted user information.

[0064] In step S2, after receiving the request from the integrating party, the integrated party determines whether it is a third-party integration according to the page ID (pageId);

[0065] If the page ID (pageId) is not empty, it is judged as a third-party integration, and the token (token) is decrypted using the SM3Decode method to obtain the user information (userInfo);

[0066] User verification is divided into three levels:

[0067] (1) First, verify whether the key is correct based on the key value of the original user information (userInfo). If the key value is incorrect, an error message is returned;

[0068] (2) Then, the systemTime in the original user information (userInfo) is subtracted from the current time. If the difference is greater than 60 minutes, the token information is considered invalid and an error message is returned.

[0069] (3) Finally, determine whether the user ID in the original user information (userInfo) exists in the integrated system:

[0070] If it exists, the verification is successful and the single sign-on page is jumped;

[0071] If it does not exist, the verification fails and the user verification failure information is returned to the inheritance page of the integrating party.

[0072] When the user successfully passes the verification, the integrated party will perform a series of operations to ensure that the user can successfully access the required functions.

[0073] In step S3, when the user verification is successful, the integrated party sets the page ID (pageId) as a global variable, obtains user information on the single sign-on page, loads the environment variables and the style file configured by the integrator, and then jumps to the menu page of the integrated party.

[0074] In step S3, the integrated system queries and obtains detailed information of the user according to the user ID, including the user name, company, department and user authority;

[0075] To ensure that the page can run correctly, a series of environment variables are loaded on the single sign-on page, including necessary configuration information or parameters;

[0076] The integrated party's system loads the style file configured by the integrator. The style file is a global style file, which is used to ensure that the theme style (including border style, button style, theme color, icon style, etc.) of the integrated party is consistent with the style of the integrator. Since the style file may be large, in order to ensure the page access speed, the style file is loaded asynchronously;

[0077] At the same time, in order to prevent network delays from causing style file loading failures, a compensation mechanism is introduced when loading style files: if the file fails to load, the compensation mechanism is triggered, and the compensation mechanism reloads the style file after a custom time; if the file is still not loaded successfully after five attempts, an error message is returned. The compensation mechanism is designed to improve the usability and user experience of the page.

[0078] After the user information is completely acquired and the style file is loaded successfully (whether it is loaded for the first time or through the compensation mechanism), the integrated party's system redirects the user to the integrated party's designated menu function page based on the previously set global variable pageId.

[0079] When the user successfully jumps to the integrated party's page, the integrated party will perform corresponding processing based on the level of the current page.

[0080] In step S4, the integrated party determines whether the currently loaded page is a first-level interface:

[0081] If the integrated page is a first-level interface, the back button will not be loaded, because the user is currently on the top-level page of the integrated party and does not need to return. Instead, the integrated party sends a message to the integrator through a specific communication mechanism (such as using the window.parent.postMessage method) to notify the integrator to display the back button on the current page to ensure that when the user clicks the back button, they can return to the main page of the integrated system instead of the main page of the integrated party;

[0082] The communication mechanism is encapsulated as a public function named changeBackButton(hasBackButton:boolean); when the integrated page is a first-level interface, the hasBackButton parameter is set to false, and this function is called to notify the integrator not to display the back button;

[0083] If the integrated page is a secondary interface, the integrated party will display a back button so that the user can easily return to the previous interface (i.e., the primary interface); in this case, the integrated party will also call the changeBackButton function, set the hasBackButton parameter to true, and notify the integrator to display the back button on the current page. In this way, the integrator and the integrated party can work together efficiently to ensure that users can navigate smoothly between different pages, while maintaining the consistency of the interface and the continuity of the user experience.

[0084] The mobile terminal system integration device based on the cross-platform style adaptation technology includes a memory and a processor; the memory is used to store a computer program, and the processor is used to implement the method steps described above when executing the computer program.

[0085] The readable storage medium stores a computer program, and when the computer program is executed by a processor, the method steps described above are implemented.

[0086] The mobile terminal system integration method based on cross-platform style adaptation technology uses the Iframe architecture and can realize the integration of any platform and operating system through URL integration, and is not affected by the development language; and the security of the integration is guaranteed by a triple verification mechanism; at the same time, by loading a custom style file, the style of the integrated system can be made the same as the integrating party's style, realizing the integration of any theme and any resolution.

[0087] The embodiment described above is only one specific implementation of the present invention. Common changes and substitutions made by those skilled in the art within the scope of the technical solution of the present invention should be included in the protection scope of the present invention.

Claims

1. A mobile terminal system integration method based on cross-platform style adaptation technology, characterized by: The following steps are involved: Step S1, the integrator configures the menu of the integrated party, jumps to the integration page by clicking the menu of the integrated party, and accesses the integrated system information; Step S2: After receiving the request from the integrator, the integrated party performs parameter verification. If the verification passes, the single sign-on page is jumped; Step S3: The single sign-on page loads user information, environment variables and style files, and jumps to the integrated page; Step S4: determine whether the integrated page is a first-level interface. If it is a first-level interface, do not load the return button, and pass a message to the integrator. The integrator displays the return button to ensure that it can return to the main page of the integrated system. Step S5: When the page loading is completed, the integration page of the integrator uses the Iframe framework to integrate the page of the integrated party to achieve system integration.

2. The mobile terminal system integration method based on cross-platform style adaptation technology according to claim 1 is characterized in that: In step S1, the integrator configures the menu code, menu name, menu icon and actual menu access path in the menu of the integrated party; When a menu function is clicked, the user is redirected to an integration page provided by the integrator; the integration page encrypts the current user information and accesses the menu of the integrated party according to the encrypted user information and menu path.

3. The mobile terminal system integration method based on cross-platform style adaptation technology according to claim 2 is characterized in that: In step S1, the process of the integrated page accessing the integrated system information is as follows: Step S1.1, the integration page collects the user ID, systemTime time and preset access key of the current user, and combines the collected information into the original user information; Step S1.2: Use the SM3 encryption algorithm to encrypt the original user information and generate an encrypted token; Step S1.3: The integrated page constructs an access path according to the pre-configured proxy identifier and page ID. The access path contains encrypted user information so that the integrated party can verify the identity and authority of the user.

4. The mobile terminal system integration method based on cross-platform style adaptation technology according to claim 3 is characterized in that: In step S2, after receiving the request from the integrating party, the integrated party determines whether it is a third-party integration according to the page ID; If the page ID is not empty, it is judged as a third-party integration, and the token is decrypted using the SM3Decode method to obtain the original user information; User verification is divided into three levels: First, verify whether the key is correct based on the key value of the original user information. If the key value is incorrect, an error message is returned; Then, the systemTime in the original user information is subtracted from the current time. If the difference is greater than 60 minutes, the token information is considered invalid and an error message is returned. Finally, determine whether the user ID in the original user information exists in the integrated system: If it exists, the verification is successful and the single sign-on page is jumped; If it does not exist, the verification fails and the user verification failure information is returned to the inheritance page of the integrating party.

5. The mobile terminal system integration method based on cross-platform style adaptation technology according to claim 4 is characterized in that: In step S3, when the user verification is successful, the integrated party sets the page ID as the global variable pageId, obtains user information on the single sign-on page, loads the environment variables and the style file configured by the integrator, and then jumps to the menu page of the integrated party.

6. The mobile terminal system integration method based on cross-platform style adaptation technology according to claim 5 is characterized in that: In step S3, the integrated system queries and obtains detailed information of the user according to the user ID, including the user name, company, department and user authority; The integrated party's system loads the style file configured by the integrator. The style file is a global style file, which is used to ensure that the theme style of the integrated party is consistent with the style of the integrator; In order to ensure page access speed, use asynchronous method when loading style files; In order to prevent the failure of style file loading due to network delay, a compensation mechanism is provided when loading style files: if the file loading fails, the compensation mechanism is triggered, and the compensation mechanism reloads the style file after a custom time. If loading fails after five attempts, an error message will be returned; After the user information is completely obtained and the style file is loaded successfully, the integrated party's system redirects the user to the integrated party's designated menu function page based on the previously set global variable pageId.

7. The mobile terminal system integration method based on cross-platform style adaptation technology according to claim 1 is characterized by: In step S4, the integrated party determines whether the currently loaded page is a first-level interface: If the integrated page is a first-level interface, the back button will not be loaded. The integrated party will send a message to the integrating party to notify the integrating party to display the back button on the current page to ensure that when the user clicks the back button, they can return to the main page of the integrated system instead of the main page of the integrated party; If the integrated page is a secondary interface, the integrated party will display a return button so that the user can easily return to the primary interface.

8. The mobile terminal system integration method based on cross-platform style adaptation technology according to claim 7 is characterized in that: In step S4, the integrated party sends a message to the integrating party through a communication mechanism, and the communication mechanism is encapsulated as a public function named changeBackButton(hasBackButton:boolean); When the integrated page is a first-level interface, set the hasBackButton parameter to false and call this function to notify the integrator not to display the back button; When the integrated page is a secondary interface, the integrated party calls the changeBackButton function and sets the hasBackButton parameter to true to notify the integrating party to display the back button on the current page.

9. A mobile terminal system integration device based on cross-platform style adaptation technology, characterized in that: The method comprises a memory and a processor; the memory is used to store a computer program, and the processor is used to implement the method according to any one of claims 1 to 8 when executing the computer program.

10. A readable storage medium, characterized in that: The readable storage medium stores a computer program, and when the computer program is executed by a processor, the method according to any one of claims 1 to 8 is implemented.

Images