Native application development method and device, storage medium and electronic equipment

Abstract

The invention discloses a native application development method and device, a storage medium and electronic equipment, and relates to the technical field of computers, the method comprises the following steps: in response to development of a target native application on a plurality of different operating system platforms, obtaining a JSAPI containing a JSBridge and a JSSDK containing the JSBridge and a predetermined native application debugging package; the method comprises the following steps of: introducing a JSAPI (JavaScript Service Application Program Interface) into an H5 page, introducing a JSSDK (JavaScript Service Development Kit) into a target native application, and integrating the H5 page in the target native application based on WebView and JSBridge; according to the preset native application debugging package, function adaptability adjustment is carried out on target native applications integrated with the H5 page in the multiple different operating system platforms in the H5 page; and under the condition of determining that the target native application functions in the plurality of different operating system platforms all meet the preset adaptation condition, completing the development of the target native application. Compared with the prior art, the number of times of original application version issuing can be reduced, and the development efficiency is improved.

Description

Technical Field

[0001] The present application relates to the field of computer technology, and in particular to a method, device, storage medium and electronic device for developing a native application. Background Art

[0002] Native applications refer to applications designed and developed specifically for a specific operating system platform (such as iOS, Android). Such applications are developed entirely using the language and tools supported by the target platform, and can directly access the underlying hardware resources and APIs provided by the operating system. Native applications usually provide the best performance and user experience.

[0003] At present, in the case where the same native application needs to be developed on different operating system platforms, the development of native applications on different operating platforms is mainly completed by using multiple different technology stacks.

[0004] However, using this native application development method requires investing more in technology stacks for separate development. When native application development is required for multiple operating system platforms, it takes a long time to complete the development and requires high development costs, which will result in long development time and low development efficiency for native applications on different operating system platforms. Summary of the invention

[0005] In view of this, the present application provides a method, device, storage medium and electronic device for developing native applications. The main purpose is to improve the current existing technology that requires a large amount of technology stack to be developed separately. When native applications need to be developed on multiple operating system platforms, it takes a long time to complete the development and requires a high development cost, which will lead to technical problems such as long development time and low development efficiency for native applications on different operating system platforms.

[0006] In a first aspect, the present application provides a method for developing a native application, comprising:

[0007] In response to developing a target native application on a plurality of different operating system platforms, obtaining a JavaScript application programming interface (JSAPI) including a JavaScript bridge (JSBridge), and a JavaScript software development kit (JSSDK) including the JSBridge and a predetermined native application debugging package;

[0008] Introducing the JSAPI in a Hypertext Markup Language Version 5 (H5) page, and introducing the JSSDK in the target native application, and integrating the H5 page into the target native application based on a web view (WebView) and the JSBridge;

[0009] According to the predetermined native application debugging package, functional adaptability adjustment is performed on the H5 page for the target native applications integrated with the H5 page in the multiple different operating system platforms respectively;

[0010] When it is determined that the target native application functions in the multiple different operating system platforms all meet the predetermined adaptation conditions, the development of the target native application is completed.

[0011] In a second aspect, the present application provides a native application development device, including:

[0012] An acquisition module is configured to acquire a JSAPI including JSBridge and a JSSDK including the JSBridge and a predetermined native application debugging package in response to developing a target native application on a plurality of different operating system platforms;

[0013] A configuration module is configured to introduce the JSAPI into the H5 page, and introduce the JSSDK into the target native application, and integrate the H5 page into the target native application based on WebView and the JSBridge;

[0014] an adjustment module configured to perform functional adaptability adjustment on the target native applications integrated with the H5 page in the multiple different operating system platforms in the H5 page according to the predetermined native application debugging package;

[0015] The development module is configured to complete the development of the target native application when it is determined that the target native application functions in the multiple different operating system platforms all meet the predetermined adaptation conditions.

[0016] In a third aspect, the present application provides a computer-readable storage medium having a computer program stored thereon, and when the computer program is executed by a processor, the method for developing a native application described in the first aspect is implemented.

[0017] In a fourth aspect, the present application provides an electronic device, comprising a storage medium, a processor, and a computer program stored on the storage medium and executable on the processor, wherein the processor implements the native application development method described in the first aspect when executing the computer program.

[0018] By means of the above technical scheme, the present application provides a method, device, storage medium and electronic device for developing a native application. Compared with the current existing technology, the present application introduces JSAPI in the H5 page and JSSDK in the target native application, and integrates the H5 page in the target native application based on WebView and JSBridge, so as to quickly build a new mobile application, invest H5-end development resources in the construction process, reduce the investment of development resources of multiple technology stacks, and effectively reduce development costs; according to the predetermined native application debugging package, adjust the functional adaptability of the target native application integrated with the H5 page in multiple different operating system platforms in the H5 page; when it is determined that the target native application functions in multiple different operating system platforms meet the predetermined adaptation conditions, complete the development of the target native application, which can reduce the number of native application releases, so that the H5-end function page can be directly effective in the native application after it is developed and launched, and can also be integrated in the native application for debugging through the H5 page, thereby improving development efficiency. BRIEF DESCRIPTION OF THE DRAWINGS

[0019] The accompanying drawings, which are incorporated in and constitute a part of this specification, illustrate embodiments consistent with the present application and, together with the description, serve to explain the principles of the present application.

[0020] 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, for ordinary technicians in this field, other drawings can be obtained based on these drawings without paying any creative labor.

[0021] Figure 1 A schematic diagram of a process flow of a method for developing a native application provided in an embodiment of the present application is shown;

[0022] Figure 2 A schematic diagram of a process flow of a method for developing a native application provided in an embodiment of the present application is shown;

[0023] Figure 3 A schematic diagram showing an example provided by an embodiment of the present application;

[0024] Figure 4 A schematic diagram showing an example provided by an embodiment of the present application;

[0025] Figure 5 A schematic diagram showing an example provided by an embodiment of the present application;

[0026] Figure 6 A schematic diagram of an example process provided by an embodiment of the present application is shown;

[0027] Figure 7 A schematic diagram of an example process provided by an embodiment of the present application is shown;

[0028] Figure 8 A schematic diagram of the structure of a native application development device provided in an embodiment of the present application is shown. DETAILED DESCRIPTION

[0029] The embodiments of the present application will be described in more detail below with reference to the accompanying drawings. It should be noted that the embodiments and features in the embodiments of the present application can be combined with each other without conflict.

[0030] Based on the content shown in the background technology, in order to improve the current existing technology, which requires a large amount of technology stacks to be invested in separate development, and when multiple operating system platforms need to develop native applications, it takes a long time to complete the development, and requires a high development cost, which will lead to the technical problems of long time and low development efficiency for developing native applications on different operating system platforms. This embodiment provides a method for developing native applications, such as Figure 1 As shown, the method includes:

[0031] Step 101, in response to developing a target native application on multiple different operating system platforms, obtain a JSAPI including JSBridge, and a JSSDK including JSBridge and a predetermined native application debugging package.

[0032] In the embodiment of the present application, in the process of developing and running software on different computing devices and operating systems, since the operating system platforms have their own characteristics and technology stacks, it is necessary to consider cross-platform solutions when developing applications for multiple platforms. In the embodiment of the present application, the fifth edition of the HyperText Markup Language 5 (HTML5 / H5) page is used to complete the development of native applications across system platforms, wherein the H5 interface is an interactive web page or application interface built using Web technologies such as HTML5, CSS3 and JavaScript.

[0033] Specifically, different operating system platforms may include but are not limited to desktop operating systems, mobile operating systems, integrated systems, game consoles, smart TVs, etc. Among them, mobile operating systems may include Apple (iOS) system, Android system, HarmonyOS and other systems.

[0034] Correspondingly, native applications refer to applications designed and developed specifically for a specific operating system platform (such as iOS, Android). Such applications are developed entirely using the language and tools supported by the target platform, and can directly access the underlying hardware resources and the application programming interface (API) provided by the operating system. Native applications can usually provide the best performance and user experience.

[0035] Furthermore, JavaScript Bridge (JSBridge) is a technology that establishes communication between web applications (usually H5 pages) and native applications. It allows JavaScript code in web pages to call functions of native applications, and vice versa. Through JSBridge, web applications can access APIs provided by native applications, such as camera, geolocation, contacts, etc., while also allowing native applications to call JavaScript functions in web pages.

[0036] In some examples, a JavaScript application programming interface (JSAPI) can be a set of interfaces that allow JavaScript code to access specific functions or services. Specifically, the JSAPI in the H5 interface generally refers to a set of interfaces that allow JavaScript code to access the functions of a web page. These APIs allow web developers to manipulate the content, style, behavior, and interaction with users of web pages through JavaScript. The JSAPI in the H5 page can be divided into several categories, including but not limited to APIs provided by browsers, APIs provided by web frameworks, APIs provided by web component libraries, and custom APIs, etc.

[0037] Optionally, the predetermined native application debugging package is an end-to-end full-process debugging tool from H5 to native application provided in an embodiment of the present application.

[0038] Furthermore, JavaScript Software Development Kit (JSSDK) can be a set of APIs for calling specific functions or services through JavaScript code in web pages. JSSDK can provide a variety of functions ranging from simple functions (such as sharing to social media) to complex integrations (such as map services, payment interfaces, etc.). These SDKs are usually developed by third-party service providers so that developers can easily integrate these services in their own web applications or websites.

[0039] Step 102: Introduce JSAPI into the H5 page, and introduce JSSDK into the target native application, and integrate the H5 page into the target native application based on WebView and JSBridge.

[0040] In the embodiments of the present application, it is a common requirement to integrate the H5 page into the target native application, especially when developing a hybrid application or when it is necessary to embed a web page in a native application. Specifically, it is necessary to add a WebView control to the native application to display the H5 page, ensure that the WebView is correctly configured, support JavaScript execution, and use appropriate APIs to implement message passing between JavaScript and the native application.

[0041] In some examples, WebView is a component used to embed and display web content in native applications. It allows developers to integrate web technologies such as HTML, CSS, and JavaScript into mobile applications to achieve richer functions and user experience.

[0042] Step 103: According to the predetermined native application debugging package, functional adaptability adjustment is performed on the target native applications integrated with the H5 page in the H5 page in different operating system platforms.

[0043] For this embodiment, after the H5 page is integrated into the target native application, it is necessary to adjust the functional adaptability of the native application. Specifically, it is mainly achieved by developing a target native application (APP) debugging installation package. The APP installation debugging package integrates the JSSDK package, and the core function supported is to provide a debugging console to dynamically display the debugging information of the H5 page operation. The H5 developer installs the APP debugging installation package on the mobile phone and keeps the mobile phone and the PC-side development computer in the same local area network. After the H5 developer adjusts the front-end code on the development computer, he can see the debugging information of the program after the latest code adjustment on the APP-side debugging console, and ensure that it can cover all interactions between the H5 page and the native application, while providing an intuitive and easy-to-use debugging interface.

[0044] Step 104: When it is determined that the target native application functions in multiple different operating system platforms meet the predetermined adaptation conditions, the development of the target native application is completed.

[0045] Compared with the current existing technology, this embodiment introduces JSAPI in the H5 page and JSSDK in the target native application, and integrates the H5 page in the target native application based on WebView and JSBridge, so as to quickly build a new mobile application, invest H5-end development resources in the construction process, reduce the investment of development resources of multiple technology stacks, and effectively reduce development costs; according to the predetermined native application debugging package, the functional adaptability of the target native application integrated with the H5 page in multiple different operating system platforms is adjusted in the H5 page; when it is determined that the target native application functions in multiple different operating system platforms meet the predetermined adaptation conditions, the development of the target native application is completed, which can reduce the number of native application releases, so that the H5-end function page can be directly effective in the native application after it is developed and launched, and it can also be debugged in the native application through the H5 page, thereby improving development efficiency.

[0046] Further, as a refinement and extension of the above embodiment, when configuring the application function of the H5 page in the target native application through WebView and JSBridge, the following methods may be used but are not limited to: Figure 2 As shown, the method includes:

[0047] Step 201: Based on WebView and JSBridge, establish two-way data communication between the H5 page and the target native application.

[0048] Among them, two-way data communication is used for mutual function calls between the H5 page and the target native application.

[0049] When establishing two-way data communication between the H5 page and the target native application based on WebView and JSBridge, the following may be included but not limited to:

[0050] In the process of the H5 page making a function call to the target native application, the WebView is controlled to load the H5 page through JSBridge to determine the first function call information corresponding to the H5 page; the first function call information is formatted through JSAPI in the H5 page to obtain the first function call information, and the second function call information is sent to the WebView; the second function call information is sent to the target native application through the WebView; in the target native application, the second function call information is identified based on JSSDK, and the target native application is triggered to provide the corresponding function to the H5 page according to the second function call information.

[0051] In the process of calling a function of a target native application, in response to detecting injection of object information in the target native application, the injected object information is sent to WebView through the JSBridge; and WebView is controlled to send second function call information to the target native application based on JSBridge.

[0052] Specifically, during the two-way data communication between the H5 page and the target native application, such as Figure 3 and Figure 4 As shown in the figure, JSBridge is used to solve the two-way communication between H5 and Native. It uses JavaScript engine or Webview container as a medium to communicate through the agreement protocol to achieve a mechanism for two-way communication between Native and Web. Through JSBridge, the Web side can call the Java interface of the Native side, and the Native side can also call the JavaScript interface of the Web side through JSBridge to achieve two-way calls between each other.

[0053] Specifically, the concepts and functions of JSBridge include but are not limited to:

[0054] 1. Communication bridge: JSBridge acts as a communication bridge between web applications and native applications. Through JSBridge, we can conduct two-way communication between web and native code, so that the two can call each other and transfer data.

[0055] 2. Native function call: Using JSBridge, we can call functions in native applications in JavaScript. We can trigger specific operations in native applications through the web, such as opening the camera, sending notifications, calling hardware devices, etc.

[0056] 3. Data transfer: JSBridge makes it easy to transfer data between JavaScript and native code. This means that we can transfer complex data structures, such as objects and arrays, between web and native code to meet the functional requirements of the application.

[0057] 4. Callback mechanism: JSBridge supports callback mechanism, which allows JavaScript to be notified and the corresponding results to be delivered after the native code performs certain operations.

[0058] Furthermore, in the H5 project, the JSAPI.js file provides a unified calling encapsulation method for calling by multiple applications such as browsers, WeChat public accounts, WeChat applets, and native applications.

[0059] Specifically, Figure 5As shown, the browser, WeChat, and native applications provide JSSDK to call the front-end H5 project to implement native functions such as camera and storage. For example, PiccJsAPI.js is introduced in the H5 project, and JS is mounted to the instantiated object that needs to be referenced. The browser can trigger the encapsulation method of calling JSAPI. These methods are processed accordingly according to different environments, such as WeChat browser environment and ordinary browser environment. The browser environment is processed according to the WeChat applet development document. The WeChat applet is processed accordingly. The APP environment interacts with the native method in a unified way through javascriptbridge through the JSSDK method (that is, PiccJsAPI.js calls the JSSDK encapsulated method to trigger the APP native application, and the APP native application JSSDK calls back the function mounted on the window object by PiccJsAPI.js to trigger the corresponding callback function, thereby achieving the interaction between JSAPI and JSSDK).

[0060] Step 202: configure in the target native application a first function for pre-initializing WebView, a second function for calling an H5 resource package corresponding to an application function of an H5 page saved in the target native application, and a third function for calling image data in an H5 resource package cached in WebView.

[0061] When configuring the first function for pre-initializing the WebView in the target native application in step 202, the configuration may include but is not limited to the following:

[0062] Step 11: Determine the WebView being displayed by the target native application and the WebView to be loaded corresponding to the WebView being displayed.

[0063] Step 12: Select at least one target WebView that meets the pre-loading conditions from the WebViews to be loaded.

[0064] Step 13: Pre-initialize the target WebView into the target native application.

[0065] Specifically, the process of executing step 11 to step 13 may include the following examples, but is not limited thereto:

[0066] When the APP is opened, the browser kernel is not initialized by default; the basic framework of WebView is created only when a WebView instance is created. Therefore, WebView is different from a browser. You can directly load the content by entering a URL in the browser, but the first step to open WebView in the APP is not to establish a connection, but to start the browser kernel. Specifically, when the project is just started and WebView has not been opened, a global singleton WebView is initialized when the APP is just started, and the same WebView is reused to open specific pages; each time the WebView is opened, if it has not been opened before, the current WebView is saved in the memory and directly retrieved for use the next time it is opened.

[0067] When configuring the second function of the H5 resource package corresponding to the application function of the H5 page saved in the target native application in step 202, the following contents may be included but not limited to:

[0068] Step 21: Detect the H5 resource package saved in the target native application and the target H5 resource package in the H5 page. If it is determined that the H5 resource package saved in the target native application is the same version as the target H5 resource package, call the H5 resource package saved in the target native application.

[0069] Step 22: When it is determined that the H5 resource package saved in the target native application is different from the target H5 resource package version, if it is determined that the target native application supports access to storage, the target H5 resource package is downloaded to the target native application, and the target H5 resource package downloaded in the target native application is called.

[0070] Specifically, the process of executing step 21 to step 22 may include the following examples, but is not limited thereto: Figure 6 As shown, including:

[0071] After opening the APP, enter the splash screen page. After obtaining the server hot update package information, jump to the WebViewactivity, compare the server hot update package with the local server resource version number, and load the local resource if the server hot update package and the local server resource version number are consistent. If the server hot update package and the local server resource version number are inconsistent, further determine whether the server hot update package requires a forced update.

[0072] Furthermore, if a forced update is required, it is determined whether the overheat update download is enabled on the settings page. If it is enabled, the overheat update download process is entered; if it is not enabled, the online web page is loaded.

[0073] Correspondingly, if forced update is not required, determine whether local resources can be loaded first. If not, determine whether overheat update download is enabled on the settings page. If it is enabled, enter the overheat update download process. If not, load the online web page.

[0074] Furthermore, if local resources can be loaded first, it is determined whether the overheat update download is turned on in the settings page. If it is turned on, the overheat update download process is entered; if it is not turned on, the online web page is loaded.

[0075] It should be noted that if the local H5 resource package of the APP (such as vue.js) is consistent with the server, it can reduce dependence on the server and reduce network latency. The advantage of the APP loading the H5 resource package locally is that it can have a faster rendering speed. Vue.js uses local rendering, which can reduce dependence on the server and reduce network latency, thereby achieving faster page rendering speed; it brings a better user experience, and users do not need to wait for all JavaScript to be downloaded and parsed before they can see the content, which makes the page load faster and users can see the initial content of the page faster; applications built with vue.js can be more easily cached by web browsers, allowing applications to run without a network connection; with less server load, vue.js can reduce the number of requests to the server, and the server load is lower.

[0076] Furthermore, the specific implementation method of the comparison is to call the interface on the splash screen page when the APP is started or load the file provided by the front end, obtain the latest version, and compare it with the local version to determine whether to use the server address or local resources.

[0077] When configuring the third function for calling the image data in the H5 resource package cached in the WebView in the target native application in step 202, the following may be included but not limited to:

[0078] Step 31: If it is determined that the target native application does not support access to storage, the target H5 resource package in the H5 page is called, and the image data contained in the target H5 resource package is cached in the WebView.

[0079] Step 32: In response to detecting that the target native application calls the target H5 resource package in the H5 page again, the image data cached in the WebView and the data other than the image data corresponding to the target H5 resource package in the H5 page are called.

[0080] Specifically, the process of executing step 31 to step 32 may include the following examples, but is not limited thereto: Figure 7 As shown, including:

[0081] When loading a remote link, determine whether there is a cached resource locally. If there is, use the local resource; if not, use the remote resource. Specifically, after the application is upgraded, the backend returns the client version number through the interface. If the version number is different from the previous version number, clear the local cache directly, load the remote resource, and cache it locally. Since the interfaces in the project all use POST requests and the interfaces need to maintain real-time performance, the data of POST requests is not intercepted. Each POST request needs to go to the normal request interface to load new data.

[0082] Compared with the current existing technology, this embodiment introduces JSAPI in the H5 page and JSSDK in the target native application, and integrates the H5 page in the target native application based on WebView and JSBridge, so as to quickly build a new mobile application, invest H5-end development resources in the construction process, reduce the investment of development resources of multiple technology stacks, and effectively reduce development costs; according to the predetermined native application debugging package, the functional adaptability of the target native application integrated with the H5 page in multiple different operating system platforms is adjusted in the H5 page; when it is determined that the target native application functions in multiple different operating system platforms meet the predetermined adaptation conditions, the development of the target native application is completed, which can reduce the number of native application releases, so that the H5-end function page can be directly effective in the native application after it is developed and launched, and a full-process debugging tool for integrating the H5 page into the native application can be provided, which supports the full life cycle management from development, debugging, release, management to operation, improves development efficiency, and maintains an operating experience close to that of the native application.

[0083] Further, as Figure 1 to Figure 2 The specific implementation of the method shown in the embodiment provides a native application development device, such as Figure 8 As shown, the device includes: an acquisition module 31, a configuration module 32, an adjustment module 33, and a development module 34.

[0084] The acquisition module 31 is configured to acquire the JSAPI including the JSBridge and the JSSDK including the JSBridge and a predetermined native application debugging package in response to developing the target native application on multiple different operating system platforms;

[0085] The configuration module 32 is configured to introduce the JSAPI into the H5 page, and introduce the JSSDK into the target native application, and integrate the H5 page into the target native application through WebView and the JSBridge;

[0086] The adjustment module 33 is configured to adjust the functional adaptability of the target native applications integrated with the H5 page in the multiple different operating system platforms in the H5 page according to the predetermined native application debugging package;

[0087] The development module 34 is configured to complete the development of the target native application when it is determined that the target native application functions in the multiple different operating system platforms all meet the predetermined adaptation conditions.

[0088] In some examples of this embodiment, the configuration module 32 is specifically configured to establish two-way data communication between the H5 page and the target native application based on WebView and the JSBridge, and the two-way data communication is used for mutual function calls between the H5 page and the target native application; in the target native application, a first function for pre-initializing the WebView, a second function for calling the H5 resource package corresponding to the application function of the H5 page saved in the target native application, and a third function for calling the image data in the H5 resource package cached in the WebView is configured.

[0089] In some examples of this embodiment, the configuration module 32 is further configured to perform a function call on the target native application for the H5 page, control the WebView to load the H5 page through the JSBridge, and determine the first function call information corresponding to the H5 page; perform format conversion on the first function call information through the JSAPI in the H5 page to obtain the first function call information, and send the second function call information to the WebView; send the second function call information to the target native application through the WebView; identify the second function call information based on the JSSDK in the target native application, and trigger the target native application to provide the corresponding function to the H5 page according to the second function call information.

[0090] In some examples of this embodiment, the configuration module 32 is further configured to call a function call to the target native application with respect to the target native application, and in response to detecting injection of object information into the target native application, send the injected object information to the WebView through the JSBridge; and control the WebView to send the second function call information to the target native application based on the JSBridge.

[0091] In some examples of this embodiment, the configuration module 32 is further configured to determine the WebView being displayed by the target native application and the WebView to be loaded corresponding to the WebView being displayed; select at least one target WebView that meets the preloading condition from the WebView to be loaded; and pre-initialize the target WebView into the target native application.

[0092] In some examples of this embodiment, the configuration module 32 is specifically configured to detect the H5 resource package saved in the target native application and the target H5 resource package in the H5 page, and when it is determined that the H5 resource package saved in the target native application is the same version as the target H5 resource package, call the H5 resource package saved in the target native application; when it is determined that the H5 resource package saved in the target native application is not the same version as the target H5 resource package, if it is determined that the target native application supports access to storage, the target H5 resource package is downloaded to the target native application, and the target H5 resource package downloaded in the target native application is called.

[0093] In some examples of this embodiment, the configuration module 32 is further configured to call the target H5 resource package in the H5 page and cache the image data contained in the target H5 resource package in the WebView if it is determined that the target native application does not support access to storage; in response to detecting that the target native application calls the target H5 resource package in the H5 page again, call the image data cached in the WebView and the data corresponding to the target H5 resource package in the H5 page except the image data.

[0094] It should be noted that for other corresponding descriptions of the functional units involved in the native application development device provided in this embodiment, please refer to Figure 1 and Figure 2 The corresponding description in will not be repeated here.

[0095] Based on the above Figure 1 to Figure 2 The method shown in the embodiment also provides a computer-readable storage medium on which a computer program is stored. When the computer program is executed by a processor, the above-mentioned Figure 1 to Figure 2 The method shown.

[0096] Based on this understanding, the technical solution of the present application can be embodied in the form of a software product, which can be stored in a non-volatile storage medium (which can be a CD-ROM, USB flash drive, mobile hard disk, etc.), including a number of instructions for enabling a computer device (which can be a personal computer, server, or network device, etc.) to execute the methods of various implementation scenarios of the present application.

[0097] Based on the above Figure 1 to Figure 2 The method shown, and Figure 8 In order to achieve the above-mentioned purpose, the embodiment of the present application also provides an electronic device, such as a personal computer, a server, a laptop computer, an intelligent robot or other intelligent terminal, which includes a storage medium and a processor; the storage medium is used to store a computer program; the processor is used to execute the computer program to achieve the above-mentioned Figure 1 to Figure 2 The method shown.

[0098] Optionally, the above-mentioned physical device may also include a user interface, a network interface, a camera, a radio frequency (RF) circuit, a sensor, an audio circuit, a WI-FI module, etc. The user interface may include a display, an input unit such as a keyboard, etc., and the optional user interface may also include a USB interface, a card reader interface, etc. The network interface may optionally include a standard wired interface, a wireless interface (such as a WI-FI interface), etc.

[0099] Those skilled in the art will appreciate that the above-mentioned physical device structure provided in this embodiment does not constitute a limitation on the physical device, and may include more or fewer components, or a combination of certain components, or different arrangements of components.

[0100] The storage medium may also include an operating system and a network communication module. The operating system is a program that manages the hardware and software resources of the above-mentioned physical device, and supports the operation of the information processing program and other software and / or programs. The network communication module is used to realize the communication between the components inside the storage medium, and the communication with other hardware and software in the information processing physical device.

[0101] Based on the above Figure 1 to Figure 2 The method shown, and Figure 8 The virtual device embodiment shown in the embodiment further provides a chip, including one or more interface circuits and one or more processors; the interface circuit is used to receive a signal from a memory of an electronic device and send the signal to the processor, the signal including a computer instruction stored in the memory; when the processor executes the computer instruction, the electronic device executes the above-mentioned Figure 1 to Figure 2 The method shown.

[0102] Through the description of the above implementation methods, technical personnel in this field can clearly understand that compared with the current existing technology, this embodiment introduces JSAPI in the H5 page and introduces JSSDK in the target native application, and integrates the H5 page in the target native application based on WebView and JSBridge, so as to quickly build a new mobile application, invest H5-end development resources in the construction process, reduce the investment of development resources of multiple technology stacks, and effectively reduce development costs; according to the predetermined native application debugging package, the functional adaptability of the target native application integrated with the H5 page in multiple different operating system platforms is adjusted in the H5 page; when it is determined that the target native application functions in multiple different operating system platforms meet the predetermined adaptation conditions, the development of the target native application is completed, which can reduce the number of native application releases, so that the H5-end function page can be directly effective in the native application after it is developed and launched, and a full-process debugging tool for integrating the H5 page into the native application can be provided, which supports the full life cycle management from development, debugging, publishing, management to operation, improves development efficiency, and maintains an operating experience close to that of the native application.

[0103] It should be noted that, in this article, relational terms such as "first" and "second" are only used 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. Moreover, 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 further restrictions, the elements defined by the sentence "comprise a ..." do not exclude the existence of other identical elements in the process, method, article or device including the elements.

[0104] The above is only a specific implementation of the present application, so that those skilled in the art can understand or implement the present application. Various modifications to these embodiments will be apparent to those skilled in the art, and the general principles defined herein can be implemented in other embodiments without departing from the spirit or scope of the present application. Therefore, the present application will not be limited to the embodiments described herein, but will conform to the widest scope consistent with the principles and novel features applied for herein.

Claims

1. A method for developing a native application, characterized in that: include: In response to developing a target native application on a plurality of different operating system platforms, obtaining a JavaScript application program interface JSAPI including a JavaScript bridge JSBridge, and a JavaScript software development kit JSSDK including the JSBridge and a predetermined native application debugging package; Introducing the JSAPI into the fifth edition H5 page of Hypertext Markup Language, and introducing the JSSDK into the target native application, and integrating the H5 page into the target native application based on the web view WebView and the JSBridge; According to the predetermined native application debugging package, functional adaptability adjustment is performed on the H5 page for the target native applications integrated with the H5 page in the multiple different operating system platforms respectively; When it is determined that the target native application functions in the multiple different operating system platforms all meet the predetermined adaptation conditions, the development of the target native application is completed.

2. The method according to claim 1, characterized in that The step of integrating the H5 page into the target native application based on WebView and JSBridge includes: Based on WebView and the JSBridge, two-way data communication is established between the H5 page and the target native application, and the two-way data communication is used for mutual function calls between the H5 page and the target native application; In the target native application, a first function is configured for pre-initializing the WebView, a second function is configured for calling the H5 resource package corresponding to the application function of the H5 page saved in the target native application, and a third function is configured for calling the image data in the H5 resource package cached in the WebView.

3. The method according to claim 2, characterized in that The method of establishing two-way data communication between the H5 page and the target native application based on the WebView and the JSBridge includes: In the process of calling the function of the target native application by the H5 page, controlling the WebView to load the H5 page through the JSBridge, and determining the first function call information corresponding to the H5 page; In the H5 page, the first function call information is formatted by using the JSAPI to obtain the first function call information, and the second function call information is sent to the WebView; Sending the second function call information to the target native application through the WebView; The second function call information is identified in the target native application based on the JSSDK, and the target native application is triggered to provide the corresponding function to the H5 page according to the second function call information.

4. The method according to claim 3, characterized in that The method of establishing two-way data communication between the H5 page and the target native application based on the WebView and the JSBridge further includes: In response to detecting the injection of object information into the target native application, the target native application calls the function of the target native application, and sends the injection object information to the WebView through the JSBridge; Control the WebView to send the second function call information to the target native application based on the JSBridge.

5. The method according to claim 2, characterized in that: Configuring a first function for pre-initializing the WebView in the target native application includes: Determine the WebView being displayed by the target native application and the WebView to be loaded corresponding to the WebView being displayed; Select at least one target WebView that meets the pre-loading condition from the WebView to be loaded; Initialize the target WebView into the target native application in advance.

6. The method according to claim 5, characterized in that Configuring in the target native application a second function for calling an H5 resource package corresponding to an application function of the H5 page saved in the target native application includes: Detecting the H5 resource package saved in the target native application and the target H5 resource package in the H5 page, and when it is determined that the H5 resource package saved in the target native application is the same version as the target H5 resource package, calling the H5 resource package saved in the target native application; When it is determined that the H5 resource package saved in the target native application is different from the target H5 resource package version, if it is determined that the target native application supports access to storage, the target H5 resource package is downloaded to the target native application, and the target H5 resource package downloaded in the target native application is called.

7. The method according to claim 6, characterized in that The third function for calling the image data in the H5 resource package cached in the WebView is configured in the target native application, including: If it is determined that the target native application does not support access to storage, the target H5 resource package in the H5 page is called, and the image data contained in the target H5 resource package is cached in the WebView; In response to detecting that the target native application calls the target H5 resource bundle in the H5 page again, the image data cached in the WebView and data other than the image data corresponding to the target H5 resource bundle in the H5 page are called.

8. A native application development device, characterized in that: include: An acquisition module is configured to acquire a JSAPI including JSBridge and a JSSDK including the JSBridge and a predetermined native application debugging package in response to developing a target native application on a plurality of different operating system platforms; A configuration module is configured to introduce the JSAPI into the H5 page, and introduce the JSSDK into the target native application, and integrate the H5 page into the target native application based on WebView and the JSBridge; an adjustment module configured to perform functional adaptability adjustment on the target native applications integrated with the H5 page in the multiple different operating system platforms in the H5 page according to the predetermined native application debugging package; The development module is configured to complete the development of the target native application when it is determined that the target native application functions in the multiple different operating system platforms all meet the predetermined adaptation conditions.

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

10. An electronic device comprising a storage medium, a processor, and a computer program stored in the storage medium and executable on the processor, characterized in that When the processor executes the computer program, the method according to any one of claims 1 to 7 is implemented.

Images