Web application cross-platform interaction method, system and device

Abstract

The invention discloses a web application cross-platform interaction method, system and device, and the method comprises the steps: enabling a front end to transmit a notification command to middleware when a web application is activated; the middleware identifies an operation platform corresponding to the web application based on the notification command; the middleware obtains a global variable matched with the operation platform and stores the global variable into a temporary variable; the middleware encapsulates the operation of the temporary variable into a JavaScript method; when a command event occurs in the web application, the front end sends a service request to the middleware; the middleware calls a JavaScript method, generates a data request matched with the service request, and sends the data request to a back end; the back end sends response data to the middleware based on the data request; and the middleware sends the response data to the front end, so that the web application completes the response of the command event. According to the method, the web application can be seamlessly operated on multiple platforms such as a gap platform, an Android platform and an Apple platform.

Description

Technical Field

[0001] The present application relates to the field of application development, and in particular to a method, system and device for cross-platform interaction of web applications. Background Art

[0002] With the diversification of mobile devices and operating systems, applications need to run on multiple platforms to meet user needs. Common operating systems include Hongmeng, Android, and Apple's iOS. In addition, the widespread application of H5 technology on the web has also made the development of cross-platform applications a trend. However, the differences between different platforms make developers face many challenges in realizing cross-platform interaction of web applications.

[0003] Specifically, for different platforms (such as Hongmeng system, Android system, and iOS system), each with its own unique development environment, language, and tools, developers need to invest a lot of time and energy to develop and maintain them separately, resulting in huge workloads, inconsistent versions, and differences in user experience. In addition, the communication and data sharing between different platforms are complex, and developers need to write multiple sets of code to handle data transmission and synchronization between platforms, which increases the complexity and maintenance cost of the system. Differences in device characteristics and functions (such as operating system interfaces, hardware functions, and permission management) further increase the difficulty of development. Developers need to deal with these differences specifically to ensure the consistency and functional integrity of applications on different devices. Cross-platform frameworks have performance bottlenecks when calling device native functions, and cannot fully utilize device hardware resources, resulting in low application efficiency and poor user experience. In addition, the cost of multi-platform development and maintenance is high, and the development team needs to invest a lot of manpower and financial resources, which prolongs the development cycle. The unification of security and permission management is also a major challenge. Different platforms have differences in handling user permissions and data security. Developers need to write additional code to adapt to these differences to ensure application security and data privacy. Summary of the invention

[0004] The present application provides a web application cross-platform interaction method, system and device, the purpose of which is to enable web applications to run seamlessly on multiple platforms.

[0005] In order to achieve the above objectives, this application provides the following technical solutions:

[0006] A web application cross-platform interaction method is applied to a system composed of a front-end, a middleware and a back-end, wherein the middleware includes a platform adapter and a unified interface, and the method includes:

[0007] When the web application is activated, the front end sends a notification command to the middleware;

[0008] The platform adapter identifies the operating platform corresponding to the web application based on the notification command;

[0009] The platform adapter obtains a global variable that matches the operating platform and stores the global variable into a temporary variable;

[0010] The platform adapter encapsulates the operation of the temporary variable into a JavaScript method, and deploys the JavaScript method into the unified interface;

[0011] When a command event occurs in the web application, the front end sends a corresponding service request to the middleware;

[0012] The unified interface calls the JavaScript method to generate a data request matched by the service request, and sends the data request to the backend;

[0013] The backend sends corresponding response data to the unified interface based on the data request;

[0014] The unified interface sends the response data to the front end so that the web application completes the response to the command event.

[0015] Optionally, the platform adapter obtains a global variable matching the operating platform and stores the global variable into a temporary variable, including:

[0016] If the operating platform is an iOS system, the platform adapter reads the global variables of the webkit kernel and stores the global variables of the webkit kernel into temporary variables.

[0017] Optionally, the platform adapter obtains a global variable matching the operating platform and stores the global variable into a temporary variable, including:

[0018] If the operating platform is not an iOS system, the platform adapter reads the global variables of the specified browser kernel and stores the global variables of the specified browser kernel into temporary variables; the specified browser kernel includes an Android browser kernel or a Hongmeng browser kernel.

[0019] Optionally, the JavaScript method includes a native.getDeviceInfo method, and the unified interface calls the JavaScript method to generate a data request matched by the service request, including:

[0020] If the type of the service request is device information acquisition, the unified interface calls the native.getDeviceInfo method to generate a data request that matches the service request.

[0021] Optionally, the JavaScript method includes a native.setNativeParams method and a native.getNativeParams method, and the unified interface calls the JavaScript method to generate a data request matched by the service request, including:

[0022] If the type of the service request is browser parameter transfer, the unified interface calls the native.setNativeParams method and the native.getNativeParams method to generate a data request that matches the service request.

[0023] Optionally, the JavaScript method includes a native.setAccessToken method, and the unified interface calls the JavaScript method to generate a data request matched by the service request, including:

[0024] If the type of the service request is authority management and security control, the unified interface calls the native.setAccessToken method to generate a data request that matches the service request.

[0025] Optionally, the JavaScript method includes a native.download method, and the unified interface calls the JavaScript method to generate a data request matched by the service request, including:

[0026] If the type of the service request is to download a file, the unified interface calls the native.download method to generate a data request that matches the service request.

[0027] A web application cross-platform interactive system, comprising:

[0028] Frontend, middleware, and backend;

[0029] The front end is used to: send a notification command to the middleware when the web application is activated; and send a corresponding service request to the middleware when a command event occurs in the web application;

[0030] The middleware is used to: identify the operating platform corresponding to the web application based on the notification command; obtain global variables matching the operating platform and store the global variables into temporary variables; encapsulate the operation of the temporary variables into JavaScript methods; call the JavaScript methods to generate a data request matched by the service request, and send the data request to the back end; send the response data sent by the back end to the front end, so that the web application completes the response to the command event;

[0031] The backend is used to send corresponding response data to the middleware based on the data request.

[0032] A web application cross-platform interaction device, comprising:

[0033] A platform identification unit, used to identify the operating platform corresponding to the web application based on the notification command sent by the front end;

[0034] A variable determination unit, used for obtaining a global variable matching the operating platform and storing the global variable into a temporary variable;

[0035] A method encapsulation unit, used for encapsulating the operation of the temporary variable into a JavaScript method;

[0036] A method calling unit, configured to call the JavaScript method, generate a data request that matches the service request sent by the front end, and send the data request to the back end;

[0037] The data feedback unit is used to send the response data sent by the back end to the front end, so that the web application completes the response to the command event.

[0038] Optionally, the variable determination unit is specifically used to:

[0039] If the operating platform is an iOS system, the global variables of the webkit kernel are read, and the global variables of the webkit kernel are stored in temporary variables.

[0040] Optionally, the variable determination unit is specifically used to:

[0041] If the operating platform is not an iOS system, read the global variables of the specified browser kernel, and store the global variables of the specified browser kernel into temporary variables; the specified browser kernel includes an Android browser kernel or a Hongmeng browser kernel.

[0042] Optionally, the JavaScript method includes a native.getDeviceInfo method, and the method calling unit is specifically used for:

[0043] If the type of the service request is device information acquisition, the native.getDeviceInfo method is called to generate a data request that matches the service request.

[0044] Optionally, the JavaScript method includes a native.setNativeParams method and a native.getNativeParams method, and the method calling unit is specifically used for:

[0045] If the type of the service request is browser parameter transfer, the native.setNativeParams method and the native.getNativeParams method are called to generate a data request that matches the service request.

[0046] Optionally, the JavaScript method includes a native.setAccessToken method, and the method calling unit is specifically used to:

[0047] If the type of the service request is authority management and security control, the native.setAccessToken method is called to generate a data request that matches the service request.

[0048] Optionally, the JavaScript method includes a native.download method, and the method calling unit is specifically used for:

[0049] If the type of the service request is to download a file, the native.download method is called to generate a data request that matches the service request.

[0050] The technical solution provided by the present application is that when the web application is activated, the front end sends a notification command to the middleware. Based on the notification command, the platform adapter identifies the operating platform corresponding to the web application. The platform adapter obtains global variables that match the operating platform and stores the global variables in temporary variables. The platform adapter encapsulates the operation of the temporary variables as a JavaScript method and deploys the JavaScript method into a unified interface. When a command event occurs in the web application, the front end sends a corresponding service request to the middleware. The unified interface calls the JavaScript method, generates a data request matched by the service request, and sends the data request to the back end. The back end sends the corresponding response data to the unified interface based on the data request. The unified interface sends the response data to the front end so that the web application completes the response to the command event. The cross-platform interaction method for web applications shown in this application enables web applications to run seamlessly on multiple platforms such as Hongmeng, Android, and Apple, thereby reducing development difficulty, improving development efficiency and user experience, and ensuring data consistency and security. BRIEF DESCRIPTION OF THE DRAWINGS

[0051] In order to more clearly illustrate the embodiments of the present application 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 only some embodiments of the present application. For ordinary technicians in this field, other drawings can be obtained based on these drawings without paying creative work.

[0052] Figure 1 A schematic diagram of the architecture of a cross-platform interactive system for web applications provided in an embodiment of the present application;

[0053] Figure 2 A communication system architecture diagram provided for an embodiment of the present application;

[0054] Figure 3 A schematic diagram of a flow chart of a cross-platform interaction method for a web application provided in an embodiment of the present application;

[0055] Figure 4 A schematic diagram of the architecture of a cross-platform interactive device for web applications provided in an embodiment of the present application. DETAILED DESCRIPTION

[0056] The following will be combined with the drawings in the embodiments of the present application to clearly and completely describe the technical solutions in the embodiments of the present application. Obviously, the described embodiments are only part of the embodiments of the present application, not all of the embodiments. Based on the embodiments in the present application, all other embodiments obtained by ordinary technicians in this field without creative work are within the scope of protection of this application.

[0057] In this application, relational terms such as first and second, etc. are used only to distinguish 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. The terms "include", "comprise" or any other variants thereof are intended to cover non-exclusive inclusion, so that a process, method, article or device including a series of elements includes not only those elements, but also other elements not explicitly listed, or also includes elements inherent to such process, method, article or device. In the absence of more restrictions, the elements defined by the sentence "comprise one..." do not exclude the existence of other identical elements in the process, method, article or device including the elements.

[0058] like Figure 1 As shown, it is a schematic diagram of the architecture of a cross-platform interactive system for web applications provided in an embodiment of the present application, including the modules shown below.

[0059] The front end 100 , the middleware 200 and the back end 300 .

[0060] The front end 100 is used to: send a notification command to the middleware 200 when the web application is activated; and send a corresponding service request to the middleware 200 when a command event occurs in the web application.

[0061] The middleware 200 is used to: identify the operating platform corresponding to the web application based on the notification command; obtain the global variables matching the operating platform and store the global variables into temporary variables; encapsulate the operations of the temporary variables into JavaScript methods; call the JavaScript method to generate a data request matching the service request, and send the data request to the back end 300; send the response data sent by the back end to the front end 100, so that the web application completes the response to the command event.

[0062] The backend 300 is used to send corresponding response data to the middleware 200 based on the data request.

[0063] Optionally, the middleware 200 includes a platform adapter and a unified interface. In some examples, the system architecture relationship between the platform adapter, the unified interface, the front end, the back end, the device, and the database can be found in Figure 2 shown.

[0064] exist Figure 2In the architecture shown, the device is located at the top of the communication system architecture, representing various hardware devices, such as mobile phones, tablets, etc. The front end can be used to communicate with the device through a unified interaction method, which can be regarded as the front-end layer of the communication system architecture. The middleware can be regarded as the middle layer of the system architecture. The platform adapter is used to handle the characteristics of different platforms, and the unified interface is used to provide consistent services. The back end can be used to handle business logic and data storage, and the back end can interact with the database. The database is located at the bottom of the communication system architecture and is responsible for data storage and management.

[0065] It is understandable that the front end is mainly responsible for the user interface of the web application, and the back end is mainly responsible for the logical processing, data storage, etc. of the web application.

[0066] Optionally, you can use platform adapters and unified interfaces to implement cross-platform interaction of web applications. Figure 3 Steps shown and explanations of the steps.

[0067] S301: When the web application is activated, the front end sends a notification command to the middleware.

[0068] The web application is activated, which can be understood as starting and activating the web application after installation and deployment.

[0069] In some examples, the front end sending a notification command to the middleware can be regarded as the front end sending a notification command to the platform adapter.

[0070] S302: The platform adapter identifies the operating platform corresponding to the web application based on the notification command.

[0071] The notification command includes keywords related to the operating platform, and the operating platform corresponding to the web application can be determined by identifying the keywords.

[0072] S303: The platform adapter obtains global variables that match the operating platform and stores the global variables into temporary variables.

[0073] Among them, different operating platforms match different global variables. Storing the global variables that match the operating platform corresponding to the web application into temporary variables can provide effective help for cross-platform interaction of the web application.

[0074] The so-called global variables may specifically be global variables of the browser, which refer to variables that can be used anywhere in the browser environment. The global variables are usually built-in objects or functions provided by the browser kernel.

[0075] Optionally, the platform adapter obtains global variables matching the operating platform and stores the global variables into temporary variables. The implementation process may be: if the operating platform is an iOS system, the platform adapter reads the global variables of the webkit kernel and stores the global variables of the webkit kernel into temporary variables.

[0076] It should be noted that the webkit kernel is a kernel of an open source browser. In some examples, the global variable of the webkit kernel read by the platform adapter may be a webMethod variable in the webkit kernel.

[0077] Optionally, the platform adapter obtains global variables that match the operating platform and stores the global variables into temporary variables. The implementation process can be: if the operating platform is not the iOS system, the platform adapter reads the global variables of the specified browser kernel and stores the global variables of the specified browser kernel into temporary variables; the specified browser kernel includes the Android browser kernel or the Hongmeng browser kernel.

[0078] In some examples, if the designated browser kernel is an Android browser kernel, the global variable of the Android browser kernel read by the platform adapter may be a jsObjest variable in the Android browser kernel.

[0079] In some examples, if the specified browser kernel is the HarmonyOS browser kernel, the global variables of the HarmonyOS browser kernel read by the platform adapter can be the jsObjest variables in the HarmonyOS browser kernel.

[0080] S304: The platform adapter encapsulates the operation of the temporary variable into a JavaScript method.

[0081] Among them, the platform adapter encapsulates the operation of temporary variables into JavaScript methods, and deploys the JavaScript methods into the unified interface, which makes it easy for the unified interface to call the JavaScript methods.

[0082] In some examples, the JavaScript method may specifically be a native method.

[0083] It can be understood that operations on different temporary variables are encapsulated as corresponding native methods, and the unified interface can call different native methods to implement operations on different temporary variables.

[0084] In some examples, JavaScript methods include, but are not limited to, native.download method, native.setTitle method, native.getNativeParams method, native.setNativeParams method, native.getDeviceInfo method, native.startOcr method, native.getStatusBarHeight method, native.getLocationInfo method, native.startFace method, native.startVideoFace method, native.isNavigationHidden method, native.closeWebView method, and native.chooseImage method.

[0085] In a possible implementation, the native.download method is used to download a file.

[0086] In a possible implementation, the native.setTitle method is used to set the native navigation bar title.

[0087] In a possible implementation, the native.getNativeParams method is used to read the underlying parameters passed in.

[0088] In a possible implementation, the native.setNativeParams method is used to pass callback parameters to the underlying layer.

[0089] In a possible implementation, the native.getDeviceInfo method is used to obtain basic device information.

[0090] In a possible implementation, the native.startOcr method is used to call the OCR service.

[0091] In a possible implementation, the native.getStatusBarHeight method is used to obtain the height of the mobile phone status bar.

[0092] In a possible implementation, the native.getLocationInfo method is used to obtain positioning information.

[0093] In a possible implementation, the native.startFace method is used to call the smart face signature service.

[0094] In a possible implementation, the native.isNavigationHidden method is used to hide the native navigation bar.

[0095] In a possible implementation, the native.closeWebView method is used to exit the SDK running container.

[0096] In a possible implementation, the native.chooseImage method is used to select an image from an album or take a photo.

[0097] S305: The platform adapter deploys the JavaScript method into the unified interface.

[0098] S306: When a command event occurs in the web application, the front end sends a corresponding service request to the middleware.

[0099] Among them, the front end sends a corresponding service request to the middleware, which can be regarded as the front end sending a corresponding service request to the unified interface.

[0100] S307: The unified interface calls the JavaScript method to generate a data request that matches the service request.

[0101] For different types of service requests, the same interface calls different JavaScript methods to generate data requests that match the service requests.

[0102] Optionally, if the type of the service request is device information acquisition, the unified interface calls the native.getDeviceInfo method to generate a data request that matches the service request.

[0103] It is understandable that by calling the native.getDeviceInfo method, the basic information of the device can be obtained. The native.getDeviceInfo method will call the corresponding native interface to obtain the device information according to different platforms, and return the result to the callback function success.

[0104] Optionally, if the type of the service request is browser parameter transmission, the unified interface calls the native.setNativeParams method and the native.getNativeParams method to generate a data request that matches the service request.

[0105] It can be understood that through the native.setNativeParams and native.getNativeParams methods, parameters in the web view can be set and obtained, thereby achieving seamless communication between the Web and native applications.

[0106] Optionally, if the type of the service request is permission management and security control, the unified interface calls the native.setAccessToken method to generate a data request that matches the service request.

[0107] Optionally, if the service request type is to download a file, the unified interface calls the native.download method to generate a data request that matches the service request.

[0108] It is understandable that through the native.download method, files can be downloaded.

[0109] Optionally, if the type of the service request is navigation bar setting, the unified interface calls the native.setTitle method to generate a data request that matches the service request.

[0110] It can be understood that the device can be controlled to set the navigation bar title through the native.setTitle method.

[0111] Optionally, if the type of the service request is to obtain the status bar height, the unified interface calls the native.getStatusBarHeight method to generate a data request that matches the service request.

[0112] It is understandable that the height of the device status bar can be obtained through the native.getStatusBarHeight method, which facilitates interface adaptation.

[0113] Optionally, if the service request type is to call the OCR service, the unified interface calls the native.startOcr method to generate a data request that matches the service request.

[0114] It can be understood that the OCR service of the device can be started through the native.startOcr method.

[0115] Optionally, if the type of the service request is to obtain location information, the unified interface calls the native.getLocationInfo method to generate a data request that matches the service request.

[0116] It is understandable that the location information of the device can be obtained through the native.getLocationInfo method.

[0117] Optionally, if the type of service request is to call the face authentication service, the unified interface calls the native.startFace method to generate a data request that matches the service request.

[0118] Optionally, if the type of service request is to call the intelligent face signature service, the unified interface calls the native.startVideoFace method to generate a data request that matches the service request.

[0119] It can be understood that the face recognition function of the device can be started through the native.startFace method and the native.startVideoFace method.

[0120] Optionally, if the type of the service request is to hide the native navigation bar, the unified interface calls the native.isNavigationHidden method to generate a data request that matches the service request.

[0121] It can be understood that the display of the device navigation bar can be controlled through the native.isNavigationHidden method.

[0122] Optionally, if the type of the service request is to exit the SDK running container, the unified interface calls the native.closeWebView method to generate a data request that matches the service request.

[0123] It is understandable that the web view can be closed through the native.closeWebView method.

[0124] Optionally, if the type of the service request is to select an image from an album or take a photo, the unified interface calls the native.chooseImage method to generate a data request that matches the service request.

[0125] It is understandable that a picture can be selected through the native.chooseImage method.

[0126] Optionally, if the service request type is to obtain camera permissions, the unified interface calls the native.getCameraPermissions method to generate a data request that matches the service request.

[0127] Optionally, if the service request type is access token, the unified interface calls the native.setAccessToken method to generate a data request that matches the service request.

[0128] Optionally, if the type of the service request is to process a login expiration event, the unified interface calls the native.loginExpired method to generate a data request that matches the service request.

[0129] S308: The unified interface sends the data request to the backend.

[0130] S309: The backend sends corresponding response data to the unified interface based on the data request.

[0131] S310: The unified interface sends response data to the front end so that the web application completes the response to the command event.

[0132] It should be noted that the middleware shown in the implementation of this application has the following functional points.

[0133] First, the middleware can provide a unified device information acquisition interface. By defining a unified interface to obtain device information, the same method call can be used to obtain device information on Hongmeng, Android, or Apple platforms. In this way, in cross-platform development, the device information acquisition methods of different platforms are different, which increases the complexity of development and maintenance. By providing a unified device information acquisition interface, developers only need to write code once and use it on all platforms, which simplifies the development process and improves the maintainability of the code.

[0134] Second, the middleware can provide a universal web view parameter passing mechanism, through which seamless communication between the Web and native applications is achieved without writing different codes for different platforms. In this way, the communication mechanisms between WebView and native applications on different platforms are different, and developers need to write multiple sets of code for adaptation. Through a unified parameter passing mechanism, the code can be simplified, the development workload can be reduced, and the consistency and correct transmission of parameters between different platforms can be ensured.

[0135] Third, the middleware can provide platform feature detection and automatic adaptation. It can automatically detect the current running platform and adapt according to the platform features to ensure a consistent experience on different platforms. In this way, each platform has unique features and functions, and developers need to adapt to these differences. By automatically detecting platform features and adapting accordingly, the workload of manual adaptation can be reduced, ensuring the consistency of applications and user experience on different platforms.

[0136] Fourth, the middleware can provide unified permission management and security control. Through the unified permission management and security control mechanism, it ensures the consistency of permissions and security policies on different platforms. In this way, there are differences in permission management and security control on different platforms, and developers need to write additional code to adapt to these differences. The unified permission management mechanism can simplify the development process, ensure the security and consistency of applications on various platforms, and reduce security risks.

[0137] Fifth, the middleware can optimize performance and user experience by optimizing the performance of the cross-platform framework, especially the call to the native functions of the device, to ensure the efficient operation of the application on different platforms and a good user experience. In this way, the cross-platform framework has performance bottlenecks when calling the native functions of the device, which may lead to inefficient application operation. By optimizing performance and user experience, it ensures that the application can fully utilize the device hardware resources on different platforms and provide a smooth user experience.

[0138] Sixth, the middleware can provide a unified development and maintenance process, which reduces the complexity and workload of multi-platform development and improves development efficiency. In this way, the cost of multi-platform development and maintenance is high, the development team needs to invest a lot of manpower and financial resources, and the development cycle is extended. Through a unified development and maintenance process, repetitive work can be reduced, development efficiency can be improved, and development and maintenance costs can be reduced.

[0139] The process shown in S301-S310 above has many advantages, such as unified cross-platform solution, efficient performance and user experience, consistent security and permission management, simplified development and maintenance process, flexible expansion and adaptation capabilities, and unified interface and data transmission mechanism, which greatly improves the efficiency and quality of cross-platform development and reduces development and maintenance costs.

[0140] like Figure 4 , which is a schematic diagram of the architecture of a web application cross-platform interaction device provided in an embodiment of the present application, including the following units.

[0141] The platform identification unit 401 is used to identify the operating platform corresponding to the web application based on the notification command sent by the front end.

[0142] The variable determination unit 402 is used to obtain global variables that match the operating platform and store the global variables into temporary variables.

[0143] The method encapsulation unit 403 is used to encapsulate the operation of the temporary variable into a JavaScript method.

[0144] The method calling unit 404 is used to call the JavaScript method, generate a data request that matches the service request sent by the front end, and send the data request to the back end.

[0145] The data feedback unit 405 is used to send the response data sent by the back end to the front end, so that the web application completes the response to the command event.

[0146] Optionally, the variable determination unit 402 is specifically configured to: if the operating platform is an iOS system, read the global variables of the webkit kernel, and store the global variables of the webkit kernel into temporary variables.

[0147] Optionally, the variable determination unit 402 is specifically used for: if the operating platform is not the iOS system, reading the global variables of the specified browser kernel, and storing the global variables of the specified browser kernel into temporary variables; the specified browser kernel includes the Android browser kernel or the Hongmeng browser kernel.

[0148] Optionally, the JavaScript method includes a native.getDeviceInfo method, and the method calling unit 404 is specifically used to: if the type of the service request is device information acquisition, call the native.getDeviceInfo method to generate a data request that matches the service request.

[0149] Optionally, the JavaScript method includes a native.setNativeParams method and a native.getNativeParams method, and the method calling unit 404 is specifically used to: if the type of the service request is browser parameter transfer, call the native.setNativeParams method and the native.getNativeParams method to generate a data request that matches the service request.

[0150] Optionally, the JavaScript method includes a native.setAccessToken method, and the method calling unit 404 is specifically used to: if the type of the service request is permission management and security control, call the native.setAccessToken method to generate a data request that matches the service request.

[0151] Optionally, the JavaScript method includes a native.download method, and the method calling unit 404 is specifically used to: if the type of the service request is to download a file, call the native.download method to generate a data request that matches the service request.

[0152] The above-mentioned device has many advantages, such as unified cross-platform solution, efficient performance and user experience, consistent security and permission management, simplified development and maintenance process, flexible expansion and adaptation capabilities, unified interface and data transmission mechanism, etc. It greatly improves the efficiency and quality of cross-platform development and reduces development and maintenance costs.

[0153] In addition, the functions described above in the embodiments of the present application may be at least partially performed by one or more hardware logic components. For example, without limitation, exemplary types of hardware logic components that may be used include: field programmable gate arrays (FPGAs), application specific integrated circuits (ASICs), application specific standard products (ASSPs), systems on chip (SOCs), complex programmable logic devices (CPLDs), and the like.

[0154] Although the subject matter has been described in language specific to structural features and / or methodological logical actions, it should be understood that the subject matter defined in the appended claims is not necessarily limited to the specific features or actions described above. On the contrary, the specific features and actions described above are merely example forms of implementing the claims.

[0155] Although several specific implementation details are included in the above discussion, these should not be interpreted as limiting the scope of the present application. Certain features described in the context of a separate embodiment can also be implemented in a single embodiment in combination. On the contrary, the various features described in the context of a single embodiment can also be implemented in multiple embodiments individually or in any suitable sub-combination.

[0156] The above description is only a preferred embodiment of the present application and an explanation of the technical principles used. Those skilled in the art should understand that the scope of disclosure involved in the present application is not limited to the technical solution formed by a specific combination of the above technical features, but should also cover other technical solutions formed by any combination of the above technical features or their equivalent features without departing from the above disclosed concept. For example, the above features are replaced with the technical features with similar functions disclosed in this application (but not limited to) by each other to form a technical solution.

Claims

1. A web application cross-platform interaction method, characterized in that: Applied to a system consisting of a front end, a middleware and a back end, the middleware includes a platform adapter and a unified interface, and the method includes: When the web application is activated, the front end sends a notification command to the middleware; The platform adapter identifies the operating platform corresponding to the web application based on the notification command; The platform adapter obtains a global variable that matches the operating platform and stores the global variable into a temporary variable; The platform adapter encapsulates the operation of the temporary variable into a JavaScript method, and deploys the JavaScript method into the unified interface; When a command event occurs in the web application, the front end sends a corresponding service request to the middleware; The unified interface calls the JavaScript method to generate a data request matched by the service request, and sends the data request to the backend; The backend sends corresponding response data to the unified interface based on the data request; The unified interface sends the response data to the front end so that the web application completes the response to the command event.

2. The method according to claim 1, characterized in that The platform adapter obtains a global variable matching the operating platform and stores the global variable into a temporary variable, including: If the operating platform is an iOS system, the platform adapter reads the global variables of the webkit kernel and stores the global variables of the webkit kernel into temporary variables.

3. The method according to claim 1, characterized in that: The platform adapter obtains a global variable matching the operating platform and stores the global variable into a temporary variable, including: If the operating platform is not an iOS system, the platform adapter reads the global variables of the specified browser kernel and stores the global variables of the specified browser kernel into temporary variables; the specified browser kernel includes an Android browser kernel or a Hongmeng browser kernel.

4. The method according to claim 1, characterized in that: The JavaScript method includes a native.getDeviceInfo method, and the unified interface calls the JavaScript method to generate a data request matched by the service request, including: If the type of the service request is device information acquisition, the unified interface calls the native.getDeviceInfo method to generate a data request that matches the service request.

5. The method according to claim 1, characterized in that The JavaScript method includes a native.setNativeParams method and a native.getNativeParams method. The unified interface calls the JavaScript method to generate a data request matched by the service request, including: If the type of the service request is browser parameter transfer, the unified interface calls the native.setNativeParams method and the native.getNativeParams method to generate a data request that matches the service request.

6. The method according to claim 1, characterized in that The JavaScript method includes a native.setAccessToken method, and the unified interface calls the JavaScript method to generate a data request matched by the service request, including: If the type of the service request is authority management and security control, the unified interface calls the native.setAccessToken method to generate a data request that matches the service request.

7. The method according to claim 1, characterized in that The JavaScript method includes a native.download method, and the unified interface calls the JavaScript method to generate a data request matched by the service request, including: If the type of the service request is to download a file, the unified interface calls the native.download method to generate a data request that matches the service request.

8. A web application cross-platform interactive system, characterized in that: include: Frontend, middleware, and backend; The front end is used to: send a notification command to the middleware when the web application is activated; and send a corresponding service request to the middleware when a command event occurs in the web application; The middleware is used to: identify the operating platform corresponding to the web application based on the notification command; obtain a global variable matching the operating platform, and store the global variable into a temporary variable; Encapsulating the operation of the temporary variable into a JavaScript method; calling the JavaScript method to generate a data request matched by the service request, and sending the data request to the back end; sending the response data sent by the back end to the front end, so that the web application completes the response to the command event; The backend is used to send corresponding response data to the middleware based on the data request.

9. The system according to claim 8, characterized in that The middleware is also used to execute the web application cross-platform interaction method described in any one of claims 2-7 above.

10. A web application cross-platform interactive device, characterized in that: include: A platform identification unit, used to identify the operating platform corresponding to the web application based on the notification command sent by the front end; A variable determination unit, used for obtaining a global variable matching the operating platform and storing the global variable into a temporary variable; A method encapsulation unit, used for encapsulating the operation of the temporary variable into a JavaScript method; A method calling unit, configured to call the JavaScript method, generate a data request that matches the service request sent by the front end, and send the data request to the back end; The data feedback unit is used to send the response data sent by the back end to the front end, so that the web application completes the response to the command event.

Images