JsBridge

SDK支持

Js调用原生方法并支持异步回调和同步回调
原生调用Js方法并支持异步回调
Js调用名称空间可自由配置，统一管理命名空间
支持Js调用原生方法多次回调，如果不想多次回调可以删除回调方法
支持部分Js框架中window并非顶级window

API介绍

callJsFunction(function: String)
原生调用Js的方法，不支持传递参数和回调
参数
- function:调用Js的方法名称
callJsFunction(function: String, callback: JsCallback?)
原生调用Js的方法，不支持传递参数但支持回调
参数
- function:调用Js的方法名称
- callback:回调函数
callJsFunction(function: String, data: String?)
原生调用Js的方法，支持传递参数，但不支持回调
参数
- function:调用Js的方法名称
- data:字符串，传递给Js的参数
callJsFunction(function: String, data: String?, callback: JsCallback?)
原生调用Js的方法，支持传递参数和回调
参数
- function:调用Js的方法名称
- data:字符串，传递给Js的参数
- callback:回调函数
jsCallName()
Js调用原生的API命名空间，SDK统一了命名空间，默认为JsBridge，整个Js调用中只会使用这个命名，当然，如果是你不喜欢这个命名，或者需要根据项目更改为项目有关的命名，可以自定义WebView继承至BaseWebView重写该方法。
getWindow()
Js中获取window的方法，建议不要随意修改。在特殊的Js框架中，获取系统的window需要window.window才能获取到，所以这时候可以自定义WebView继承至BaseWebView重写该方法。

如何使用

依赖引入

Step 1.先在 build.gradle(Project:XXX) 的 repositories 添加:

allprojects {
repositories {
...
maven { url "https://jitpack.io" }
}
}

Step 2. 然后在 build.gradle(Module:XXX) 的 dependencies 添加:

dependencies {
implementation 'com.github.ChinaLike:JsBridge:x.x.x'//x.x.x换成最新的版本号
}

新建Js调用原生方法的类，参考：JsBridgeToast

注意：桥梁类需要实现IJavascriptInterface接口，如果不实现则是普通的桥梁类

packagecom.like.jsbridgeimportandroid.content.Contextimportandroid.os.Handlerimportandroid.util.Logimportandroid.webkit.JavascriptInterfaceimportandroid.widget.Toastimportcom.core.web.Callbackimportcom.core.web.CallbackBeanclassJsBridgeToast(privatevalcontext: Context) : IJavascriptInterface{
@JavascriptInterfacefunnativeNoArgAndNoCallback(){Toast.makeText(context,"调用原生无参数无回调方法",Toast.LENGTH_SHORT).show()}
@JavascriptInterfacefunnativeNoArgAndCallback(callback: Callback){callback.success()}
@JavascriptInterfacefunnativeArgAndNoCallback(params:String){Toast.makeText(context,params,Toast.LENGTH_SHORT).show()}
@JavascriptInterfacefunnativeArgAndCallback(params:String,callback: Callback):Boolean{Toast.makeText(context,params,Toast.LENGTH_SHORT).show()callback.success()returnfalse}
@JavascriptInterfacefunnativeDeleteCallback(params:String,callback: Callback){Toast.makeText(context,params,Toast.LENGTH_SHORT).show()callback.success(isDelete=true)Handler().postDelayed(Runnable{callback.error(1,"错误回调")},3000)}
@JavascriptInterfacefunnativeNoDeleteCallback(params:String,callback: Callback){Toast.makeText(context,params,Toast.LENGTH_SHORT).show()callback.success(isDelete=false)Handler().postDelayed(Runnable{callback.error(1,"错误回调")},3000)}
@JavascriptInterfacefunnativeSyncCallback():String{return"原生同步回调"}}

新建MainActivity和xml文件,参考：MainActivityKotlin和activity_main

在xml文件中引入JsBridgeWebView

<com.core.web.JsBridgeWebViewandroid:id="@+id/webView"android:layout_width="match_parent"android:layout_height="match_parent"/>

当然，如果没有特殊需要使用JsBridgeWebView就可以了，如果有定制WebView，则引入自己定制那个WebView就可以了，但是自定义的WebView需要继承JsBridgeWebView

在Activity中调用addJavascriptInterface添加

importcom.core.web.JsBridgeWebView;classMainActivityKotlin : AppCompatActivity(){privatevarwebView: JsBridgeWebView? =nulloverridefunonCreate(savedInstanceState: Bundle?){super.onCreate(savedInstanceState)setContentView(R.layout.activity_main)webView=findViewById(R.id.webView)webView?.addJavascriptInterface(JsBridgeToast(this))webView?.loadUrl("file:///android_asset/test.html")}

注意：webView的addJavascriptInterface方法可以多次调用，开发时可以根据业务功能进行解耦，addJavascriptInterface方法支持传递一个或两个参数，传递两个参数时第二个参数无效。但是如果没有实现IJavascriptInterface接口的类第二个参数应该传递自己想要的

在Js中调用原生方法，参考：test.html

Js调用原生无参无回调方法

Kotlin代码

@JavascriptInterfacefunnativeNoArgAndNoCallback(){Toast.makeText(context,"调用原生无参数无回调方法",Toast.LENGTH_SHORT).show()}

Java代码

@JavascriptInterfacepublicvoidnativeNoArgAndNoCallback(){Toast.makeText(context,"调用原生无参数无回调方法",Toast.LENGTH_SHORT).show();}

Js代码

JsBridge.nativeNoArgAndNoCallback();

Js调用原生无参有回调方法

Kotlin代码

@JavascriptInterfacefunnativeNoArgAndCallback(callback: Callback){callback.success()}

Java代码

@JavascriptInterfacepublicvoidnativeNoArgAndCallback(Callbackcallback){callback.success();}

Js代码

JsBridge.nativeNoArgAndCallback(function(result){alert(JSON.stringify(result));});

Js调用原生有参无回调方法

Kotlin代码

@JavascriptInterfacefunnativeArgAndNoCallback(params:String){Toast.makeText(context,params,Toast.LENGTH_SHORT).show()}

Java代码

@JavascriptInterfacepublicvoidnativeArgAndNoCallback(Stringparams){Toast.makeText(context,params,Toast.LENGTH_SHORT).show();}

Js代码

JsBridge.nativeArgAndNoCallback("调用原生有参数无回调方法");

Js调用原生有参有回调方法

Kotlin代码

@JavascriptInterfacefunnativeArgAndCallback(params:String,callback: Callback){Toast.makeText(context,params,Toast.LENGTH_SHORT).show()callback.success()}

Java代码

@JavascriptInterfacepublicvoidnativeArgAndCallback(Stringparams,Callbackcallback){Toast.makeText(context,params,Toast.LENGTH_SHORT).show();callback.success();}

Js代码

JsBridge.nativeArgAndCallback("调用原生有参数有回调方法",function(result){alert(JSON.stringify(result))});

Js调用原生有参有回调方法，且只能回调一次

Kotlin代码

@JavascriptInterfacefunnativeDeleteCallback(params:String,callback: Callback){Toast.makeText(context,params,Toast.LENGTH_SHORT).show()callback.success(true)Handler().postDelayed(Runnable{callback.error(1,"错误回调")},3000)}

Java代码

@JavascriptInterfacepublicvoidnativeDeleteCallback(Stringparams,Callbackcallback){Toast.makeText(context,params,Toast.LENGTH_SHORT).show();callback.success(true);newHandler().postDelayed(newRunnable(){
@Overridepublicvoidrun(){callback.error(1,"错误回调");}},3000);}

Js代码

JsBridge.nativeDeleteCallback("调用原生方法后删除回调",function(result){alert(JSON.stringify(result))},function(error){alert(JSON.stringify(result))});

Js调用原生有参有回调方法，且能回调多次

Kotlin代码

@JavascriptInterfacefunnativeNoDeleteCallback(params:String,callback: Callback){Toast.makeText(context,params,Toast.LENGTH_SHORT).show()callback.success(false)Handler().postDelayed(Runnable{callback.error(1,"错误回调")},3000)}

Java代码

@JavascriptInterfacepublicvoidnativeNoDeleteCallback(Stringparams,Callbackcallback){Toast.makeText(context,params,Toast.LENGTH_SHORT).show();callback.success(false);newHandler().postDelayed(newRunnable(){
@Overridepublicvoidrun(){callback.error(1,"错误回调");}},3000);}

Js代码

JsBridge.nativeNoDeleteCallback("调用原生方法后不删除回调",function(result){alert(JSON.stringify(result))},function(error){alert(JSON.stringify(error))});

Js调用原生同步回调数据

Kotlin代码

@JavascriptInterfacefunnativeSyncCallback():String{return"原生同步回调"}

Java代码

@JavascriptInterfacepublicStringnativeSyncCallback(){return"原生同步回调";}

Js代码

varresult=JsBridge.nativeSyncCallback();alert(result)

注意：被@JavascriptInterface注解的方法，只支持最多两个参数，不论顺序。无参数：代表Js不传递参数过来也不回调；一个参数：可以是传递过来的参数或回调；两个参数：一个为参数，一个是回调。

在原生中调用Js方法，参考：MainActivity

原生调用JS无参数无回调

Js代码

functionjsNoArgAndNoCallback(){alert("原生调用JS无参数无回调");}

Java代码

webView.callJsFunction("jsNoArgAndNoCallback");

Kotlin代码

webView?.callJsFunction("jsNoArgAndNoCallback")

原生调用Js无参数有回调

Js代码

functionjsNoArgAndCallback(callback){alert("原生调用JS无参数有回调");callback("我是JS回调数据");}

Java代码

webView.callJsFunction("jsNoArgAndCallback",callback->Toast.makeText(this,""+callback,Toast.LENGTH_SHORT).show());

Kotlin代码

webView?.callJsFunction("jsNoArgAndCallback",object : JsCallback{overridefunonCallback(callback: Any){Toast.makeText(this@MainActivityKotlin,"$callback",Toast.LENGTH_SHORT).show()}})

原生调用Js有参数无回调

Js代码

functionjsArgAndNoCallback(params){alert(params);}

Java代码

webView.callJsFunction("jsArgAndNoCallback","原生传递过来的参数");

Kotlin代码

webView?.callJsFunction("jsArgAndNoCallback","原生传递过来的参数")

原生调用Js有参数有回调（可回调多次）

Js代码

functionjsArgAndCallback(params,callback){alert(params);callback("我是JS第一次回调数据");setTimeout(function(){callback("我是JS第二次回调数据");},500);}

Java代码

webView.callJsFunction("jsArgAndCallback","原生传递过来的参数",callback->Toast.makeText(this,""+callback,Toast.LENGTH_SHORT).show());

Kotlin代码

webView?.callJsFunction("jsArgAndCallback","原生传递过来的参数",object : JsCallback{overridefunonCallback(callback: Any){Toast.makeText(this@MainActivityKotlin,"$callback",Toast.LENGTH_SHORT).show()}})

调用Js有参数有回调（只能回调一次）

Js代码

functionjsArgAndDeleteCallback(params,callback){alert(params);callback("我是JS第一次回调数据",true);setTimeout(function(){callback("我是JS第二次回调数据");},500);}

Java代码

webView.callJsFunction("jsArgAndDeleteCallback","原生传递过来的参数",callback->Toast.makeText(this,""+callback,Toast.LENGTH_SHORT).show());

Kotlin代码

webView?.callJsFunction("jsArgAndDeleteCallback","原生传递过来的参数",object : JsCallback{overridefunonCallback(callback: Any){Toast.makeText(this@MainActivityKotlin,"$callback",Toast.LENGTH_SHORT).show()}})

注意：原生调用Js代码，Js的方法最多支持两个参数，无参数：代表原生不传递参数过来也不用回调给原生； 一个参数：可以是参数也可以是回调；两个参数：有序，第一个为参数，第二个为回调，代表原生传递过来参数，且需要回调给原生

Name		Name	Last commit message	Last commit date
app		app
gradle/wrapper		gradle/wrapper
library		library
screenshots		screenshots
.gitignore		.gitignore
README.md		README.md
build.gradle		build.gradle
gradle.properties		gradle.properties
gradlew		gradlew
gradlew.bat		gradlew.bat
settings.gradle		settings.gradle

Navigation Menu

Repository files navigation

JsBridge

SDK支持

API介绍

如何使用

依赖引入

新建Js调用原生方法的类，参考：JsBridgeToast

新建MainActivity和xml文件,参考：MainActivityKotlin和activity_main

在Js中调用原生方法，参考：test.html

在原生中调用Js方法，参考：MainActivity

About

Releases

Packages

Contributors

Languages

Latest commit

History

Folders and files

Repository files navigation

JsBridge

SDK支持

API介绍

如何使用

依赖引入

新建Js调用原生方法的类，参考：JsBridgeToast

新建MainActivity和xml文件,参考：MainActivityKotlin和activity_main

在Js中调用原生方法，参考：test.html

在原生中调用Js方法，参考：MainActivity

About

Topics

Resources

Stars

Watchers

Forks

Releases

Packages

Contributors

Languages