CN115840590A - 基于安卓和ios跨端混合的方法、系统、设备及存储介质 - Google Patents

Abstract

本申请提供一种基于安卓和IOS跨端混合的方法_、系统、设备及存储介质。方法包括以下步骤：分别封装目标网页接口函数和目标原生接口函数。网页端通过目标网页接口函数调用交互桥接层DSBridge的交互接口。交互桥接层的交互接口调用目标原生接口函数。目标原生接口函数执行原生端的原生功能或者获取原生数据。兼容性好，并且DSBridge支持同步调用，可以使用同一套代码与IOS原生端和安卓原生端进行通信，大大方便了开发，减少了代码维护成本。此外，还使得开发速度可以更快。

Description

基于安卓和IOS跨端混合的方法、系统、设备及存储介质

技术领域

本发明实施例涉及数据交互技术领域，具体涉及一种基于安卓和IOS跨端混合的方法、系统、设备及存储介质。

背景技术

随着HTML5的不断普及及优化，以及移动端对动态化的需求越来越大，开发者经常需要在应用程序中嵌入一些网页，然后会在网页端和原生端之间进行交互，例如传递数据，调用函数，而连接网页端与原生端需要一个桥梁。在移动互联网的高速发展的状况下，常规的开发速度已经渐渐不能满足市场需求。原生H5混合开发应运而生，Hybrid App(混合开发)主要以网页+原生两者相互调用为主，从开发层面实现“一次开发，多处运行”的机制，成为真正适合跨平台的开发。节省了安卓和IOS的工作量，提高了开发效率，节约了开发成本。

实际应用中，通常不止有安卓平台，常用的还包括IOS平台，但随之而来的是网页+原生两者如何相互调用的问题。

发明内容

鉴于以上所述现有技术的缺点，为了有效解决跨平台开发的效率问题，达到“网页代码只需一份，同样的网页代码能同时保证与IOS端和安卓端的正常通信”的效果，本发明引入DSBridge框架。DSBridge跨平台，同时支持IOS和安卓。DSBridge双向调用，网页可以调用原生,原生可以调用网页。DSBridge支持同步调用和异步调用，同步用于一般任务，异步主要用于耗时任务，调用方式不同会影响前段代码流程。DSBridge在IOS端和安卓端是同一个作者，如果将来更新时可以高效地保证双端同步。

本发明实施例提供一种基于安卓和IOS跨端混合的方法，包括以下步骤：

分别封装目标网页接口函数和目标原生接口函数；

网页端通过所述目标网页接口函数调用交互桥接层DSBridge的交互接口；

所述交互桥接层的所述交互接口调用所述目标原生接口函数；

所述目标原生接口函数执行原生端的原生功能或者获取原生数据。

于本发明的一实施例中，所述分别封装目标网页接口函数和目标原生接口函数步骤的所述网页接口函数和所述网页端通过所述目标网页接口函数调用交互桥接层DSBridge的交互接口步骤的所述交互接口，都包括同步请求和异步请求两种方式；

如果请求返回所述原生数据，则采用异步请求方式，向所述交互桥接层DSBridge传入回调函数接口，所述原生接口函数调用所述回调函数接口返回所述原生数据给所述网页端；

如果不请求返回所述原生数据，则采用同步请求方式，仅执行所述原生功能。

于本发明的一实施例中，在所述分别封装目标网页接口函数和目标原生接口函数步骤中，所述原生接口函数的实现步骤如下：

在所述原生端新建一个类，作为原生接口(API)；

添加所述原生接口(API)到网页视图(Webview)，并为它指定一个命名空间；

在所述网页端(Web端)的代码中调用所述原生接口(API)，并注册一个反向网页接口(JS API)供所述原生端调用；

所述原生端使用原生代码执行所述原生功能；

在所述原生代码中调用所述反向网页接口(JS API)。

于本发明的一实施例中，在所述分别封装目标网页接口函数和目标原生接口函数步骤中，所述原生端包括安卓端和IOS端。

于本发明的一实施例中，在所述分别封装目标网页接口函数和目标原生接口函数步骤中，当在所述安卓端进行封装时，进行如下步骤：

在所述安卓端新建第一Java类，实现第一原生接口(API)；

添加所述第一原生接口(API)到第一网页视图(Webview)；

在所述安卓端调用所述反向网页接口(JS API)。

于本发明的一实施例中，在所述分别封装目标网页接口函数和目标原生接口函数步骤中，当在所述IOS端进行封装时，进行如下步骤：

在所述IOS端新建第二Java类，实现第二原生接口；

添加所述第二原生接口到第二网页视图；

在所述IOS端调用所述反向网页接口。本发明提供一种采用上述基于安卓和IOS跨端混合方法的系统，包括：

网页端、交互桥接层和原生端；

其中，在所述网页端和所述原生端之间，采用DSBridge作为所述交互桥接层，所述网页端和所述原生端通过所述交互桥接层进行通讯。所述网页端通过其网页接口函数经由所述交互桥接层调用所述原生端的原生接口函数，所述原生端也通过所述交互桥接层将其被请求的数据返回给所述网页端。

于本发明的一实施例中，所述系统还包括网页接口函数和原生接口函数；所述网页接口函数是所述交互桥接层的交互接口经封装而成，供所述网页端调用；所述原生接口函数是所述原生端的原生功能经封装而成，供所述交互桥接层调用。

具体的，系统包括JavaScript API封装层、原生API封装层以及所述交互桥接层提供的统一原生交互接口，所述JavaScript API封装层提供统一的接口函数给所述网页端调用，同时调用所述统一原生交互接口，与所述原生API封装层交互。

本发明提供一种设备，包括：

一个或多个处理器；

存储装置，用于存储一个或多个程序，当所述一个或多个程序被所述一个或多个处理器执行时，使得所述电子设备实现前述方法中任一项所述的基于安卓和IOS跨端混合的方法。

本发明还进一步提供一种计算机可读存储介质，其上存储有计算机可读指令，当所述计算机可读指令被计算机的处理器执行时，使计算机执行前述方法中任一项所述的安卓和IOS跨端混合的方法。

本发明的有益效果：本发明的基于安卓和IOS跨端混合的方法、系统、设备及存储介质，利用交互桥接层DSBridge进行网页端(Web端)与原生端(Native端)之间的通信，通过对安卓(Android)端的第一网页视图组件(Webview组件)和IOS端的第二网页视图组件(DWKWebView组件)以及网页端(web端)进行封装，只需要一套代码就能分别在安卓端和IOS端实现原生端和网页端数据交互的功能，提高了开发效率，节约了开发成本。

应当理解的是，以上的一般描述和后文的细节描述仅是示例性和解释性的，并不能限制本申请。

附图说明

此处的附图被并入说明书中并构成本说明书的一部分，示出了符合本申请的实施例，并与说明书一起用于解释本申请的原理。显而易见地，下面描述中的附图仅仅是本申请的一些实施例，对于本领域普通技术者来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。在附图中：

图1是本申请的一示例性实施例示出的基于安卓和IOS跨端混合的方法的流程示意图；

图2是本申请的一示例性实施例示出的DSBridge实现图1所示的交互方案框图；

图3是本申请的另一示例性实施例示出的基于安卓和IOS跨端混合的方法的流程示意图；

图4是本申请的一示例性实施例示出的图1的系统示意图。

具体实施方式

以下通过特定的具体实例说明本发明的实施方式，本领域技术人员可由本说明书所揭露的内容轻易地了解本发明的其它优点与功效。本发明还可以通过另外不同的具体实施方式加以实施或应用，本说明书中的各项细节也可以基于不同观点与应用，在没有背离本发明的精神下进行各种修饰或改变。需说明的是，在不冲突的情况下，以下实施例及实施例中的特征可以相互组合。还应当理解，本发明实施例中使用的术语是为了描述特定的具体实施方案，而不是为了限制本发明的保护范围。下列实施例中未注明具体条件的试验方法，通常按照常规条件，或者按照各制造商所建议的条件。

请参阅图1至图4。须知，本说明书所附图式所绘示的结构、比例、大小等，均仅用以配合说明书所揭示的内容，以供熟悉此技术的人士了解与阅读，并非用以限定本发明可实施的限定条件，故不具技术上的实质意义，任何结构的修饰、比例关系的改变或大小的调整，在不影响本发明所能产生的功效及所能达成的目的下，均应仍落在本发明所揭示的技术内容所能涵盖的范围内。同时，本说明书中所引用的如“上”、“下”、“左”、“右”、“中间”及“一”等的用语，亦仅为便于叙述的明了，而非用以限定本发明可实施的范围，其相对关系的改变或调整，在无实质变更技术内容下，当亦视为本发明可实施的范畴。

如图1所示，本发明提供一种基于安卓和IOS跨端混合的方法，包括以下步骤：

S11：分别封装目标网页接口函数和目标原生接口函数；

S12：网页端通过所述目标网页接口函数调用交互桥接层DSBridge的交互接口；

S13所述交互桥接层的所述交互接口调用所述目标原生接口函数；

S14所述目标原生接口函数执行原生端的原生功能或者获取原生数据。

其中，步骤S11中，封装是指将复杂的处理逻辑编写为一个函数，当外部需要执行这些复杂逻辑时，只需调用该函数即可。封装的原因有三个：其一是封装能够让代码的执行逻辑更加易于理解，方便人员维护。其二，对于外部程序需要执行该代码时，外部程序只会知道该函数的函数名，无法知道该函数的具体内容，有助于代码安全。其三，封装可减少代码量，一次封装，多次调用。

目标是指一个特定的功能，它的实现需要一系列的逻辑处理。为了达成安卓和IOS跨端混合，本申请对于每个目标封装一个网页接口函数，外部程序只需调用这个网页接口函数，就表示发出了对这个目标功能的请求。同时，本申请还针对这个目标封装一个对应的原生接口函数，这个原生接口函数包含了达成这个目标的所有处理逻辑和代码，外部程序只需要调用这个原生接口函数就能完成这个目标功能。例如，某个网页设计的目标是获取用户登录信息，那么就封装一个“获取用户登录信息”的网页接口函数和一个“获取用户登录信息”的原生接口函数。

S12：网页端通过所述目标网页接口函数调用交互桥接层DSBridge的交互接口。

网页端对交互桥接层DSBridge的调用是通过分别封装目标网页接口函数和目标原生接口函数步骤封装的目标网页接口函数完成的。

DSBridge是开发打包好的类似桥梁作用的程序。原生端和网页端不加DSBridge也可以实现通讯，但是稳定性和兼容性很差，安卓端和IOS端代码不同。DSBridge把一大堆复杂步骤重新封装打包，只暴露几个简单的交互接口。用DSBridge在安卓端和IOS端写的代码可以通用。

目标网页接口函数通过调用交互桥接层DSBridge提供的统一原生交互接口，例如dsBridge.call，来完成与原生端的交互。

S13：所述交互桥接层的所述交互接口调用所述目标原生接口函数。

交互桥接层DSBridge依据目标网页接口函数调用交互桥接层DSBridge交互接口时传入的参数，调用原生端的对应目标原生接口函数。

交互桥接层DSBridge是网页端代码与原生端代码的通信组件。网页端通过DSBridge调用原生端的函数，原生端也通过DSBridge调用网页端的函数。DSBridge起到桥梁的作用。

其中，“网页端代码”是指在应用程序(APP)的Webview组件中运行的代码。网页端通过DSBridge.call函数调用原生端函数。网页端暴露函数给原生端需通过DSBridge.register对函数进行注册。

S14：所述目标原生接口函数执行原生端的原生功能或者获取原生数据。

原生功能即在终端上执行的功能，例如拍照、读取个人信息等。对网页端需要的原生功能(即目标)，在原生端都封装一个对应的目标原生接口函数，这个接口函数包含了达成这个目标的所有处理逻辑和代码_。网页端通过交互桥接层调用到目标原生接口函数后，就能完成所请求的原生功能。

具体的，网页端一般是指APP中内置的网页，其代码与硬件无关；原生端一般是指软件系统中与硬件相关的功能，当前占主导地位的是安卓系统和IOS系统。网页端的代码可以放在安卓系统和IOS系统使用，而完成同一功能的原生端的代码在安卓系统和IOS系统是不同的，因此造成当网页端想要使用原生端的功能时，起连接作用的交互代码必然是不同的。原生端的这两大系统，简称为安卓端和IOS端。本发明就是通过前述各步骤，只要在安卓端和IOS端使用同一套“起连接作用的交互代码”就能完成相同的网页端请求，实现跨端(安卓端和IOS端)混合。

图2显示了本申请的一示例性实施例示出的DSBridge的交互方案框图，具体方案流程如下：

S21：网页端代码，是指在APP的Webview组件中运行的网页端代码。其中网页端调用原生端函数需通过DSBridge.call函数，网页端暴露函数给原生端需通过DSBridge.register对函数进行注册。

S22：DSBridge是指DSBridge在网页代码与APP原生代码的通信组件。

S23：IOS原生代码是指运行在IOS原生应用中的代码。

S24：安卓原生代码是指运行在安卓原生应用中的代码。

S25：IOS调用网页前端函数是指IOS原生端调用在网页端代码中注册的函数。

S26：安卓调用网页前端函数是指安卓原生端调用在网页端代码中注册的函数。

S21<->S22:是指网页端代码执行DSBridge的call函数进行调用原生端代码将数据传递给原生端；原生端通过回调函数传递数据给网页端，或者原生端通过调用网页端注册的函数将数据传递给网页端。

S22->S23是DSBridge执行IOS原生端代码，并将数据传递给IOS原生端。

S22->S24是DSBridge执行安卓原生端代码，并将数据传递给安卓原生端。

S23->S25是IOS调用端注册的函数，并将数据传递给该函数。

S25->S22是IOS调用的网页端注册的函数将数据传递给DSBridge。

S24->S26是指安卓调用网页端注册的函数，并将数据传递给该函数。

S26->S22是指安卓调用的网页端注册的函数将数据传递给DSBridge。

网页端通过DSBridge调用原生端的函数，原生端想要调用网页端的函数也要通过DSBridge。DSBridge就是起到一个桥梁作用。

具体的，本发明中DSBridge的交互方案为：

在网页端的业务层调用经封装的网页接口函数；

网页接口函数通过交互桥接层提供的统一原生交互接口，与经封装的原生接口函数交互；

原生接口函数，使用原生代码对设备端硬件的接口函数进行封装；

调用封装的原生接口函数可以请求原生功能的数据。

App原生端实现步骤如下：

1、新建一个类，并实现一个原生接口。

针对网页端需要的原生功能，新建一个原生接口。

2、添加这个原生接口到Webview，并为它指定一个命名空间，例如取名“namespace”。此时，在网页代码中就可以通过交互桥接层DSBridge的交互接口bridge.call("namespace.api",...)来调用这个原生接口了。

命名空间可以帮助更好地管理接口，这在接口数量多的时候非常实用，比如在混合应用中。DSBridge支持通过命名空间将接口分类管理，并且命名空间支持多级的，不同级之间只需用'.'分隔即可。

DSBridge是网页端与原生端之间通信的桥梁，同时支持IOS和安卓，采用统一的交互接口，无论是网页端还是安卓端或IOS端，使用都非常简单，极大的降低集成成本。

DSBridge封装了原生端的Webview组件或者DWKWebView组件自带的通信方式，调用DSBridge的接口函数就可以调用到原生组件自带的通信方式。原生的WebView有一个setWebChromeClient函数，可以设置WebChromeClient对象。利用WebChromeClient对象的onJsPrompt函数可以注册自定义函数。当网页端调用窗口对象的Prompt函数时WebChromeClient对象就会在原生端代码中执行对应的函数，并在函数中返回数据给自定义函数。

3、在网页代码中就可以通过交互桥接层DSBridge的交互接口调用原生端的接口函数，并注册一个反向网页接口供原生端调用。

4、在原生代码中调用反向网页接口。

原生代码通过步骤3中注册的反向网页接口调用网页端。至此，网页端和原生端的交互得以完成。

进一步地，在网页端和原生端的数据交互中，利用封装的网页接口函数，网页端可以请求原生端原生功能的数据，该请求操作包括同步请求和异步请求两种方法。同步请求的方法可以将处理数据完成后的结果直接返回给网页端。异步请求的方法可以将处理数据完成后的结果返回给统一的回调函数，再由回调函数返回给网页端。

在安卓端的实现方式如下：

1.新建一个Java类，并实现第一原生接口。

做为一个实施例，同步接口的代码如下：

异步接口如下：

2、在添加上述原生接口到第一网页视图WebView后，网页代码就可以调用到此原生接口。J网页调用也分为同步请求和异步请求。代码如下：

同步调用：

webViewClose(){

this.$bridge.call('webviewClose','webviewClose')

},

异步调用：

如代码中所示，网页代码同步调用需要传递两个参数，分别是原生接口名和原生接口接收的数据，而异步调用则会多一个回调函数用于原生端执行回调。在网页端中通过DSBridge调用原生函数。当只需调用函数，不需要返回值的时候，例如从H5网页页面退出到原生端应用程序页面，需调用原生的webviewClose函数，此函数只操作关闭Webview，不返回数据，此时为同步调用，传入原生接口名和原生接口接收的数据即可。但当网页端调用原生函数且需要返回值，例如应用程序内嵌H5商城项目，当应用程序登录之后，网页可调用原生的getAllLoginInfo函数，从原生端获取用户登录信息，自动登录商城，此时需要返回值，则异步调用，传入原生接口名和原生接口接收的数据以及回调函数，在回调函数中可获取从原生传回的用户信息。

如果原生端需要调用网页端方法，则网页端需要先注册接口：

dsBridge.register('newNotify',(newMsg)＝>{

this.msgList.push(newMsg)

})

3、在安卓端中调用反向网页接口。

dwebView.callHandler("newNotify",new Object[]{newMsg},newOnReturnValue<Integer>(){

@Override

public void onValue(String newMsg){

Log.d("new Message"+newMsg)；

}

})；

在IOS端的实现方式如下：

1.IOS端同样实现原生接口，标记为第二原生接口，也可分为同步接口和异步接口

同步接口：

@objc func webviewClose(_params:String？){

UIWindow.currentViewConttroller？.navigationController？.popViewController()

}

异步接口：

@objc func getAllLoginInfo(_params:String？,completion:((String,Bool)->Void)？){

completion？(NormalLoginViewController.userModel？.json？？"",true)

}

2.添加上述接口到第二网页视图DWKWebView后，网页代码就可以调用到原生接口，代码与安卓端相同。同样IOS端想要调用网页端代码需要网页代码注册一个接口，注册代码与安卓端相同。

dsBridge.register('newNotify',(newMsg)＝>{

this.msgList.push(newMsg)

})

3.在IOS原生代码Object-c中调用网页接口：

[dwebview callHandler:@"newNotify"arguments:@newMsgcompletionHandler:^(NSString*newMsg){

NSLog(@"％@",newMsg)；

}]；

图3显示了从网页端需要调用原生端的函数，包括以下步骤：

S31:指在原生代码中将DSBridge组件绑定到对应的浏览器对象，由此该浏览器内的网页代码才能调用到DSBridge组件。

S32:是在原生代码中将对应的浏览器对象的Webview组件注册之后需要执行的函数。例如，网页要获取用户登录信息，原生代码就在对应的浏览器对象的Webview组件中注册一个“获取用户登录信息(getAllLoginInfo)”函数，以供网页端的网页接口函数调用。

S31->S32:先在原生代码中将DSBridge组件绑定到对应的浏览器对象，然后在原生代码中将对应的浏览器对象的Webview组件注册之后需要执行的函数。

S33->S34:是网页端代码通过网页接口函数执行DSBridge的call函数进行调用原生端代码将数据传递给原生端。其中，网页端也添加相同名称的接口函数，即网页接口函数。例如，“获取用户登录信息”功能来说，网页端也是添加相同名称的函数“获取用户登录信息(getAllLoginInfo)”。

S34->S32:是DSBridge执行原生端代码，并将数据传递给原生端。网页端代码通过网页接口函数调用DSBridge函数，再通过DSBridge调用到原生对应的相同函数名的函数，原生端可以执行该函数的内容。例如，网页端的网页代码调用“获取用户登录信息(getAllLoginInfo)”函数，经过DSBridge作为交互桥接，最终原生端就会执行同名的“获取用户登录信息(getAllLoginInfo)”函数。

S32->S35:是原生端注册的函数接收到网页端传递过来的数据并执行函数的内容，即原生端实现完成原生接口函数所要求的功能。以“获取用户登录信息”为例，原生端执行对应函数“获取用户登录信息(getAllLoginInfo)”，进行一系列为完成“获取用户登录信息”这一任务而制定的逻辑和代码。

S35->S36:是原生端的函数执行完毕，进入S36。

S36：此步骤中对DSBridge注册的函数进行判断：该函数是否为异步函数。如果是异步函数则进入S37。如果不是异步函数，即是同步函数，则进入S38。以“获取用户登录信息”为例，是一个异步函数“获取用户登录信息(getAllLoginInfo)”，需要进入S37如果是“关闭用户信息界面”功能，那么“关闭用户信息界面(closeUserInfoView)”就是一个同步函数，进入S38步骤。

S36->S38:判断函数为同步函数，流程完毕。

S36->S37:判断函数为异步函数，则原生端将数据传递给DSBridge注册函数中的异步回调函数，网页端可以接收到原生端传递过来的数据。以“获取用户登录信息”为例，原生端将获取的用户登录信息，通过回调函数，返回给网页端。

S37->S33:异步回调函数接收原生端数据，并执行函数内容。以“获取用户登录信息”为例，网页端接收到用户登录信息后，做相应的按网页预定设计要求的处理，例如在页面显示相关信息等。

S38：函数执行完毕。

安卓和IOS的流程相同。前述基于安卓和IOS跨端混合方法可以用于安装了App的显示终端，例如手机、平板、电脑及车辆等。

在一个优选实施例中，App内嵌H5商城项目，当App登录之后，H5商城可通过前述方法跟原生端通信，调用原生端的getAllLoginInfo函数，从原生端获取用户登录信息，自动登录商城，避免用户再次操作登录，提高用户体验。

在另一个优选实施例中，App内嵌H5商城项目，商城内用户完成商品购买进入评价商品阶段想要对商品进行拍照上传时，须通过原生调起手机摄像头。此时在网页端中调用原生getCamera函数，即可在H5唤起手机摄像头。

如图4所示，本发明还提供一种采用上述基于安卓和IOS跨端混合方法的系统，包括：网页端、交互桥接层和原生端。

其中，在网页端和原生端之间，采用DSBridge作为交互桥接层，网页端和原生端通过交互桥接层进行通讯，网页端通过其网页接口函数经由交互桥接层调用原生端的原生接口函数，原生端也通过交互桥接层将其被请求的数据返回给网页端。

本发明提供一种设备，包括：一个或多个处理器和存储装置。存储装置用于存储一个或多个程序，当一个或多个程序被一个或多个处理器执行时，使得电子设备实现上述基于安卓和IOS跨端混合的方法。

本发明还进一步提供一种计算机可读存储介质，其上存储有计算机可读指令，当计算机可读指令被计算机的处理器执行时，使计算机执行如前所述的本发明的安卓和IOS跨端混合的方法。

本发明通过对安卓端的Webview组件和IOS端的DWKWebView组件的和网页端的封装，使原生端能和网页数据交互。利用DSBridge进行网页端与原生端之间的通信。DSBridge是同时支持安卓和IOS两个平台的并且都是同一位作者开发的，兼容性有保障。并且DSBridge支持同步调用，可以使用同一套代码与IOS和安卓原生进行通信，大大方便了开发，减少了代码维护成本。不止于此，DSBridge还支持更多的开发特性，使得开发速度可以更快。所以，本发明有效克服了现有技术中的种种缺点而具高度产业利用价值。

上述实施例仅例示性说明本发明的原理及其功效，而非用于限制本发明。任何熟悉此技术的人士皆可在不违背本发明的精神及范畴下，对上述实施例进行修饰或改变。因此，举凡所属技术领域中具有通常知识者在未脱离本发明所揭示的精神与技术思想下所完成的一切等效修饰或改变，仍应由本发明的权利要求所涵盖。

Claims (10)

1.一种基于安卓和IOS跨端混合的方法，其特征在于，包括以下步骤：

分别封装目标网页接口函数和目标原生接口函数；

网页端通过所述目标网页接口函数调用交互桥接层DSBridge的交互接口；

所述交互桥接层的所述交互接口调用所述目标原生接口函数；

所述目标原生接口函数执行原生端的原生功能或者获取原生数据。

2.根据权利要求1所述的基于安卓及IOS跨端混合的方法，其特征在于：所述分别封装目标网页接口函数和目标原生接口函数步骤中，所述网页接口函数和所述网页端通过所述目标网页接口函数调用交互桥接层DSBridge的交互接口步骤的所述交互接口，都包括同步请求和异步请求两种方式；

如果请求返回所述原生数据，则采用异步请求方式，向所述交互桥接层DSBridge传入回调函数接口，所述原生接口函数调用所述回调函数接口返回所述原生数据给所述网页端；

如果不请求返回所述原生数据，则采用同步请求方式，仅执行所述原生功能。

3.根据权利要求1所述的基于安卓及IOS跨端混合的方法，其特征在于，在所述分别封装目标网页接口函数和目标原生接口函数步骤中，所述原生接口函数的实现步骤如下：

在所述原生端新建一个类，作为原生接口；

添加所述原生接口到网页视图，并为它指定一个命名空间；

在所述网页端的代码中调用所述原生接口，并注册一个反向网页接口供所述原生端调用；

所述原生端使用原生代码执行所述原生功能；

在所述原生代码中调用所述反向网页接口。

4.根据权利要求3所述的基于安卓及IOS跨端混合的方法，其特征在于，在所述分别封装目标网页接口函数和目标原生接口函数步骤中，所述原生端包括安卓端和IOS端。

5.根据权利要求4所述的基于安卓和IOS跨端混合的方法，其特征在于，在所述分别封装目标网页接口函数和目标原生接口函数步骤中，当在所述安卓端进行封装时，进行如下步骤：

在所述安卓端新建第一Java类，实现第一原生接口；

添加所述第一原生接口到第一网页视图；

在所述安卓端调用所述反向网页接口。

6.根据权利要求4所述的基于安卓和IOS跨端混合的方法，其特征在于，在所述分别封装目标网页接口函数和目标原生接口函数步骤中，当在所述IOS端进行封装时，进行如下步骤：

在所述IOS端新建第二Java类，实现第二原生接口；

添加所述第二原生接口到第二网页视图；

在所述IOS端调用所述反向网页接口。

7.一种采用如权利要求1至6任一项所述的基于安卓和IOS跨端混合方法的系统，其特征在于，包括：

网页端、交互桥接层和原生端；

其中，在所述网页端和所述原生端之间，采用DSBridge作为所述交互桥接层，所述网页端和所述原生端通过所述交互桥接层进行通讯。

8.根据权利要求7所述的系统，其特征在于，还包括网页接口函数和原生接口函数；所述网页接口函数是所述交互桥接层的交互接口经封装而成，供所述网页端调用；所述原生接口函数是所述原生端的原生功能经封装而成，供所述交互桥接层调用。

9.一种设备，其特征在于，包括：

一个或多个处理器；

存储装置，用于存储一个或多个程序，当所述一个或多个程序被所述一个或多个处理器执行时，使得所述电子设备实现如权利要求1至6中任一项所述的基于安卓和IOS跨端混合的方法。

10.一种计算机可读存储介质，其特征在于，其上存储有计算机可读指令，当所述计算机可读指令被计算机的处理器执行时，使计算机执行权利要求1至6任一项所述的安卓和IOS跨端混合的方法。

Images