Android AgentWeb WebView 与js交互总结

简介: Android AgentWeb WebView 与js交互总结

想必熟悉android开发的同学都知道使用原生 webview 与js 的交互方式,下面我们先来回顾一下。


一、原生 Android webview 与js 的交互方式


webview 通过addJavascriptInterface 进行对象映射

首先要打开交互权限 , 允许使用javascript

webSettings.setJavaScriptEnabled(true);


第一步,进行对象映射,如下所示:

webView.addJavascriptInterface(new JsInterface() , "android");


说明:以上“ JsInterface ”、“android” 都可以自己命名,这里仅做为示例。


第二步,定义一个与JS对象映射关系的Android类 ,并定义JS需要调用的方法, 加入@JavascriptInterface注解


如下所示:

public class JsInterface{
     // Android 调用 Js 方法
     @JavascriptInterface
     public void jsFun(String name,String data){
      Log.e("TAG", "jsfun  name=="+name);
       Log.e("TAG", "jsfun  data=="+data);
    }
  }


通过上面的对象映射及实现后,js就可以使用android对象调用JsInterface 对象中 jsFun 的方法了,如下:


第三步,js 调用android方法

注意 : android就是约定好的映射对象名称, 如下:

function jsCallAndroid(){
     //Js调用Android的方法
      android.jsFun("name", "params")
   }


那么使用 AgentWeb的Webview和js 的交互方式,你知道吗?

其实和原生webview与js的交互还是有些出入的,接下来,我们以代码进行详细说明。


二、AgentWeb的Webview和js 的交互方式


根据文档说明交互方式如下:

android 调用 javascript
mAgentWeb.getWebCreator().getWebView().getSettings().setJavaScriptEnabled(true);
//Javascript 方法
function callByAndroid(){
   console.log("callByAndroid")
}
//Android 端
mAgentWeb.getJsEntraceAccess().quickCallJs("callByAndroid");
//结果
consoleMessage:callByAndroid  lineNumber:27


javascript 调用 android
//Android 端 , AndroidInterface 是一个注入类 ,里面有一个无参数方法:callAndroid 
mAgentWeb.getJsInterfaceHolder().addJavaObject("android",new AndroidInterface(mAgentWeb,this));
//在 Js 里就能通过 
window.android.callAndroid() //调用 Java 层的 AndroidInterface 类里 callAndroid 方法


但是文档,并没有给出AndroidInterface的具体实现。

其实原理和原生webview与js的交互是一样的,以下是实现:


public class AndroidInterface {
  private AgentWeb agent;
  private Context context;
  public AndroidInterface(AgentWeb agent, Context context) {
  this.agent = agent;
  this.context = context;
  }
  @JavascriptInterface
  public void BackToAndroid(){
  //  send(new BackToHomeEvent());
  }
}


相关文章
|
12小时前
|
移动开发 JavaScript Android开发
Android与Html5交互
Android与Html5交互
|
3天前
|
JavaScript 前端开发
javascript中的交互效果
javascript中的交互效果
|
6天前
|
前端开发 JavaScript
前端 JavaScript 与 HTML 怎么实现交互
前端 JavaScript 与 HTML 怎么实现交互
|
18天前
|
Rust 前端开发 JavaScript
Rust与JavaScript的跨语言交互:探索与实践
本文旨在探讨Rust与JavaScript之间的跨语言交互方法。我们将深入了解WebAssembly(Wasm)的角色,以及它如何使得Rust与JavaScript能够在Web应用中和谐共处。此外,我们还将介绍Rust与JavaScript的集成方式,包括Rust编译到Wasm、使用wasm-bindgen进行Rust与JavaScript的绑定,并通过实际案例展示如何实现两者之间的交互。
|
1月前
|
XML Android开发 数据格式
安卓和webview交互
安卓和webview交互
13 0
|
2月前
|
存储 监控 前端开发
JavaScript手册:公司员工电脑监控软件前端交互的代码设计
在当今信息时代,随着公司对员工电脑活动的监控需求不断增加,前端交互的代码设计变得尤为关键。本手册将深入探讨JavaScript编写的公司员工电脑监控软件监控代码,着重介绍如何设计能够在不引起怀疑的情况下,实现对员工电脑活动的细致监控。
130 2
|
3月前
|
JavaScript 前端开发 Android开发
android开发,使用kotlin学习WebView(详细)
android开发,使用kotlin学习WebView(详细)
28 0
|
3月前
|
XML Java Android开发
Android App事件交互Event之模仿京东App实现下拉刷新功能(附源码 可直接使用)
Android App事件交互Event之模仿京东App实现下拉刷新功能(附源码 可直接使用)
23 0
Android App事件交互Event之模仿京东App实现下拉刷新功能(附源码 可直接使用)
|
3月前
|
XML Java Android开发
Android App事件交互中辨别缩放与旋转手指的讲解与实战(附源码 可直接使用)
Android App事件交互中辨别缩放与旋转手指的讲解与实战(附源码 可直接使用)
24 0
|
3月前
|
XML Java Android开发
Android App事件交互中区分点击和长按动作以及识别手势滑动方向的讲解及实战(附源码 可直接使用)
Android App事件交互中区分点击和长按动作以及识别手势滑动方向的讲解及实战(附源码 可直接使用)
41 0

相关产品

  • 云迁移中心