A page display method and device, electronic equipment and storage medium

Abstract

Embodiments of the present application provide a page display method and device, electronic equipment and storage medium, and relate to the technical field of computer. The method comprises: in response to receiving a loading instruction of an H5 page, calling a first calling method in a preset adapter to access a first Native interface of a Native end to obtain identity information of a target user; based on the identity information of the target user, calling a second calling method in the adapter to access a second Native interface of the Native end to obtain subscription information of the target user for a target product; after obtaining the subscription information, based on the identification information of the target product, calling a third calling method in the adapter to access a third Native interface of the Native end to obtain target product information of the target product; and based on the identity information of the target user, the subscription information and the target product information of the target product, rendering the H5 page to display the H5 page for the target product. By applying the present application, the workload of the developer is reduced while displaying the product in the H5 page.

Description

TECHNICAL FIELD

[0001] The present application relates to the technical field of computer, in particular to a page display method and device, electronic equipment and storage medium. BACKGROUND

[0002] In the era of knowledge payment, timely information, professional advice and other content can be sold to users as products. A client can display product information purchased by a user. For example, a securities client can display investment advisor type products to provide accurate market information and professional investment advice for users.

[0003] In the related art, the release interval of a client is long. In order to timely adjust the products that can be displayed by the client, a developer constructs a client combining an H5 page and a native application based on a hybrid development model of Native and H5 (HTML5, the fifth generation of HyperText Markup Language). The native application is used to obtain product information about a product to be displayed through a Native interface. The H5 page is used to display the product based on the obtained product information. In addition, the H5 page needs to be adapted to the Native interface to realize the interaction between the H5 page and the native application. For example, the H5 page is adapted to the Native interface in advance to determine the way of calling the Native interface. In the product display process, the H5 page calls the Native interface by using the way determined by the adaptation to obtain product information to display the product to the user.

[0004] However, the H5 pages of different products are quite different. In order to display different products, the H5 page needs to be adapted to different Native interfaces in advance. If the native application changes, the H5 page needs to be adapted to each Native interface one by one, thereby bringing a great workload to the developer. SUMMARY

[0005] The purpose of the embodiments of the present application is to provide a page display method and device, electronic equipment and storage medium to reduce the workload of the developer while displaying products on the H5 page. The specific technical solutions are as follows:

[0006] In a first aspect, the embodiments of the present application provide a page display method, which comprises:

[0007] In response to receiving the loading instruction of the H5 page of the target product issued by the target user, based on the identity of the target user, a first calling method in a preset adapter is called to access a first Native interface of the Native end to obtain the identity information of the target user; the adapter is a module pre-encapsulated with a plurality of calling methods, different calling methods are used to call different Native interfaces of the Native end, and each Native interface is used to obtain one kind of information content; the first Native interface is an interface used to obtain the identity information of the target user; and the first calling method is a calling method used to call the first Native interface.

[0008] After obtaining the identity information of the target user, based on the identity information of the target user, a second calling method in the adapter is called to access a second Native interface of the Native end to obtain the subscription information of the target user; the second Native interface is an interface used to obtain the subscription information of the target user; and the second calling method is a calling method used to call the second Native interface.

[0009] After obtaining the subscription information, based on the identification information of the target product, a third calling method in the adapter is called to access a third Native interface of the Native end to obtain the target product information of the target product; the third Native interface is an interface used to obtain the target product information of any product; and the third calling method is a calling method used to call the third Native interface.

[0010] Based on the obtained identity information, subscription information and target product information of the target product of the target user, H5 page rendering is performed to display the H5 page of the target product.

[0011] Optionally, each calling method encapsulated by the adapter is a method set based on an operating system of an electronic device on which the Native end is deployed.

[0012] Optionally, the method further comprises:

[0013] If the subscription information is not obtained, based on the obtained identity information of the target user and prompt content used to represent that the target user has not subscribed to the target product, H5 page rendering is performed to display the H5 page of the target product.

[0014] Optionally, the target product information of the target product is product detail information of the target product.

[0015] Before the calling the third calling method in the adapter based on the identification information of the target product to access the third Native interface of the Native end to obtain the target product information of the target product, the method further comprises:

[0016] Based on the identification information of the target product, a fourth calling method in the adapter is called to access a fourth Native interface of the Native end to obtain preset product basic information of the target product; wherein the fourth Native interface is an interface for obtaining preset product basic information of any product; and the fourth calling method is a calling method for calling the fourth Native interface.

[0017] The calling the third calling method in the adapter based on the identification information of the target product to access the third Native interface of the Native end to obtain the target product information of the target product comprises:

[0018] Based on the identification information of the target product and the preset product basic information of the target product, the third calling method in the adapter is called to access the third Native interface of the Native end to obtain the target product information of the target product.

[0019] Optionally, the adapter is an adapter constructed according to a software development kit (SDK) for JavaScript.

[0020] In a second aspect, an embodiment of the present application provides a page display device, and the device comprises:

[0021] The first calling module is configured to, in response to receiving a loading instruction for an H5 page of a target product issued by a target user, call a first calling method in a preset adapter based on an identity of the target user to access a first Native interface of the Native end to obtain identity information of the target user; wherein the adapter is a module pre-encapsulated with a plurality of calling methods, different calling methods are used to call different Native interfaces of the Native end, and each Native interface is used to obtain a type of information content; the first Native interface is an interface used to obtain the identity information of the target user; and the first calling method is a calling method used to call the first Native interface.

[0022] The second calling module is configured to, after obtaining the identity information of the target user, call a second calling method in the adapter based on the identity information of the target user to access a second Native interface of the Native end to obtain subscription information of the target user, wherein the second Native interface is an interface for obtaining the subscription information of the target user, and the second calling method is a calling method for calling the second Native interface.

[0023] The third calling module is configured to, after obtaining the subscription information, call a third calling method in the adapter based on the identification information of the target product to access a third Native interface of the Native end to obtain target product information of the target product, wherein the third Native interface is an interface for obtaining target product information of any product, and the third calling method is a calling method for calling the third Native interface.

[0024] The first rendering module is configured to perform H5 page rendering based on the obtained identity information, subscription information and target product information of the target product of the target user to display an H5 page for the target product.

[0025] Optionally, each calling method encapsulated by the adapter is a method set based on an operating system of an electronic device in which the Native end is deployed.

[0026] Optionally, the apparatus further comprises:

[0027] The second rendering module is configured to, if the subscription information is not obtained, perform H5 page rendering based on the obtained identity information of the target user and prompt content for indicating that the target user has not subscribed to the target product to display an H5 page for the target product.

[0028] The embodiment of the application further provides an electronic device, including a processor, a communication interface, a memory and a communication bus, wherein the processor, the communication interface and the memory complete mutual communication through the communication bus.

[0029] The memory is configured to store a computer program.

[0030] The processor is configured to execute the program stored on the memory to implement the page display method.

[0031] The embodiment of the application further provides a computer readable storage medium, the computer readable storage medium stores a computer program, and the computer program is executed by a processor to implement the page display method.

[0032] The embodiment of the application has the following beneficial effects:

[0033] The page display method, device, electronic equipment and storage medium provided by the embodiment of the present application can call a first calling method in a preset adapter based on the identity of the target user to access a first Native interface of the Native end to obtain the identity information of the target user; after obtaining the identity information of the target user, a second calling method in the adapter is called based on the identity information of the target user to access a second Native interface of the Native end to obtain the subscription information of the target product by the target user; after obtaining the subscription information, a third calling method in the adapter is called based on the identity information of the target product to access a third Native interface of the Native end to obtain the target product information of the target product; and based on the obtained identity information of the target user, subscription information and target product information of the target product, H5 page rendering is performed to display the H5 page of the target product. In the present scheme, the adapter pre-encapsulates various methods for accessing the Native interface, and the calling method encapsulated in the adapter is called to access the Native interface to obtain the target product information, so as to display the target product on the H5 page, avoid direct interaction between the H5 page and the Native end, and only need to adjust the adapter if the Native end is changed, without the need to adapt the interaction between the H5 page and each Native interface of the Native end one by one, thereby reducing the workload of the developer.

[0034] Of course, implementing any product or method of the present application does not necessarily require achieving all the advantages described above at the same time. BRIEF DESCRIPTION OF DRAWINGS

[0035] In order to more clearly illustrate the technical solutions in the embodiments of the present application or the prior art, the following will briefly introduce the drawings needed to be used in the embodiments or prior art description. Obviously, the drawings in the following description only constitute some embodiments of the present application, and other embodiments can also be obtained by those skilled in the art based on these drawings.

[0036] Fig. 1(a), (b) is a schematic diagram of the principle of interaction between H5 page and different operating systems and Native native application;

[0037] Figure 2 The flowchart of the page display method provided by the embodiment of the present application is shown in the figure;

[0038] Figure 3 The flowchart of another page display method provided by the embodiment of the present application is shown in the figure;

[0039] Figure 4 The principle diagram of the page display method provided by the embodiment of the present application is shown in the figure;

[0040] Figure 5 A flowchart for acquiring identity information of a user provided for an embodiment of the present application is shown in FIG. 1(a).

[0041] Figure 6 A flowchart for acquiring subscription information of a user provided for an embodiment of the present application is shown in FIG. 1(b).

[0042] Figure 7 A flowchart for acquiring product information of a product provided for an embodiment of the present application is shown in FIG. 2(a).

[0043] Figure 8 A structural diagram of a page display device provided for an embodiment of the present application is shown in FIG. 3(a).

[0044] Figure 9 A structural diagram of an electronic device provided for an embodiment of the present application is shown in FIG. 4(a). DETAILED DESCRIPTION

[0045] The technical solutions in the embodiments of the present application will be described clearly and completely below with reference to the drawings in the embodiments of the present application. Obviously, the described embodiments are only some of the embodiments of the present application, but not all the embodiments of the present application. Based on the embodiments in the present application, all other embodiments obtained by those of ordinary skill in the art based on the present application are within the scope of the present application.

[0046] In order to better understand the embodiments of the present application, the prior art will be introduced below with reference to FIGS. 1(a) and (b).

[0047] In the related art, the time interval for releasing a client is long, and a developer adopts a hybrid development mode combining Native and H5 to build a client combining an H5 page and a Native native application, that is, to build a client combining an H5 page and a Native end. Among them, the H5 page and the Native end are pre-adapted, the H5 page can interact with the Native end according to the calling mode determined by the adaptation processing, acquire product information and further render and process to display the product on the H5 page, and realize the rapid offline release of the web end of multiple products based on the H5 page. For the securities industry, the product can be the product of intelligent investment, such as short line treasure, etc. The user who purchases such a product can view the information provided by the product on the client, and the information provided by different products is not the same, for example, short line treasure can provide the rise of 5 stocks within 3 days.

[0048] As shown in FIG. 1(a), the operating system of the Native end is IOS (Iphone Operation System), the way of interaction between the H5 page and the Native end of IOS can be pre-configured, in the process of loading the H5 page 1 of product 1, the H5 page 1 can interact with the Native application to obtain user information such as user's fund account information and mobile phone information, obtain the user's subscription state and order state of product 1, and obtain product information such as product list and product details of product 1, based on the obtained information, product 1 is displayed on the H5 page 1. Similarly, the H5 page 2 is used to display product 2, and the process of loading the H5 page 2 of product 2 is similar to the process of loading the H5 page 1, which will not be described in detail here. Similarly, FIG. 1(b) is similar to the interaction principle diagram between the H5 page and the Native end shown in FIG. 1(a), the difference is that the Native end of FIG. 1(b) is an Android operating system, the way of interaction between the H5 page and the Native end of the Android operating system can be pre-configured, then the H5 page and the Native end are interacted, product information is obtained to display the product on the H5 page, the specific process is similar to the description of FIG. 1(a) above, which will not be described in detail here.

[0049] However, products are various, and the H5 pages of different products are quite different. In order to display different products, the H5 page needs to be pre-adapted to different Native interfaces, that is, the H5 pages of different products need to be independently adapted to the Native application, which brings a lot of work to the developer; and if the Native application changes, the H5 page needs to be re-adapted to each Native interface, which brings a lot of work to the developer.

[0050] In addition, in the process of adapting the H5 page to different Native interfaces, the operating system of the Native application also needs to be adapted, for example, the same H5 page needs to be adapted to the Native application of two different operating systems of IOS and Android, which further brings more work to the developer.

[0051] In order to realize product display on the H5 page while reducing the workload of the developer, the embodiment provides a page display method, device, electronic equipment and storage medium.

[0052] First, a page display method provided by the embodiment of the application is introduced.

[0053] Among them, the page display method provided by the embodiment of the application can be applied to an electronic device, which can be loaded with: a hybrid development model based on H5 and Native, a client constructed by combining an H5 page and a Native native application; the actual execution process of the page display method can be the process of running the code of the H5 page loaded in the client of the electronic device, and according to the code function division, the client can include: an H5 page, a Native end and an adapter, in the embodiment of the application, the Native end is a Native native application, for convenience of description, it is collectively referred to as a Native end. In specific application, the electronic device can be a smart phone, a tablet computer and the like, which are all reasonable.

[0054] The page display method provided by the embodiment of the application can include:

[0055] In response to receiving a loading instruction for the H5 page of the target product issued by the target user, based on the identity of the target user, a first calling method in the preset adapter is called to access a first Native interface of the Native end to obtain the identity information of the target user; wherein the adapter is a module pre-encapsulated with a plurality of calling methods, different calling methods are used to call different Native interfaces of the Native end, and each Native interface is used to obtain a kind of information content; the first Native interface is an interface used to obtain the identity information of the target user; the first calling method is a calling method used to call the first Native interface;

[0056] After obtaining the identity information of the target user, based on the identity information of the target user, a second calling method in the adapter is called to access a second Native interface of the Native end to obtain the subscription information of the target user; wherein the second Native interface is an interface used to obtain the subscription information of the target user; the second calling method is a calling method used to call the second Native interface;

[0057] After obtaining the subscription information, based on the identification information of the target product, a third calling method in the adapter is called to access a third Native interface of the Native end to obtain the target product information of the target product; wherein the third Native interface is an interface used to obtain the target product information of any product; the third calling method is a calling method used to call the third Native interface;

[0058] Based on the obtained identity information, subscription information of the target user and target product information of the target product, the H5 page is rendered to display the H5 page for the target product.

[0059] The page display method, device, electronic equipment and storage medium provided by the embodiments of the present application can call a first calling method in a preset adapter based on the identity of the target user to access a first Native interface of the Native end to obtain the identity information of the target user. After obtaining the identity information of the target user, the second calling method in the adapter is called based on the identity information of the target user to access a second Native interface of the Native end to obtain the subscription information of the target product by the target user. After obtaining the subscription information, the third calling method in the adapter is called based on the identity information of the target product to access a third Native interface of the Native end to obtain the target product information of the target product. Based on the obtained identity information of the target user, subscription information and target product information of the target product, the H5 page is rendered to display the H5 page for the target product. In the present scheme, the adapter pre-encapsulates various methods for accessing the Native interface. By calling the calling method encapsulated in the adapter, the Native interface is accessed to obtain the target product information, etc. to display the target product on the H5 page. The direct interaction between the H5 page and the Native end is avoided. If the Native end is changed, the adapter only needs to be adjusted, and it is not necessary to adapt one by one to the interaction between the H5 page and each Native interface of the Native end, thereby reducing the workload of the developer.

[0060] The page display method provided by the embodiments of the present application will be described below with reference to the accompanying drawings.

[0061] Figure 2 The flowchart of the page display method provided by the embodiments of the present application is shown in Figure 2 The method can include steps S201-S204.

[0062] S201, in response to receiving the loading instruction of the H5 page for the target product issued by the target user, calling the first calling method in the preset adapter based on the identity of the target user to access the first Native interface of the Native end to obtain the identity information of the target user.

[0063] The adapter is a module pre-encapsulating a plurality of calling methods. Different calling methods are used to call different Native interfaces of the Native end. Each Native interface is used to obtain a kind of information content. The first Native interface is an interface used to obtain the identity information of the target user. The first calling method is a calling method used to call the first Native interface.

[0064] It can be understood that when the target user selects the target product in the client to open the H5 page of the target product, the client can receive a loading instruction for the H5 page of the target product, and then can call the first calling method in the adapter in response to receiving the loading instruction, thereby accessing the first Native interface of the Native end to obtain the identity information of the target user. It can be understood that, for example, when the target product needs to be displayed on the H5 page, in order to obtain the identity information of the target user, the H5 page can call the getUserInfo function, and the adapter can be called in response to the H5 page calling the getUserInfo function; since the first calling method is a calling method for calling the first Native interface, and the first Native interface is an interface for obtaining the identity information of the target user, when the first calling method in the adapter is called, the first Native interface can be accessed to obtain the identity information corresponding to the identity of the target user, that is, the identity information of the target user; wherein, if the operating system is an Android system, the calling function defined by the first calling method encapsulated by the adapter can be a window.KDS_Native.getUserInfo function; if the operating system is an IOS system, the calling function defined by the first calling method encapsulated by the adapter can be a window.webkit.messageHandlers.getUserInfo function.

[0065] It should be noted that the adapter can be designed and defined by the developer in advance for different Native interfaces of the Native end. The specific design process can include: classifying each Native interface according to the type of information it provides, for example, each Native interface can be classified into an interface for obtaining user login information, an interface for obtaining user subscription information, and an interface for obtaining product information; then, according to the classification of the Native interface, define the aggregation interface of the H5 page calling the adapter, and the calling method of the related Native interface, and encapsulate the defined multiple calling methods into the adapter, wherein different calling methods can be used to call different Native interfaces, and each Native interface is used to obtain a type of information content. For example, the first calling method can be a js sdk getUserInfo method.

[0066] It should be noted that the H5 page can call the function of obtaining information in response to the loading instruction and pass in parameters, and the passed-in parameters can be different processing methods for information. For example, the H5 page can call the getUserInfo function and pass in the login type field for non-forced login. In response to the function called by the H5 page, the adapter can directly access the first Native interface to obtain the identity information of the target user without forcing the user to log in.

[0067] It can be understood that the identity information of the target user can be used as a parameter required by the first calling method, or as a parameter returned after accessing the first Native interface. The adapter can return the identity information of the target user to the H5 page in the form of a parameter.

[0068] Optionally, in an implementation manner, the adapter is an adapter constructed according to a software development kit (SDK) for JavaScript.

[0069] It can be understood that the developer can construct the adapter for adapting the H5 page of the client to the Native end according to the software development kit (SDK) for JavaScript in advance. It should be noted that the software development kit (SDK) for JavaScript can also be referred to as js sdk in the embodiment of the application. In the scheme, the adapter can be conveniently and quickly developed based on the js sdk, and the workload of the developer is reduced.

[0070] Optionally, in another implementation manner, each calling method encapsulated by the adapter is a method set based on an operating system of an electronic device on which the Native end is deployed.

[0071] It can be understood that when setting the calling method encapsulated by the adapter, the developer can define the calling function according to the operating system of the electronic device on which the client is deployed. For example, when defining the calling method of the Native interface for obtaining user information, the calling function can be window.webkit.messageHandlers.getUserInfo for IOS, and the calling function can be window.KDS_Native.getUserInfo for the Android system. Since the calling method in the adapter in the scheme can call the interface according to the operating system, one set of adapter can realize the interaction between the H5 page and the Native end of different operating systems, and the adaptability is stronger.

[0072] S202, after obtaining the identity information of the target user, a second calling method in the adapter is called based on the identity information of the target user to access a second Native interface of the Native end to obtain subscription information of the target user.

[0073] The second Native interface is an interface for obtaining the subscription information of the target user, and the second calling method is a calling method for calling the second Native interface.

[0074] It can be understood that after obtaining the identity information of the target user through the first Native interface, the second calling method of the adapter can be called based on the identity information of the target user. Since the second calling method is a calling method for calling the second Native interface, and the second Native interface is an interface for obtaining the subscription information of the target user, when the second calling method in the adapter is called, the second Native interface can be accessed to obtain the subscription information of the target user. For example, the second calling method can be a js sdk getUserSignInfo method.

[0075] When it is necessary to display a target product on an H5 page, the H5 page can also obtain the subscription information of the target user to determine whether the target user has purchased the target product. Only the target user who has purchased the target product can view the target product on the H5 page. It can be understood that, for example, the H5 page can call the getUserSignInfo function, and the adapter can be called in response to the H5 page calling the getUserSignInfo function. After the adapter accesses the second Native interface by using the second calling method to obtain the subscription information, the obtained subscription information can be uniformly processed, such as being encapsulated as subscription information returned to the H5 page, and then the encapsulated subscription information is returned to the H5 page. If the operating system is an Android system, the function defined by the second calling method encapsulated by the adapter can be a window.KDS_Native.getUserProductSignInfo function. If the operating system is IOS, the function defined by the second calling method encapsulated by the adapter can be window.webkit.messageHandlers.getUserProductSignInfo. The subscription information of the target user can include a target user subscription state and subscription order details, and is used to represent that the target user has subscribed. The adapter can obtain the subscription state and subscription order details of the target user through the second Native interface, and then the adapter returns the obtained subscription state and subscription order details to the H5 page.

[0076] It can be understood that the subscription information of the target user can be used as a parameter required to be obtained by the second calling method, or can be used as a parameter returned after accessing the second Native interface. The adapter can return the subscription information of the target user to the H5 page in the form of a parameter.

[0077] Optionally, in an implementation manner, the page display method can further include step a: if the subscription information is not obtained, performing H5 page rendering based on the obtained identity information of the target user and prompt content for indicating that the target user has not subscribed to the target product, to display the H5 page for the target product.

[0078] It can be understood that since the subscription information is used to indicate that the target user has subscribed, if the subscription information is not obtained, it indicates that the target user has not subscribed. Therefore, the client can perform H5 page rendering based on the identity information of the target user obtained in the foregoing steps and the prompt content for indicating that the target user has not subscribed to the target product, to display the H5 page for the target product.

[0079] S203, after obtaining the subscription information, calling a third calling method in the adapter based on the identification information of the target product, to access a third Native interface of the Native end, and obtaining target product information of the target product.

[0080] The third Native interface is an interface for obtaining target product information of any product; and the third calling method is a calling method for calling the third Native interface.

[0081] It can be understood that after obtaining the subscription information through the second Native interface, the third calling method of the adapter is called. Since the third calling method is a calling method for calling the third Native interface, and the third Native interface is an interface for obtaining target product information of any product, when the third calling method in the adapter is called, the target product information of the target product can be obtained by calling the calling method of the third Native interface. For example, the third calling method can be a js sdk getProductInfo method.

[0082] It can be understood that, for example, when the target product needs to be displayed on the H5 page, the H5 page can call the getProductInfo function, and the adapter can be called in response to the H5 page calling the getProductInfo function; after the adapter accesses the third Native interface by using the third calling method and obtains the target product information, the adapter can uniformly process the obtained target product information, for example, encapsulate the obtained target product information into the target product information returned to the H5 page, and then return the encapsulated target product information to the H5 page; wherein, if the operating system is an Android system, the function defined by the third calling method encapsulated by the adapter can be a window.KDS_Native.getProductDetail function; if the operating system is IOS, the function defined by the third calling method encapsulated by the adapter can be window.webkit.messageHandlers.getProductDetail.

[0083] It can be understood that the target product information of the target product can be used as a parameter required to be obtained by the third calling method, or can be used as a parameter returned after accessing the third Native interface, and the adapter can return the target product information of the target product to the H5 page in the form of a parameter.

[0084] S204, based on the obtained identity information of the target user, the subscription information and the target product information of the target product, performing H5 page rendering to display the H5 page for the target product.

[0085] It can be understood that the process of obtaining the identity information of the target user, the subscription information of the target product and the target product information of the client can be an asynchronous process, and the obtained identity information of the target user, the subscription information and the target product information of the target product can be in the form of parameters. After these parameters are obtained in succession, the parameters can be used to perform H5 page rendering, and after the H5 page is loaded, the target product subscribed by the target user can be displayed.

[0086] The page display method, device, electronic equipment and storage medium provided by the embodiments of the present application can call a first calling method in a preset adapter based on an identity of a target user to access a first Native interface at a Native end to obtain identity information of the target user; after obtaining the identity information of the target user, the second calling method in the adapter is called based on the identity information of the target user to access a second Native interface at the Native end to obtain subscription information of the target user for a target product; after obtaining the subscription information, the third calling method in the adapter is called based on identity information of the target product to access a third Native interface at the Native end to obtain target product information of the target product; and the H5 page is rendered based on the obtained identity information of the target user, subscription information and target product information of the target product to display the H5 page for the target product. In the present solution, the adapter pre-encapsulates various methods for accessing the Native interface, and the calling method encapsulated in the adapter is called to access the Native interface to obtain the target product information, etc. to display the target product on the H5 page, which avoids the direct interaction between the H5 page and the Native end. If the Native end is changed, the adapter only needs to be adjusted, and it is not necessary to adapt the interaction between the H5 page and each Native interface at the Native end one by one, thereby reducing the workload of the developers.

[0087] Optionally, based on the embodiment shown in Figure 2 The target product information of the target product is product detail information of the target product. Figure 3 As shown in the figure, the page display method further includes step S301 before step S203, and step S203 can include step S2031.

[0088] S301, based on the identity information of the target product, a fourth calling method in the adapter is called to access a fourth Native interface at the Native end to obtain preset product basic information of the target product.

[0089] The fourth Native interface is an interface for obtaining preset product basic information of any product, and the fourth calling method is a calling method for calling the fourth Native interface.

[0090] It can be understood that after obtaining the subscription information through the second Native interface, the fourth calling method of the adapter is called. Since the fourth calling method is a calling method for calling the fourth Native interface, and the fourth Native interface is an interface for obtaining preset product basic information of any product, when the fourth calling method in the adapter is called, the preset product basic information of the target product can be obtained by calling the calling method of the fourth Native interface.

[0091] It can be understood that, for example, when the target product needs to be displayed on the H5 page, the H5 page can call the getProductInfo function, and the adapter can be called in response to the H5 page calling the getProductInfo function. After the adapter accesses the fourth Native interface by using the fourth calling method to obtain the product basic information of the target product, the obtained product basic information can be uniformly processed for subsequent steps of obtaining product detailed information. If the operating system is an Android system, the calling function defined by the fourth calling method encapsulated by the adapter can be a window.KDS_Native.getProductInfo function. If the operating system is IOS, the calling function defined by the fourth calling method encapsulated by the adapter can be window.webkit.messageHandlers.getProductInfo.

[0092] S2031, based on the identification information of the target product and the preset product basic information of the target product, calling a third calling method in the adapter to access a third Native interface of the Native end to obtain target product information of the target product.

[0093] It can be understood that the target product information is product detail information of the target product. After obtaining the product basic information, the third calling method of the adapter can be used to access the third Native interface of the Native end to obtain the product detail information.

[0094] This invention provides a page display method, apparatus, electronic device, and storage medium. Based on the target user's identity identifier, it calls a first calling method in a preset adapter to access a first Native interface on the Native side to obtain the target user's identity information. After obtaining the target user's identity information, it calls a second calling method in the adapter to access a second Native interface on the Native side to obtain the target user's contract information for a target product. After obtaining the contract information, it calls a third calling method in the adapter based on the target product's identifier information to access a third Native interface on the Native side to obtain the target product's target product information. Based on the obtained target user's identity information, contract information, and target product information, it renders an H5 page to display an H5 page for the target product. In this solution, the adapter pre-encapsulates various methods for accessing Native interfaces. By calling the methods encapsulated in the adapter, the Native interfaces are accessed to obtain target product information, which is then displayed on the H5 page. This avoids direct interaction between the H5 page and the Native side. If there are any changes on the Native side, only the adapter needs to be adjusted. It is not necessary to adapt each interaction between the H5 page and each Native interface on the Native side, thus reducing the workload of developers.

[0095] In this solution, the basic product information of the target product is obtained first, and then the detailed product information of the target product is obtained. This allows for a more accurate and comprehensive acquisition of product information and a more complete display of the target product.

[0096] To better understand the page display method provided in the embodiments of the present invention, the following is combined with... Figure 4 This section explains the principles behind page display methods.

[0097] like Figure 4As shown, the operating system of the Native native application can be an IOS or Android system, and the adapter encapsulating a plurality of calling methods can be preconfigured. During loading of the H5 page 1 of product 1, a first calling method in the adapter can be called to access a first Native interface at the Native end, to obtain identity information of the target user such as a fund account number and a mobile phone number, a second calling method in the adapter can be called to access a second Native interface at the Native end, to obtain subscription information of the target user such as a subscription state and an order state, and a third calling method in the adapter can be called to access a third Native interface at the Native end, to obtain target product information of the target product, that is, target product information of product 1. Based on the obtained information, product 1 is displayed on the H5 page 1. Similarly, the H5 page 2 is used to display product 2, and the process of loading the H5 page 2 of product 2 is similar to the process of loading the H5 page 1, which will not be described in detail here.

[0098] The page display method and device, the electronic device and the storage medium provided by the embodiment of the application can call a first calling method in a preset adapter based on an identity of a target user, to access a first Native interface at a Native end, to obtain identity information of the target user. After obtaining the identity information of the target user, a second calling method in the adapter is called based on the identity information of the target user, to access a second Native interface at the Native end, to obtain subscription information of the target user for a target product. After obtaining the subscription information, a third calling method in the adapter is called based on identity information of the target product, to access a third Native interface at the Native end, to obtain target product information of the target product. Based on the obtained identity information of the target user, the subscription information and the target product information of the target product, an H5 page is rendered, to display the H5 page for the target product. In the scheme, the adapter pre-encapsulates various methods for accessing the Native interface, and the calling methods encapsulated in the adapter are called to access the Native interface, to obtain the target product information, so as to display the target product on the H5 page. The direct interaction between the H5 page and the Native end is avoided, and if the Native end is changed, the adapter only needs to be adjusted, without the need to adapt the interaction between the H5 page and each Native interface at the Native end one by one, thereby reducing the workload of the developer.

[0099] The process of obtaining the identity information of the user will be described below in combination with Figure 5 the interaction between the H5 page, the adapter and the Native end loaded in the client of the electronic device.

[0100] As Figure 5As shown, in response to the loading instruction of the target user for the H5 page of the target product, the H5 page calls the getUserInfo(type) function, and type is a login type field. When type is empty, the adapter can respond to the H5 page calling the function getUserInfo() to access the first Native interface of the Native end based on the first calling method without forcing the user to log in to the client. When type is "baseInfo" or "ptjt", the adapter can respond to the H5 page calling the function getUserInfo(baseInfo) or getUserInfo(ptjt) to access the first Native interface of the Native end based on the first calling method in the case that the user logs in to the client by a mobile phone number or a fund account number. If the operating system of the Native end is an Android system, the calling function of the first calling method can be window.KDS_Native.getUserInfo to access the first Native interface. If the operating system of the Native end is IOS, the calling function of the first calling method can be window.webkit.messageHandlers.getUserInfo to access the first Native interface. If the Native end does not return the identity information of the user to the adapter within a specified time range, the adapter returns empty data content to the H5 page, at which time it can be considered that the identity information acquisition fails. If the first Native interface of the Native end returns the identity information of the user to the adapter within a specified time range, the adapter can uniformly process the identity information according to the operating system, encapsulate the identity information of the user, and return the identity information to the H5 page. The first Native interface can be a window.setUserInfo interface.

[0101] As for the process of obtaining the signing information of the product, the interaction between the H5 page, the adapter and the Native end loaded in the client of the electronic device will be introduced below. Figure 6

[0102] As shown in FIG. 6, the H5 page can call the function getUserInfo(type) to obtain the identity information of the user. The type field can be empty, "baseInfo" or "ptjt". The adapter can respond to the H5 page calling the function getUserInfo(type) to access the first Native interface of the Native end based on the first calling method. The calling function of the first calling method can be window.KDS_Native.getUserInfo or window.webkit.messageHandlers.getUserInfo. The adapter can uniformly process the identity information of the user according to the operating system, encapsulate the identity information of the user, and return the identity information to the H5 page. The first Native interface can be a window.setUserInfo interface. Figure 6 ​As shown, in response to the target user's loading instruction for the H5 page of the target product, the H5 page calls the `getUserSignInfo(required)` function. When `required` is "true", the user is forced to log in to their financial account. If the user is already logged in, the adapter can respond to the H5 page by calling the `getUserSignInfo` function to access the first Native interface to obtain the user's identity information. The process of accessing the first Native interface is similar to the aforementioned interaction process between the adapter and the Native side, and will not be elaborated further here. Then, based on the second calling method and the product ID, the adapter accesses the second Native interface on the Native side. If the Native operating system is Android, the calling function of the second calling method can be `window.KDS_Native.getUserProductSignInfo` to access the second Native interface; if the Native operating system is iOS, the calling function of the second calling method can be `window.webkit.messageHandlers.getUserProductSignInfo` to access the second Native interface. If the Native side does not return contract information to the adapter within the specified time range, the adapter will return the user's identity information and content indicating that the user has not signed up to the H5 page. If the second Native interface on the Native side returns the user's subscription information to the adapter within a specified time range, the adapter can process the subscription information uniformly according to the operating system. Optionally, the adapter can format subscription information such as subscription status and expiration date as needed, and then return the subscription information to the H5 page. The second Native interface can be the window.setUserProductSignInfo interface.

[0103] The process of obtaining product information will be discussed below. Figure 7 This section introduces the H5 pages, adapters, and native interactions on the client side of electronic devices.

[0104] like Figure 7As shown, in response to the loading instruction of the target user for the H5 page of the target product, the H5 page calls the getProductInfo function, and the adapter can call the fourth Native interface of the Native end based on the fourth calling method and the product id in response to the function getProductInfo called by the H5 page, to obtain the product basic information. If the operating system of the Native end is an Android system, the calling function of the fourth calling method can be window.KDS_Native.getProductInfo, to access the fourth Native interface; if the operating system of the Native end is IOS, the calling function of the fourth calling method can be window.webkit.messageHandlers.getProductInfo, to access the fourth Native interface. If the product basic information is not returned to the adapter by the Native end within a specified time range, the adapter returns empty data content to the H5 page. If the product basic information is returned to the adapter by the fourth Native interface of the Native end within a specified time range, the adapter can uniformly process the product basic information according to the operating system, and then access the third Native interface of the Native end based on the third calling method and the product id, to obtain the product detail information. If the operating system of the Native end is an Android system, the calling function of the third calling method can be window.KDS_Native.getProductDetail, to access the third Native interface; if the operating system of the Native end is IOS, the calling function of the third calling method can be window.webkit.messageHandlers.getProductDetail, to access the third Native interface. If the product detail information is not returned to the adapter by the Native end within a specified time range, the adapter returns the product basic information to the H5 page. If the product detail information is returned to the adapter by the third Native interface of the Native end within a specified time range, the adapter can uniformly process the product detail information according to the operating system, and optionally, the adapter can format the price display logic according to requirements, and then return the product detail information to the H5 page. The third Native interface can be a setProductDetail interface, and the fourth Native interface can be a window.setProductInfo interface.

[0105] It should be noted that the process of obtaining the identity information, the subscription information of the user and the product information of the product can be asynchronous processing.

[0106] Based on the above-mentioned page display method, the embodiment of the present application further provides a page display device, likeFigure 8 The page display apparatus includes, as shown:

[0107] The first calling module 810 is configured to, in response to receiving a loading instruction for the H5 page of the target product issued by a target user, call a first calling method in a preset adapter based on an identity of the target user, to access a first Native interface of the Native end, to obtain identity information of the target user; the adapter is a module pre-encapsulated with multiple calling methods, different calling methods are used to call different Native interfaces of the Native end, and each Native interface is used to obtain one kind of information content; the first Native interface is an interface used to obtain the identity information of the target user; and the first calling method is a calling method used to call the first Native interface.

[0108] The second calling module 820 is configured to, after obtaining the identity information of the target user, call a second calling method in the adapter based on the identity information of the target user, to access a second Native interface of the Native end, to obtain subscription information of the target user; the second Native interface is an interface used to obtain the subscription information of the target user; and the second calling method is a calling method used to call the second Native interface.

[0109] The third calling module 830 is configured to, after obtaining the subscription information, call a third calling method in the adapter based on identity information of the target product, to access a third Native interface of the Native end, to obtain target product information of the target product; the third Native interface is an interface used to obtain target product information of any product; and the third calling method is a calling method used to call the third Native interface.

[0110] The first rendering module 840 is configured to, based on the obtained identity information, subscription information of the target user, and target product information of the target product, perform H5 page rendering, to display the H5 page for the target product.

[0111] Optionally, each calling method encapsulated by the adapter is a method set based on an operating system of an electronic device on which the Native end is deployed.

[0112] Optionally, the apparatus further includes:

[0113] The second rendering module is configured to, if the subscription information is not obtained, perform H5 page rendering based on the obtained identity information of the target user and prompt content indicating that the target user does not subscribe to the target product, to display an H5 page for the target product.

[0114] Optionally, the target product information of the target product is product detail information of the target product.

[0115] Before the third calling module 830 calls the third calling method in the adapter based on the identification information of the target product to access the third Native interface of the Native end to obtain the target product information of the target product, the apparatus further includes:

[0116] The fourth calling module is configured to call a fourth calling method in the adapter based on the identification information of the target product to access a fourth Native interface of the Native end to obtain preset product basic information of the target product; the fourth Native interface is an interface for obtaining preset product basic information of any product; and the fourth calling method is a calling method for calling the fourth Native interface.

[0117] The third calling module 830 is further configured to call the third calling method in the adapter based on the identification information of the target product and the preset product basic information of the target product to access the third Native interface of the Native end to obtain the target product information of the target product.

[0118] Optionally, the adapter is an adapter constructed according to a software development kit (SDK) for JavaScript.

[0119] This invention provides a page display method, apparatus, electronic device, and storage medium. Based on the target user's identity identifier, it calls a first calling method in a preset adapter to access a first Native interface on the Native side to obtain the target user's identity information. After obtaining the target user's identity information, it calls a second calling method in the adapter to access a second Native interface on the Native side to obtain the target user's contract information for a target product. After obtaining the contract information, it calls a third calling method in the adapter based on the target product's identifier information to access a third Native interface on the Native side to obtain the target product's target product information. Based on the obtained target user's identity information, contract information, and target product information, it renders an H5 page to display an H5 page for the target product. In this solution, the adapter pre-encapsulates various methods for accessing Native interfaces. By calling the methods encapsulated in the adapter, the Native interfaces are accessed to obtain target product information, which is then displayed on the H5 page. This avoids direct interaction between the H5 page and the Native side. If there are any changes on the Native side, only the adapter needs to be adjusted. It is not necessary to adapt each interaction between the H5 page and each Native interface on the Native side, thus reducing the workload of developers.

[0120] This invention also provides an electronic device, such as... Figure 9 As shown, it includes a processor 901, a communication interface 902, a memory 903, and a communication bus 904, wherein the processor 901, the communication interface 902, and the memory 903 communicate with each other through the communication bus 904.

[0121] Memory 903 is used to store computer programs;

[0122] When the processor 901 executes the program stored in the memory 903, it implements the steps of the aforementioned page display method.

[0123] The communication bus mentioned in the above electronic devices can be a Peripheral Component Interconnect (PCI) bus or an Extended Industry Standard Architecture (EISA) bus, etc. This communication bus can be divided into address bus, data bus, control bus, etc. For ease of illustration, only one thick line is used to represent it in the diagram, but this does not mean that there is only one bus or one type of bus.

[0124] The communication interface is used for communication between the aforementioned electronic devices and other devices.

[0125] The memory can include a random access memory (RAM) and can also include a non-volatile memory (NVM), such as at least one disk memory. Optionally, the memory can also be at least one storage device located remotely from the aforementioned processor.

[0126] The aforementioned processor can be a general-purpose processor, including a central processing unit (CPU), a network processor (NP), etc., and can also be a digital signal processor (DSP), an application specific integrated circuit (ASIC), a field-programmable gate array (FPGA), or other programmable logic device, discrete gate or transistor logic, discrete hardware components.

[0127] In yet another embodiment provided by the present application, a computer readable storage medium is provided, and the computer readable storage medium stores a computer program. The computer program is executed by a processor to implement the steps of any of the aforementioned page display methods.

[0128] In yet another embodiment provided by the present application, a computer program product containing instructions, which, when run on a computer, causes the computer to execute any of the aforementioned page display methods.

[0129] In the embodiments described above, all or some of the steps can be implemented by software, hardware, firmware or any combination thereof. When implemented in software, all or some of the steps can be implemented in the form of one or more computer programs which are stored in a computer readable storage medium. The computer readable storage medium can be located in a computing device which is in operation. These computer programs (which may

[0130] It should be noted that, in the present document, the terms such as first and second are used only to differentiate one entity or operation from another entity or operation, and do not necessarily require or imply any such actual relationship or order between these entities or operations. Also, the terms "comprising", "containing" or any other similar term are intended to encompass non-exclusive inclusion such that a process, method, article or apparatus that comprises a list of elements does not necessarily include only those elements in the list, but can include other elements not expressly listed or inherent to such process, method, article or apparatus.

[0131] Each of the embodiments in the present document is described in a related manner, and the same or similar parts among the embodiments can be referred to each other. Each of the embodiments focuses on the difference from other embodiments. In particular, for the device embodiments, since they are basically similar to the method embodiments, the description is relatively simple, and the relevant parts can be referred to the part of the description of the method embodiments.

[0132] The above merely describes the preferred embodiments of the present application, but is not used to limit the protection scope of the present application. Any modification, equivalent replacement, improvement, etc. made within the spirit and principle of the present application shall be included in the protection scope of the present application.

Claims

1. A page display method, characterized in that, The method includes: In response to receiving a loading instruction for an H5 page targeting a target product from a target user, based on the target user's identity identifier, a first invocation method in a preset adapter is invoked to access a first Native interface on the Native side to obtain the target user's identity information; wherein, the adapter is a module pre-encapsulated with multiple invocation methods, different invocation methods are used to invoke different Native interfaces on the Native side, and each Native interface is used to obtain one type of information content; the first Native interface is the interface used to obtain the target user's identity information; the first invocation method is the invocation method used to invoke the first Native interface; After obtaining the target user's identity information, the second invocation method in the adapter is invoked based on the target user's identity information to access the second Native interface on the Native side and obtain the target user's subscription information; wherein, the second Native interface is an interface used to obtain the target user's subscription information; and the second invocation method is an invocation method used to invoke the second Native interface; After obtaining the contract information, based on the identification information of the target product, the third invocation method in the adapter is invoked to access the third Native interface on the Native side and obtain the target product information of the target product; wherein, the third Native interface is an interface used to obtain the target product information of any product; the third invocation method is an invocation method used to invoke the third Native interface; Based on the obtained identity information and contract information of the target user and the target product information of the target product, an H5 page is rendered to display an H5 page for the target product.

2. The method according to claim 1, characterized in that, The calling methods encapsulated in the adapter are methods set based on the operating system of the electronic device deployed on the Native end.

3. The method according to claim 1 or 2, characterized in that, The method further includes: If the contract information is not obtained, based on the obtained identity information of the target user and the prompt content used to indicate that the target user has not signed up for the target product, an H5 page is rendered to display an H5 page for the target product.

4. The method according to claim 1 or 2, characterized in that, The target product information of the target product is the product details information of the target product; Before invoking the third invocation method in the adapter based on the identification information of the target product to access the third Native interface on the Native side and obtain the target product information, the method further includes: Based on the identification information of the target product, the fourth invocation method in the adapter is invoked to access the fourth Native interface on the Native side and obtain the preset basic product information of the target product; wherein, the fourth Native interface is an interface for obtaining the preset basic product information of any product; the fourth invocation method is an invocation method for invoking the fourth Native interface; The step of invoking a third invocation method in the adapter based on the identification information of the target product to access the third native interface on the native side and obtain the target product information of the target product includes: Based on the identification information of the target product and the preset basic product information of the target product, the third calling method in the adapter is invoked to access the third Native interface on the Native side and obtain the target product information of the target product.

5. The method according to claim 1 or 2, characterized in that, The adapter is an adapter built according to the Software Development Kit (SDK) for JavaScript.

6. A page display device, characterized in that, The device includes: The first invocation module is configured to respond to a loading instruction for an H5 page targeting a target product issued by a target user, and based on the target user's identity identifier, invoke a first invocation method in a preset adapter to access a first Native interface on the Native side to obtain the target user's identity information; wherein, the adapter is a module pre-encapsulated with multiple invocation methods, different invocation methods are used to invoke different Native interfaces on the Native side, and each Native interface is used to obtain one type of information content; the first Native interface is the interface used to obtain the target user's identity information; the first invocation method is the invocation method used to invoke the first Native interface; The second invocation module is used to, after obtaining the identity information of the target user, invoke the second invocation method in the adapter based on the identity information of the target user to access the second Native interface on the Native side and obtain the subscription information of the target user; wherein, the second Native interface is an interface used to obtain the subscription information of the target user; and the second invocation method is an invocation method used to invoke the second Native interface; The third invocation module is used, after obtaining the contract information, to invoke the third invocation method in the adapter based on the identification information of the target product, so as to access the third Native interface on the Native side and obtain the target product information of the target product; wherein, the third Native interface is an interface for obtaining the target product information of any product; the third invocation method is an invocation method for invoking the third Native interface; The first rendering module is used to render an H5 page based on the obtained identity information and contract information of the target user and the target product information of the target product, so as to display an H5 page for the target product.

7. The apparatus according to claim 6, characterized in that, The calling methods encapsulated in the adapter are methods set based on the operating system of the electronic device deployed on the Native end.

8. The apparatus according to claim 6 or 7, characterized in that, The device further includes: The second rendering module is used to render an H5 page for the target product if the contract information is not obtained, based on the obtained identity information of the target user and the prompt content indicating that the target user has not signed up for the target product.

9. An electronic device, characterized in that, It includes a processor, a communication interface, a memory, and a communication bus, wherein the processor, the communication interface, and the memory communicate with each other through the communication bus; Memory, used to store computer programs; A processor, when executing a program stored in memory, implements the method described in any one of claims 1-5.

10. A computer-readable storage medium, characterized in that, The computer-readable storage medium stores a computer program that, when executed by a processor, implements the method described in any one of claims 1-5.

Images