Cross-platform adaptation method and related device

Abstract

The embodiment of the invention provides a cross-platform adaptation method and a related device, and relates to the technical field of computers, and the method comprises the following steps: obtaining a deployment platform of an initial service code; the initial business code is a code constructed based on a unified development framework; the unified development framework comprises a unit-app basic framework and a Vue development language; performing conditional compiling on the initial service code based on a deployment platform to obtain a target code package; and deploying the target code package on the deployment platform. According to the method, platform difference codes are isolated through a unified framework and a conditional compiling mechanism, adaptive logic is dynamically selected during compiling, and the code reuse rate is remarkably increased. The problem that independent codes are written for each platform in traditional development is solved, cross-platform development efficiency and maintenance flexibility are remarkably improved, and development cost is effectively reduced.

Description

Technical Field

[0001] This application relates to the technical field, and more particularly to a cross-platform adaptation method and related apparatus. Background Technology

[0002] Enterprises need to deploy the same or similar functions on multiple platforms (such as H5, mini-programs, native applications, etc.), and also need to support multiple different clients to embed the application through WebView.

[0003] Traditional development methods require writing separate code for each platform and client, resulting in high development costs, maintenance difficulties, and code duplication. Summary of the Invention

[0004] This application provides a cross-platform adaptation method and related apparatus to address the issues of high development costs, maintenance difficulties, and code duplication.

[0005] In a first aspect, embodiments of this application provide a cross-platform adaptation method, including:

[0006] The deployment platform for the initial business code is obtained; the initial business code is code built based on a unified development framework; the unified development framework includes the uni-app basic framework and the Vue development language;

[0007] Based on the deployment platform, the initial business code is conditionally compiled to obtain the target code package;

[0008] Deploy the target code package on the deployment platform.

[0009] In some embodiments, the conditional compilation of the initial business code based on the deployment platform to obtain the target code package includes:

[0010] Based on the deployment platform, non-target code segments are removed from the initial business code to obtain an initial code package; the non-target code segments are code segments in the initial business code that are not effective on the deployment platform.

[0011] Based on the deployment platform, obtain the first configuration parameters of the deployment platform;

[0012] The first configuration parameter is injected into the initial code package to obtain the target code package.

[0013] In some embodiments, the method further includes:

[0014] Obtain the client identifier of the target code package on the deployment platform;

[0015] Based on the client identifier, the second configuration parameters of the client are obtained, and the client is adapted for business purposes based on the second configuration parameters.

[0016] In some embodiments, obtaining the client identifier of the target code package on the deployment platform includes:

[0017] Read the client identifier from the Uniform Resource Locator (URL) parameter of the client's startup entry point; or,

[0018] Based on a predefined bridging channel, the client identifier is obtained from the client; or...

[0019] The client identifier is determined based on the string characteristics of the client.

[0020] In some embodiments, the method further includes:

[0021] If the client identifier is not obtained, the third configuration parameter corresponding to the predefined identifier is obtained, and the client is adapted for business based on the third configuration parameter.

[0022] In some embodiments, the method further includes:

[0023] Obtain the WebView environment of the target code package;

[0024] Based on the WebView environment, a communication strategy is determined with the WebView container; the communication strategy includes JS bridge, Flutter WebView plugin, message push interface and standard page navigation.

[0025] In some embodiments, the method further includes:

[0026] Based on the unified lifecycle hooks of the uni-app framework, the lifecycle events of the target code package on different deployment platforms are encapsulated and standardized to enable the target code package to synchronize its state across different deployment platforms.

[0027] In some embodiments, the method further includes:

[0028] Based on the deployment platform and the client identifier, the target adapters corresponding to the deployment platform and the client are determined from a preset adapter set;

[0029] Data interaction is performed based on the target adapter.

[0030] Secondly, embodiments of this application provide a cross-platform adaptation device, including:

[0031] The acquisition module is used to acquire the deployment platform of the initial business code; the initial business code is code built based on a unified development framework; the unified development framework includes the uni-app basic framework and the Vue development language;

[0032] The processing module is used to perform conditional compilation on the initial business code based on the deployment platform to obtain the target code package;

[0033] The deployment module is used to deploy the target code package on the deployment platform.

[0034] Thirdly, this application provides an electronic device, including: a memory and a processor;

[0035] The memory is used to store computer instructions; the processor is used to execute the computer instructions stored in the memory to implement the method of any one of the first aspects.

[0036] Fourthly, this application provides a computer-readable storage medium having a computer program stored thereon, the computer program being executed by a processor to implement the method of any of the first aspects.

[0037] Fifthly, this application provides a computer program product, including a computer program that, when executed by a processor, implements the method of any one of the first aspects.

[0038] The cross-platform adaptation method and related apparatus provided in this application involve obtaining the deployment platform of the initial business code; the initial business code is code built based on a unified development framework; the unified development framework includes the uni-app basic framework and the Vue development language; conditionally compiling the initial business code based on the deployment platform to obtain a target code package; and deploying the target code package on the deployment platform. This method, through a unified framework and conditional compilation mechanism, isolates platform-differentiated code, dynamically selects adaptation logic during compilation, and significantly improves code reusability. It solves the problem of writing independent code for each platform in traditional development, significantly improves cross-platform development efficiency and maintenance flexibility, and effectively reduces development costs. Attached Figure Description

[0039] Figure 1 A flowchart illustrating a cross-platform adaptation method provided in this application embodiment. Figure 1 ;

[0040] Figure 2 A flowchart illustrating a cross-platform adaptation method provided in this application embodiment. Figure 2 ;

[0041] Figure 3 A flowchart illustrating a cross-platform adaptation method provided in this application embodiment. Figure 3 ;

[0042] Figure 4 A schematic diagram of a cross-platform adaptation device provided in this application embodiment;

[0043] Figure 5 This is a schematic diagram of the structure of an electronic device provided in an embodiment of this application. Detailed Implementation

[0044] To make the objectives, technical solutions, and advantages of the embodiments of this application clearer, the technical solutions of the embodiments of this application will be clearly and completely described below with reference to the accompanying drawings. Obviously, the described embodiments are only some embodiments of this application, not all embodiments. Based on the embodiments of this application, all other embodiments obtained by those skilled in the art without creative effort are within the scope of protection of this application.

[0045] In the embodiments of this application, the terms "first" and "second" are used to distinguish identical or similar items with essentially the same function and effect, without limiting their order. Those skilled in the art will understand that the terms "first" and "second" do not limit the quantity or execution order, and that the terms "first" and "second" do not necessarily imply that they are different.

[0046] It should be noted that, in the embodiments of this application, the terms "exemplary" or "for example" are used to indicate examples, illustrations, or descriptions. Any embodiment or design scheme described as "exemplary" or "for example" in this application should not be construed as being more preferred or advantageous than other embodiments or design schemes. Specifically, the use of terms such as "exemplary" or "for example" is intended to present the relevant concepts in a specific manner.

[0047] With the rapid development of mobile internet and web technologies, enterprises are increasingly demanding cross-platform application development.

[0048] Currently, businesses need to deploy the same or similar functionalities across multiple platforms (such as H5, WeChat Mini Programs, native apps, Flutter applications, etc.), while also supporting multiple different clients embedding applications through WebView. For example, an e-commerce platform might need to embed product pages in a WeChat Mini Program, embed a user center module in a native application (APP), and even load functional modules in a WebView on a third-party platform.

[0049] In existing technologies, development teams need to write independent code for each platform and client, resulting in high code duplication and significantly increased maintenance costs. Meanwhile, differences in application programming interfaces (APIs), user interfaces (UIs), and business logic distribution across different platforms require substantial manpower for adaptation, leading to low development efficiency. Furthermore, the diversity of WebView environments further exacerbates the complexity of adaptation.

[0050] To address the aforementioned issues, this application provides a cross-platform adaptation method and related apparatus. By using a unified development framework as a foundation, combining conditional compilation mechanisms to handle platform differences, dynamically identifying client identifiers, and encapsulating cross-platform communication logic, it solves problems such as low code reusability, high maintenance costs, and complex WebView adaptation in cross-platform development.

[0051] The technical solution of this application and how the technical solution of this application solves the above-mentioned technical problems are described in detail below with specific embodiments. These specific embodiments can be combined with each other, and the same or similar concepts or processes may not be described again in some embodiments. The embodiments of this application will now be described with reference to the accompanying drawings.

[0052] Figure 1 This is a flowchart illustrating a cross-platform adaptation method provided in an embodiment of this application, as shown below. Figure 1 As shown, it includes:

[0053] S101, Deployment platform for obtaining initial business code;

[0054] In some embodiments, the initial business code is code built on a unified development framework; the unified development framework includes the uni-app basic framework and the Vue development language.

[0055] For example, a unified development framework can use uni-app as the basic framework and Vue development language (also known as Vue.js) as the core development language.

[0056] Vue.js is a progressive JavaScript framework for building user interfaces. It adopts a component-based development model and simplifies the complexity of front-end development through declarative rendering and reactive data binding.

[0057] uni-app is a cross-platform development framework that uses Vue.js to develop all front-end applications. Developers write a single codebase and can deploy it to multiple platforms, including iOS, Android, Web, and various mini-programs and quick apps.

[0058] In some embodiments, the deployment platform may refer to the platform on which the initial business code needs to run. For example, H5, mini-programs, Web, etc.

[0059] In some embodiments, developers set an environment variable named UNI_PLATFORM using a command-line tool or integrated development environment (IDE) to indicate the deployment platform of the initial business code. When processing the initial business code, the deployment platform can be read from the environment variable.

[0060] S102. Based on the deployment platform, perform conditional compilation on the initial business code to obtain the target code package.

[0061] In some embodiments, the initial business code can be conditionally compiled based on comments in the initial business code to obtain the target code package.

[0062] For example, based on the deployment platform, non-target code segments are removed from the initial business code to obtain the initial code package; the non-target code segments are code segments in the initial business code that are not effective on the deployment platform; the first configuration parameters of the deployment platform are obtained based on the deployment platform; the first configuration parameters are injected into the initial code package to obtain the target code package.

[0063] For example, when developers build the initial business code, they can use special comment syntax to mark code segments that only work on a certain platform (such as H5 or mini-programs).

[0064] When processing the initial business logic code, based on a defined deployment platform, code segments that are not effective on that platform can be removed to obtain the initial code package corresponding to that platform. For example, if business logic needs to be deployed in H5, code segments in the initial business logic code that only apply to mini-programs can be removed.

[0065] In some embodiments, different platforms also have different deployment configuration requirements (such as icon, application name style, etc.). When deploying the code, the configuration parameters of the corresponding platform also need to be written into the code package.

[0066] Once the deployment platform is determined, the corresponding configuration parameters can be obtained from the predefined configuration parameter file based on the deployment platform.

[0067] For example, in the manifest.json configuration file, each platform independently configures its unique metadata and permissions, such as the AppID of the mini-program, the page title of the H5 page, and the icon and launch image of the native app. In the pages.json configuration file, the routing paths, window styles, navigation bar styles, etc. of all pages are managed uniformly.

[0068] In some embodiments, a process for conditionally compiling the initial business code can be executed based on predefined script commands.

[0069] For example, the package.json file predefines a series of build script commands (such as npm runbuild:h5). Executing these commands triggers the uni-app compilation process. The compiler can read the above configuration and source code, combine them with the current UNI_PLATFORM, perform code transformation, resource adaptation and final packaging, and output the target code package for the corresponding platform (such as the static file directory of H5, the code package of mini-program, etc.).

[0070] S103. Deploy the target code package on the deployment platform.

[0071] In some embodiments, after obtaining the target code package, the target code package can be published to the corresponding deployment platform.

[0072] For example, for H5 pages, the packaged static resources can be deployed to a web server. For mini-programs, the packaged files can be uploaded to the mini-program platform. For apps, the target code package can be packaged into an installation package and distributed to various app stores or installed directly.

[0073] The cross-platform adaptation method provided in this application obtains the deployment platform of the initial business code; the initial business code is code built based on a unified development framework; the unified development framework includes the uni-app basic framework and the Vue development language; conditional compilation is performed on the initial business code based on the deployment platform to obtain the target code package; the target code package is deployed on the deployment platform. The above method, through a unified framework and conditional compilation mechanism, isolates platform-differentiated code, dynamically selects adaptation logic during compilation, and significantly improves code reusability. It solves the problem of writing independent code for each platform in traditional development, significantly improves cross-platform development efficiency and maintenance flexibility, and effectively reduces development costs.

[0074] The following is combined Figure 2 The cross-platform adaptation method provided in the embodiments of this application will be further explained.

[0075] Figure 2 A flowchart illustrating a cross-platform adaptation method provided in this application embodiment. Figure 2 ,like Figure 2 As shown, it includes:

[0076] S201. Obtain the client identifier of the target code package on the deployment platform.

[0077] In some embodiments, the ClientID can indicate the specific client version on which the target code package is running. For example, application A-V1, application B-V2, etc.

[0078] In some embodiments, the client identifier can be obtained in the following ways.

[0079] In one possible implementation, the client identifier can be read from the Uniform Resource Locator (URL) parameter of the client's startup entry point.

[0080] For example, when the client (application) runs, a specific query parameter (e.g., c_id) must be included in the URL link during the initial load to pass the client identifier (e.g., partner_a_appv2). Upon application startup, an initialization function (e.g., Utils.getRequestParams(location.search)) is executed immediately, which parses the current page's URL and extracts the value of the c_id parameter.

[0081] In one possible implementation, the client identifier can be obtained from the client based on a predefined bridging channel.

[0082] For example, the ClientID can be obtained from the native side through the WebView's JavaScript bridge (such as JSBridge.getClientInfo).

[0083] In one possible implementation, the client identifier can be determined based on the client's string characteristics.

[0084] For example, by parsing the browser's User-Agent string and matching it with predefined client characteristics, the identifier of the matched client can be used as its ClientID.

[0085] Optionally, the ClientID used last time can also be read from localStorage.

[0086] Optionally, the priority of reading ClientID from URL, obtaining ClientID from the native side, and determining ClientID by parsing string features decreases in that order.

[0087] Optionally, after obtaining the client identifier, security verification can be performed on the client identifier, such as format verification, length verification, and blacklist filtering of the client identifier to prevent malicious injection.

[0088] In some embodiments, the obtained client identifier is immediately stored in a specific module of the Vuex central state manager, making it a globally accessible reactive variable that can be used by any component or module of the entire application as the basis for all adaptation logic decisions.

[0089] S202. Obtain the second configuration parameters of the client based on the client identifier, and perform business adaptation on the client based on the second configuration parameters.

[0090] In some embodiments, the target code package may have different requirements when running on different clients. For example, when the same H5 page is embedded in different partner apps, there will be different requirements in terms of display interface, business processing logic, etc.

[0091] After determining the client identifier, a second configuration parameter can be obtained from a predefined configuration file (library). This second configuration parameter indicates the client's business processing requirements.

[0092] For example, the client's business processing requirements may include the following possible types:

[0093] 1. API Request Identifier Adaptation: Before initiating a network request, the ClientID is read from Vuex and automatically added to the HTTP request header (e.g., X-Client-ID). The backend service uses this identifier to distinguish the request source, perform permission verification, data isolation, or return customized data.

[0094] 2. Business Logic Branches: In key business functions, different logic branches are executed based on the value of ClientID. For example, a specific marketing campaign might be displayed to "Client A," while it is hidden from "Client B."

[0095] 3. UI adaptation: Based on the ClientID, dynamically calculate style class names or show / hide certain UI elements in Vue components to adapt to different client brand styles or functional requirements.

[0096] 4. Data Statistics and Analysis: When reporting user behavior or business data, ClientID is attached as a key dimension to facilitate subsequent refined data analysis based on client source.

[0097] S203. If the client identifier is not obtained, the third configuration parameter corresponding to the predefined identifier is obtained, and the client is adapted for business based on the third configuration parameter.

[0098] In some embodiments, if a corresponding client identifier is not obtained, a predefined client identifier (such as the default ClientID) can be used, and the third configuration parameter corresponding to the predefined client identifier can be obtained. After obtaining the third configuration parameter, the client can be adapted for business applications based on the third configuration parameter. This ensures that the client can run in basic mode even when parameters are missing.

[0099] The cross-platform adaptation method provided in this application obtains the client identifier of the target code package on the deployment platform; based on the client identifier, it obtains the client's second configuration parameters and performs business adaptation on the client based on the second configuration parameters; if the client identifier is not obtained, it obtains the third configuration parameters corresponding to the predefined identifier and performs business adaptation on the client based on the third configuration parameters. This method achieves flexible support for multiple clients using the same code package through dynamic acquisition and adaptation of the client identifier. The combination of runtime parameters and preset configurations enables the system to automatically adapt to client requirements according to the actual deployment environment without recompiling the code, significantly improving the reusability of the code package and the client's scalability, reducing the maintenance cost of multi-client adaptation, and enabling rapid response to changes in business requirements.

[0100] In some embodiments, the target code package may be loaded into various WebView containers during runtime. Different clients use completely different WebView technology stacks, and the application corresponding to the target code package is not an isolated webpage; it needs to work deeply with the host client to provide a service comparable to native performance. Therefore, multi-client adaptation of WebView is necessary. The following section combines... Figure 3 This section explains the process of adapting WebView to multiple clients.

[0101] The following is combined Figure 3 The cross-platform adaptation method provided in the embodiments of this application will be further explained.

[0102] Figure 3 A flowchart illustrating a cross-platform adaptation method provided in this application embodiment. Figure 3 ,like Figure 3 As shown, it includes:

[0103] S301. Obtain the WebView environment of the target code package.

[0104] In some embodiments, the WebView environment can refer to a browser component environment built into a mobile application (such as an Android or iOS application) or a desktop application. It allows developers to display web page content directly within the application without navigating to an external browser.

[0105] For example, when an application starts up, it can determine whether it is embedded in a specific WebView by checking whether a specific property (such as a WebKit bridge object, jsBridge, or an object injected by Flutter) exists under the window object, thus determining the corresponding WebView environment.

[0106] S302. Determine the communication strategy with the WebView container based on the WebView environment; the communication strategy includes JS bridge, Flutter WebView plugin, message push interface and standard page navigation.

[0107] Among them, jsBridge refers to the bridge between the native App and WebView that enables communication through the JavaScript interface, such as calling the payment function of the native App.

[0108] The Flutter WebView plugin (flutter_inappwebview) refers to a component in the Flutter framework used to embed a WebView, which supports communication with the host app via messageChannel.

[0109] The message push interface (postMessage) can refer to the communication interface provided in the web-view component of a mini-program.

[0110] In some embodiments, when determining the corresponding WebView environment, the corresponding communication strategy can be determined based on the mapping relationship between the WebView environment and the communication strategy.

[0111] For example, if a WebView from a native app (such as Android / iOS) is detected, the methods provided by the jsBridge object injected by that environment are called to achieve asynchronous communication with the native application.

[0112] If a WebView of a Flutter application is detected, communication is conducted using the communication channel provided by the flutter_inappwebview plugin.

[0113] If it is within the web-view component of the mini-program, communication is conducted through the postMessage interface provided by the mini-program.

[0114] If none of the above environments are detected, it is determined that the program is running in a regular browser or an H5 standalone page. In this case, the program will be downgraded to use standard Web APIs (such as window.location redirection) for operation.

[0115] Optionally, when adapting WebView to multiple clients, the context information of the host app (API address, key, version, etc.) can be injected through URL parameters, so that the application in WebView is no longer an "island" and can be deeply integrated with the host.

[0116] The cross-platform adaptation method provided in this application obtains the WebView environment of the target code package; based on the WebView environment, it determines the communication strategy between the target code package and the WebView container; the communication strategy includes JS bridge, Flutter WebView plugin, message push interface, and standard page navigation. Through WebView environment detection and communication method selection, unified adaptation for cross-platform communication is achieved. For example, the same code can call native functions in a native app via jsBridge, and achieve data interaction in a mini-program via web-view's postMessage. This mechanism significantly reduces the development complexity of WebView communication and improves the cross-platform compatibility of the code package.

[0117] In some embodiments, the lifecycle events of applications and pages are triggered by different native systems on different platforms (mini-programs, H5, Apps) and different client WebViews, and their triggering timing, order, parameters and availability vary significantly.

[0118] For example, mini-programs have onLaunch and onShow, while H5 does not have a standard "application launch" concept; the behavior of an app's WebView switching from the foreground to the background is also different from that of a browser tab.

[0119] To reduce the complexity of lifecycle management for each platform and allow developers to focus on business logic without having to write different lifecycle code for each platform, the cross-platform adaptation method provided in this application also includes unified lifecycle management of the target code package on different platforms.

[0120] For example, based on the unified lifecycle hooks of the uni-app framework, the lifecycle events of the target code package on different deployment platforms are encapsulated and standardized to enable the target code package to synchronize its state across different deployment platforms.

[0121] For example, when uni-app is compiled for each platform, its runtime embeds listener code for the platform's native lifecycle events. In mini-programs, it listens for events like `onLaunch`, `onShow`, and `onHide` of the app, and `onLoad`, `onShow`, `onReady`, and `onUnload` of the page. In HTML5, it listens for events like `DOM Content Loaded`, `window.load`, `pageshow`, and `hashchange` to simulate the application and page lifecycle. In apps, it listens for native events like `plusready`, `pause`, and `resume`.

[0122] After collecting native events, the uni-app runtime maps them to its own defined, unified application lifecycle and page lifecycle events according to preset rules. For example, regardless of whether the underlying event is a mini-program launch, an H5 page initial load, or the app's plusready event, the same onLaunch callback will ultimately be triggered.

[0123] Because startup information from all platforms (mini-program scene values, app startup parameters, and H5 URL parameters) is normalized by uni-app and passed to developers via the `options` parameters of `onLaunch` and `onLoad`, the code for parsing the ClientID from the URL can be written once and run everywhere. Furthermore, since pages cannot directly listen to application-level events (such as when an app switches from the background to the foreground), uni-app provides a global event bus. In `onShow` of `App.vue`, a custom global event (such as `APP_ACTIVE`) can be emitted. All pages or components that need to respond to this state only need to listen for this event in their `onLoad` or `created` hooks.

[0124] In some embodiments, for platform-specific lifecycle requirements that cannot be fully unified, the system allows developers to use conditional compilation to enhance the system based on unified hooks.

[0125] For example, a page might need to specifically listen for the "Share to Moments" event in WeChat Mini Programs, but not on other platforms. Developers can wrap the code listening for the Mini Program-specific `onShareTimeline` event in the script section of that page component using `#ifdef MP-WEIXIN`. The compiler will automatically remove this code when building on non-WeChat Mini Program platforms, maintaining code purity.

[0126] In some embodiments, in order to achieve consistent and reliable results by using the same set of business code and API calling methods without caring about which platform or client the underlying system is running on, the cross-platform adaptation method provided in this application embodiment also includes adapting the application programming interfaces of the platform and the client.

[0127] For example, based on the deployment platform and client identifier, the target adapter corresponding to the deployment platform and client is determined from a preset adapter set; data interaction is performed based on the target adapter.

[0128] First, let's explain the adaptation to the deployment platform.

[0129] For example, there are significant differences in the names, calling methods, parameters, and return values ​​of native APIs (such as network requests, local storage, camera, and geolocation) provided by mini-programs, H5 browsers, Android apps, and iOS apps. A set of JavaScript function interfaces related to business logic can be defined (e.g., common.request(url, data), common.uploadFile(file)). Then, for each target platform (H5, MP-WEIXIN, APP-PLUS), the corresponding adapter is selected from a pre-defined adapter set. Each adapter internally uses the platform's native API to implement the aforementioned abstract interface.

[0130] During the compilation and build phase, the uni-app compiler will only package the adapter code for the corresponding platform into the final output based on the current UNI_PLATFORM.

[0131] The following section explains client-side adaptation.

[0132] Even on the same platform (such as H5), when an application is embedded in different clients (such as the company's main app and partner apps), the required network address, authentication key, and functional permissions may be different.

[0133] During initialization, the client-specific context, such as `api_base_url` (API base address) and `app_secret` (signature key), can be read from the configuration information passed via URL parameters. When making network requests, this context information is automatically applied to the requests (e.g., constructing the complete URL and generating signature headers). Simultaneously, the ClientID can be read from Vuex and appended as a key identifier (such as the X-Client-ID request header) to each network request, enabling backend services to identify the request origin and perform differentiated business processing and data analysis.

[0134] Optionally, when a higher version API is unavailable in a lower version environment or a specific client, the adapter can implement a fallback scheme (for example, automatically switching to the traditional form submission method when the native file upload API is unavailable), and may notify the developer through log prompts.

[0135] In summary, the cross-platform adaptation method provided in this application significantly reduces code redundancy through a unified framework and conditional compilation mechanism, enabling a single codebase to be compiled to platforms such as H5, WeChat Mini Programs, and native apps, thus significantly improving code reusability. The dynamic client identifier adaptation mechanism supports runtime switching of client identifiers, allowing adaptation to different business requirements without code modification. The WebView communication encapsulation and lifecycle management module shields environmental differences, reducing adaptation complexity and improving development efficiency. Ultimately, it can quickly respond to multi-platform deployment and client expansion needs, reducing development costs and maintenance difficulty while ensuring the consistency and stability of cross-platform applications.

[0136] Based on the above embodiments, this application also provides a cross-platform adaptation device.

[0137] Figure 4 This is a schematic diagram of the structure of a cross-platform adaptation device 40 provided in an embodiment of this application, as shown below. Figure 4 As shown, it includes:

[0138] Module 401 is used to obtain the deployment platform for the initial business code; the initial business code is code built based on a unified development framework; the unified development framework includes the uni-app basic framework and the Vue development language.

[0139] Processing module 402 is used to perform conditional compilation of the initial business code based on the deployment platform to obtain the target code package.

[0140] Deployment module 403 is used to deploy the target code package on the deployment platform.

[0141] In some embodiments, the processing module 402 is configured to, based on the deployment platform, remove non-target code segments from the initial business code to obtain an initial code package; the non-target code segments are code segments in the initial business code that are not effective on the deployment platform; obtain the first configuration parameters of the deployment platform based on the deployment platform; and inject the first configuration parameters into the initial code package to obtain a target code package.

[0142] In some embodiments, the processing module 402 is used to obtain the client identifier of the target code package on the deployment platform; obtain the second configuration parameters of the client based on the client identifier; and perform business adaptation on the client based on the second configuration parameters.

[0143] In some embodiments, the processing module 402 is configured to read the client identifier from the Uniform Resource Locator parameter of the client's startup entry; or, obtain the client identifier from the client based on a predefined bridging channel; or, determine the client identifier based on the client's string characteristics.

[0144] In some embodiments, the processing module 402 is configured to obtain a third configuration parameter corresponding to a predefined identifier if the client identifier is not obtained, and perform business adaptation on the client based on the third configuration parameter.

[0145] In some embodiments, the processing module 402 is used to obtain the WebView environment of the target code package; determine the communication strategy with the WebView container based on the WebView environment; the communication strategy includes JS bridge, Flutter WebView plugin, message push interface and standard page jump.

[0146] In some embodiments, the processing module 402 is used to encapsulate and standardize the lifecycle events of the target code package on different deployment platforms based on the unified lifecycle hook of the uni-app framework, so as to enable the target code package to synchronize its state on different deployment platforms.

[0147] In some embodiments, the processing module 402 is configured to determine the target adapter corresponding to the deployment platform and the client from a preset adapter set based on the deployment platform and the client identifier; and to perform data interaction based on the target adapter.

[0148] The cross-platform adaptation device provided in this application embodiment can execute the cross-platform adaptation method of any of the above embodiments. Its principle and technical effect are similar, and will not be described again here.

[0149] This application also provides an electronic device.

[0150] Figure 5 This is a schematic diagram of the structure of the electronic device 50 provided in the embodiments of this application, such as... Figure 5 As shown, the electronic device may include: a transceiver 501, a processor 502, and a memory 503.

[0151] Processor 502 executes computer execution instructions stored in memory, causing processor 502 to perform the scheme in the above embodiments. Processor 502 can be a general-purpose processor, including a central processing unit (CPU), a network processor (NP), etc.; it can also be a digital signal processor (DSP), an application-specific integrated circuit (ASIC), a field-programmable gate array (FPGA), or other programmable logic devices, discrete gate or transistor logic devices, or discrete hardware components.

[0152] The memory 503 is connected to the processor 502 via the system bus and completes communication between them. The memory 503 is used to store computer program instructions.

[0153] Transceiver 501 can perform the functions of receiving and sending data and instructions.

[0154] Optionally, the electronic device 50 may also include a communication interface 504, which allows communication and interaction with external or internal devices via the communication interface 503. External devices may be, for example, client devices (e.g., mobile phones, tablets). In specific implementations, if the communication interface 504, memory 503, and processor 502 are implemented independently, they can be interconnected via a bus to complete communication with each other.

[0155] The system bus can be a Peripheral Component Interconnect (PCI) bus or an Extended Industry Standard Architecture (EISA) bus, etc. The system bus can be divided into address bus, data bus, control bus, etc. For ease of representation, only one thick line is used in the diagram, but this does not indicate that there is only one bus or one type of bus. Transceivers are used to enable communication between database access devices and other computers (e.g., clients, read-write libraries, and read-only libraries). Memory may include random access memory (RAM) and may also include non-volatile memory.

[0156] Optionally, in a specific implementation, if the communication interface 504, memory 503, and processor 502 are integrated on a single chip, then the communication interface 504, memory 503, and processor 502 can communicate through an internal interface.

[0157] This application also provides a chip for executing instructions, which is used to execute the technical solutions of the methods described in the above embodiments.

[0158] This application also provides a computer-readable storage medium storing a computer program thereon. When the computer program is executed by a processor, it implements the technical solution of the above method embodiment. Its implementation principle and technical effect are similar, and will not be repeated here.

[0159] In one possible implementation, a computer-readable medium may include random access memory (RAM), read-only memory (ROM), compact discread-only memory (CD-ROM) or other optical disc storage, disk storage or other magnetic storage devices, or any other medium targeted to carry or to store the required program code in the form of instructions or data structures, and accessible by a computer. Furthermore, any connection is appropriately referred to as a computer-readable medium. For example, if software is transmitted from a website, server, or other remote source using coaxial cable, fiber optic cable, twisted pair, Digital Subscriber Line (DSL), or wireless technologies such as infrared, radio, and microwave, then coaxial cable, fiber optic cable, twisted pair, DSL, or wireless technologies such as infrared, radio, and microwave are included in the definition of medium. As used herein, disks and optical discs include optical discs, laser discs, optical discs, Digital Versatile Discs (DVDs), floppy disks, and Blu-ray discs, where disks typically reproduce data magnetically, while optical discs optically reproduce data using lasers. Combinations of the above should also be included within the scope of computer-readable media.

[0160] This application also provides a computer program product, including a computer program that, when executed by a processor, implements the technical solution of the above method embodiments. Its implementation principle and technical effects are similar, and will not be repeated here.

[0161] In the specific implementation of the aforementioned terminal device or server, it should be understood that the processor can be a Central Processing Unit (CPU), or other general-purpose processors, digital signal processors (DSPs), application-specific integrated circuits (ASICs), etc. A general-purpose processor can be a microprocessor or any conventional processor. The steps of the method disclosed in the embodiments of this application can be directly manifested as execution by a hardware processor, or execution by a combination of hardware and software modules within the processor.

[0162] Those skilled in the art will understand that all or part of the steps in any of the above method embodiments can be implemented by hardware associated with program instructions. The aforementioned program can be stored in a computer-readable storage medium, and when the program is executed, all or part of the steps in the above method embodiments are performed.

[0163] If the technical solution of this application is implemented in software form and sold or used as a product, it can be stored in a computer-readable storage medium. Based on this understanding, all or part of the technical solution of this application can be embodied in the form of a software product, which is stored in a storage medium and includes a computer program or several instructions. This computer software product enables a computer device (which may be a personal computer, server, network device, or similar electronic device) to execute all or part of the steps of the methods in the embodiments of this application.

[0164] It should be noted that, for the sake of simplicity, the foregoing method embodiments are all described as a series of actions. However, those skilled in the art should understand that this application is not limited to the described order of actions, as some steps may be performed in other orders or simultaneously according to this application. Furthermore, those skilled in the art should also understand that the embodiments described in the specification are all optional embodiments, and the actions and modules involved are not necessarily essential to this application.

[0165] It should be further noted that although the steps in the flowchart are shown sequentially according to the arrows, these steps are not necessarily executed in the order indicated by the arrows. Unless explicitly stated herein, there is no strict order restriction on the execution of these steps, and they can be executed in other orders. Moreover, at least some steps in the flowchart may include multiple sub-steps or multiple stages. These sub-steps or stages are not necessarily completed at the same time, but can be executed at different times. The execution order of these sub-steps or stages is not necessarily sequential, but can be performed alternately or in turn with other steps or at least some of the sub-steps or stages of other steps.

[0166] It should be understood that the above-described device embodiments are merely illustrative, and the device of this application can also be implemented in other ways. For example, the division of units / modules in the above embodiments is only a logical functional division, and there may be other division methods in actual implementation. For example, multiple units, modules, or components may be combined, or integrated into another system, or some features may be ignored or not executed.

[0167] Furthermore, unless otherwise specified, the functional units / modules in the various embodiments of this application can be integrated into one unit / module, or each unit / module can exist physically separately, or two or more units / modules can be integrated together. The integrated units / modules described above can be implemented in hardware or as software program modules.

[0168] When integrated units / modules are implemented in hardware, the hardware can be digital circuits, analog circuits, etc. The physical implementation of the hardware structure includes, but is not limited to, transistors, memristors, etc. Unless otherwise specified, the processor can be any suitable hardware processor, such as a CPU, GPU, FPGA, DSP, and ASIC, etc. Unless otherwise specified, the storage unit can be any suitable magnetic or magneto-optical storage medium, such as Resistive Random Access Memory (RRAM), Dynamic Random Access Memory (DRAM), Static Random Access Memory (SRAM), Enhanced Dynamic Random Access Memory (EDRAM), High-Bandwidth Memory (HBM), Hybrid Memory Cube (HMC), etc.

[0169] If the integrated unit / module is implemented as a software program module and sold or used as an independent product, it can be stored in a computer-readable storage device (CMD). Based on this understanding, the technical solution of this application, in essence, or the part that contributes to the prior art, or all or part of the technical solution, can be embodied in the form of a software product. This computer software product is stored in a memory and includes several instructions to cause a computer device (which may be a personal computer, server, or network device, etc.) to execute all or part of the steps of the methods of the various embodiments of this application. The aforementioned memory includes various media capable of storing program code, such as a USB flash drive, read-only memory (ROM), random access memory (RAM), portable hard drive, magnetic disk, or optical disk.

[0170] In the above embodiments, the descriptions of each embodiment have their own emphasis. For parts not described in detail in a certain embodiment, please refer to the relevant descriptions of other embodiments. The technical features of the above embodiments can be combined arbitrarily. For the sake of brevity, not all possible combinations of the technical features in the above embodiments are described. However, as long as the combination of these technical features does not contradict each other, it should be considered within the scope of this specification.

[0171] Finally, it should be noted that the above embodiments are only used to illustrate the technical solutions of this application, and are not intended to limit them. Although this application has been described in detail with reference to the foregoing embodiments, those skilled in the art should understand that modifications can still be made to the technical solutions described in the foregoing embodiments, or equivalent substitutions can be made to some or all of the technical features therein. Such modifications or substitutions do not cause the essence of the corresponding technical solutions to deviate from the scope of the technical solutions of the embodiments of this application.

Claims

1. A cross-platform adaptation method, characterized in that, include: A deployment platform for obtaining initial business code; the initial business code is code built based on a unified development framework; The unified development framework includes the uni-app basic framework and the Vue development language; Based on the deployment platform, the initial business code is conditionally compiled to obtain the target code package; Deploy the target code package on the deployment platform.

2. The method according to claim 1, characterized in that, The conditional compilation of the initial business code based on the deployment platform to obtain the target code package includes: Based on the deployment platform, non-target code segments are removed from the initial business code to obtain an initial code package; the non-target code segments are code segments in the initial business code that are not effective on the deployment platform. Based on the deployment platform, obtain the first configuration parameters of the deployment platform; The first configuration parameter is injected into the initial code package to obtain the target code package.

3. The method according to claim 2, characterized in that, The method further includes: Obtain the client identifier of the target code package on the deployment platform; Based on the client identifier, the second configuration parameters of the client are obtained, and the client is adapted for business purposes based on the second configuration parameters.

4. The method according to claim 3, characterized in that, The step of obtaining the client identifier of the target code package on the deployment platform includes: Read the client identifier from the Uniform Resource Locator (URL) parameter of the client's startup entry point; or, Based on a predefined bridging channel, the client identifier is obtained from the client; or... The client identifier is determined based on the string characteristics of the client.

5. The method according to claim 3, characterized in that, The method further includes: If the client identifier is not obtained, the third configuration parameter corresponding to the predefined identifier is obtained, and the client is adapted for business based on the third configuration parameter.

6. The method according to any one of claims 1-5, characterized in that, The method further includes: Obtain the WebView environment of the target code package; Based on the WebView environment, a communication strategy is determined with the WebView container; the communication strategy includes JS bridge, Flutter WebView plugin, message push interface and standard page navigation.

7. The method according to any one of claims 1-5, characterized in that, The method further includes: Based on the unified lifecycle hooks of the uni-app framework, the lifecycle events of the target code package on different deployment platforms are encapsulated and standardized to enable the target code package to synchronize its state across different deployment platforms.

8. The method according to claim 3, characterized in that, The method further includes: Based on the deployment platform and the client identifier, the target adapters corresponding to the deployment platform and the client are determined from a preset adapter set; Data interaction is performed based on the target adapter.

9. A cross-platform adapter, characterized in that, include: The acquisition module is used to acquire the deployment platform of the initial business code; the initial business code is code built based on a unified development framework. The unified development framework includes the uni-app basic framework and the Vue development language; The processing module is used to perform conditional compilation on the initial business code based on the deployment platform to obtain the target code package; The deployment module is used to deploy the target code package on the deployment platform.

10. An electronic device, characterized in that, include: Memory, used to store computer programs; A processor for executing the computer program to implement the method of any one of claims 1-8.

11. A computer-readable storage medium, characterized in that, It stores a computer program, which is executed by a processor to implement the method of any one of claims 1-8.

12. A computer program product, characterized in that, Includes a computer program that, when executed by a controller, implements the method of any one of claims 1-8.

Images