JS与Native交互

实现JS和Native有两种方式:

  • shouldOverrideUrlLoading(WebView view, String url)
  • js与java互相调用

先来说一下第一种方式shouldOverrideUrlLoading(WebView view, String url)

通过给WebView加一个事件监听对象(WebViewClient)并重写shouldOverrideUrlLoading(WebView view, String url)方法。当按下某个连接时WebViewClient会调用这个方法,并传递参数view和url

开始第二种.JS和Java互调

如何实现java和js互调

  1. WebView开启JavaScript脚本执行
  2. WebView设置供JavaScript调用的交互接口
  3. 客户端和网页端编写调用对方的代码

JS调用JAVA
JS : window.jsInterfaceName.methodName(parameterValues)
native: webView.addJavascriptInterface(new JsInteration(), “androidNative”);

下面给出一个实例,方便理解

webView.addJavascriptInterface(new JsInteration(), “androidNative”);
@JavascriptInterface
public void helloJS(){…}
window.androidNative.helloJS();

Java调用JS

webView调用js的基本格式为webView.loadUrl(“javascript:methodName(parameterValues)”)

  • 调用js无参无返回值函数: String call =“javascript:sayHello()”;webView.loadUrl(call);
  • 调用js有参无返回值函数:String call = “javascript:alertMessage(\”” + “content” + “\”)”; webView.loadUrl(call);
  • 调用js有参数有返回值的函数
    Android在4.4之前并没有提供直接调用js函数并获取值的方法,所以在此之前,常用的思路是 java调用js方法,js方法执行完毕,再次调用java代码将值返回。
    Android 4.4之后使用evaluateJavascript即可。
private void testEvaluateJavascript(WebView webView) {
  webView.evaluateJavascript("getGreetings()", new ValueCallback<String>() {
  @Override
  public void onReceiveValue(String value) {
      Log.i(LOGTAG, "onReceiveValue value=" + value);
  }});
}

注:

  1. 参数类型如果是简单的int或String,可以直接传,对于复杂的数据类型,建议以字符串形式的json返回。
  2. evaluateJavascript方法必须在UI线程(主线程)调用,因此onReceiveValue也执行在主线程。

当native与js交互时存cookie看到很多人遇到过这样一个问题,cookie存不进去,网上有很多解释方案,但是很多没说到重点上,这里直接贴一下代码:

public static void synCookies(Context context, String url, String version) {
        CookieSyncManager.createInstance(context);
        CookieManager cookieManager = CookieManager.getInstance();
        cookieManager.setAcceptCookie(true);
        cookieManager.removeAllCookie();
        cookieManager.setCookie(url, "sessionKey=" + UserInfoShareprefrence.getInstance(context).getLocalSessionKey());
        cookieManager.setCookie(url, "productVersion=android-epocket-v" + version);
        CookieSyncManager.getInstance().sync();

    }

存不进去的很大一部分原因是你的url不对,他官方给出的解释是这样的

 /**
     * Sets a cookie for the given URL. Any existing cookie with the same host,
     * path and name will be replaced with the new cookie. The cookie being set
     * will be ignored if it is expired.
     *
     * @param url the URL for which the cookie is to be set
     * @param value the cookie as a string, using the format of the 'Set-Cookie'
     *              HTTP response header
     */
    public void setCookie(String url, String value) {
        throw new MustOverrideException();
    }

其实没说明白url到底是什么,这里的url就是显示的url的域名,这里顺便贴出取域名的方法,给出的是通过正则提取域名

    /**
     * 获得域名
     *
     * @param url
     * @return
     */
    public static String getDomain(String url) {
        Pattern p = Pattern.compile("[^//]*?\\.(com|cn|net|org|biz|info|cc|tv)", Pattern.CASE_INSENSITIVE);
        Matcher matcher = p.matcher(url);
        matcher.find();
        return matcher.group();
    }

还有一点就是,如果你想传递多个值给cookie的话,可以多次使用setCookie,不要擅自的自己拼值,因为你拼的字符串中可能存在分号,内部多分号做了特殊处理,截取分号之前的,之后的直接放弃!

  • 7
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 6
    评论
在Web开发中,JSNative交互是指通过JavaScript(JS)代码和本地代码进行相互通信的过程。JS是一种脚本语言,在浏览器中执行,而Native是指底层本地代码,如Android的Java或iOS的Objective-C/Swift。 JSNative交互的目的是为了在Web应用程序中获得更强大的功能和更好的用户体验。通过JSNative交互,可以实现以下功能: 1. 调用Native功能:JS可以通过与Native进行通信,调用本地功能,例如访问设备的传感器、获取设备信息、发送本地推送等。这样,Web应用程序就可以更好地与设备硬件和本地特性进行交互。 2. 获取Native数据:JS可以向Native请求数据,例如获取本地数据库的数据、获取设备的位置信息等。通过这种方式,Web应用程序可以使用本地的数据,实现更为复杂和个性化的功能。 3. 更新Web页面:Native可以通过调用JS的代码来更新Web页面的内容,例如在Native端接收到新的数据时,可以通过JS将数据更新到Web页面上,实现实时的页面刷新。 为了实现JSNative交互,通常有以下几种方式: 1. 使用WebView提供的接口:在移动应用中,使用WebView作为嵌入式浏览器可以实现JSNative交互。通过WebView提供的接口,可以在JSNative之间进行消息传递和函数调用。 2. 使用JavaScriptBridge:JavaScriptBridge是一种将JSNative进行桥接的技术。通过在Native代码中注入JavaScriptBridge对象,并在JS代码中引用相关的Native方法和属性,可以实现JSNative的相互调用。 3. 使用消息机制:在一些特定的平台上,还可以通过消息机制实现JSNative之间的通信。例如,Android平台可以使用JavaScriptInterface来定义JS可以调用的Native方法,而iOS平台可以使用WKWebView提供的消息机制进行JSNative交互。 总结来说,JSNative交互是为了实现Web应用程序与本地功能和数据的交互,通过使用WebView接口、JavaScriptBridge或消息机制,可以实现JSNative的相互调用和通信。这样一来,Web应用程序就能获得更多的功能和更好的用户体验。
评论 6
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值