AndroidWebView和Js的交互

【知识概要】

1. Android中通过WebView调用JS方法(传递参数)

2、Js调用Android的方法

3、WebView适配

【实现效果】

一、【 Android中通过WebView调用JS方法(传递参数)】

Android代码

 Android调用js中showDemo(str)方法存在两种方式:（新版本浏览器和旧版本浏览器）、利用webview直接去执行js代码。

Android代码

Js代码

点击Adnroid中按钮，调取js代码，将结果更新至WebView。

二、【js中调取Android代码_广播 @JavascriptInterface】

Android代码

 js调用showString()方法，将数据放入intent中去，然后发送广播。在构造JavasrciptMethod实例的时候将activity传递进去。app中接受到广播ACTION_WEB事件后就会调用对应的方法，把从js中传递过来的数据显示至view控件中。

Android代码

 然后需要对广播进行注册，并指定接口的名称为Vine。

 Android代码

 在js中调用方式:（指定接口中的具体方法）

Js代码

四、【WebView适配】

如果接入的h5没适配好给app端，需自己去做适配。避免出现web展示的h5特别大等问题。

1.  
   webView = findViewById(R.id.webView);
2.  
    
3.  
   WebSettings settings = webView.getSettings();
4.  
   // 设置WebView支持JavaScript
5.  
   settings.setJavaScriptEnabled(true);
6.  
   //支持自动适配
7.  
   settings.setUseWideViewPort(true);
8.  
   settings.setLoadWithOverviewMode(true);
9.  
   settings.setSupportZoom(true); //支持放大缩小
10.  
    settings.setBuiltInZoomControls(true); //显示缩放按钮
11.  
    settings.setBlockNetworkImage(true);// 把图片加载放在最后来加载渲染
12.  
    settings.setAllowFileAccess(true); // 允许访问文件
13.  
    settings.setSaveFormData(true);
14.  
    settings.setGeolocationEnabled(true);
15.  
    settings.setDomStorageEnabled(true);
16.  
    settings.setJavaScriptCanOpenWindowsAutomatically(true);/// 支持通过JS打开新窗口
17.  
    settings.setLayoutAlgorithm(WebSettings.LayoutAlgorithm.NARROW_COLUMNS);
18.  
    settings.setLayoutAlgorithm(WebSettings.LayoutAlgorithm.SINGLE_COLUMN);
19.  
    //设置不让其跳转浏览器
20.  
    webView.setWebViewClient(new WebViewClient() {
21.  
    @Override
22.  
    public boolean shouldOverrideUrlLoading(WebView view, String url) {
23.  
    return false;
24.  
    }
25.  
    });
26.  
     
27.  
    // 添加客户端支持
28.  
    webView.setWebChromeClient(new WebChromeClient());
29.  
    // mWebView.loadUrl(TEXTURL);
30.  
     
31.  
    //不加这个图片显示不出来
32.  
    if (Build.VERSION.SDK_INT > Build.VERSION_CODES.LOLLIPOP) {
33.  
    webView.getSettings().setMixedContentMode(WebSettings.MIXED_CONTENT_ALWAYS_ALLOW);
34.  
    }
35.  
    webView.getSettings().setBlockNetworkImage(false);
36.  
     
37.  
    //允许cookie 不然有的网站无法登陆
38.  
    CookieManager mCookieManager = CookieManager.getInstance();
39.  
    mCookieManager.setAcceptCookie(true);
40.  
    mCookieManager.setAcceptThirdPartyCookies(webView, true);
41.  
     
42.  
    webView.loadUrl(URL);

五、【总结】

1、Andorid调用Js:调用webview中的方法。

2、Js调用Android方法代码。

[1] 在Android利用@javascriptInterface提供接口、@javascriptInterface告知webview,此方法是一个可以被js调用的方法：广播传递参数或方法或要执行的东西->广播接收器接收到信息->执行

[2] 将接口添加至webview， webview.addJavaScriptInterface()；也可以调用多个方法。

[3] js代码中调用即可。

这篇好文章是转载于：学新通技术网