WebView相关2－－标题，增加header；native／H5 JS调用

最新推荐文章于 2024-09-21 14:23:04 发布

weixin_34396103

最新推荐文章于 2024-09-21 14:23:04 发布

阅读量422

点赞数

CC 4.0 BY-SA版权

文章标签：移动开发 javascript java ViewUI

原文链接：https://juejin.im/post/5a32355a51882554b83791e3

本文详细介绍如何使用WebView实现native与H5交互，包括自定义WebChromeClient获取页面标题、添加HTTP头部信息、处理内部页面跳转及返回逻辑、利用JavaScriptInterface进行JS与native互相调用等关键技术。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

网上都有，也算是差不多被人写烂了的东西，正好之前用过了，放在这儿权当个笔记记录了吧。

光一个Webview的内容，自己看起来还是有很多路要走啊。

native获取H5标题随时进行变更

比较简单，重写下onReceivedTitle就好了：

WebChromeClient wvcc = new WebChromeClient() {
    @Override
    public void onReceivedTitle(WebView view, String title) {
        super.onReceivedTitle(view, title);
        if (!TextUtils.isEmpty(title)) {
            titletext.setText(title);
        } else {
            titletext.setText("");
        }
    }

};
webview.setWebChromeClient(wvcc);
复制代码

增加给webview的访问请求增加header：

HashMap<String, String> map = new HashMap<>();
map.put("HTTP_VERSION",getVersion(this));

//加载需要显示的网页
web_push.loadUrl(url, map);复制代码

需要注意的是，如果需要进行webview的内部跳转，每次请求前是需重新添加header的，试过不重新添加，新的请求是没有的。也比较简单，(上篇文章也提到的关于再这个 shouldOverrideUrlLoading也可以进行很多相关的url进行相关拦截处理的操作。不再赘述）

     webview.setWebViewClient(new WebViewClient() {
        @Override
        public boolean shouldOverrideUrlLoading (WebView view, String url){
            if (url.startsWith("http:www.badu")) {
                //可以进行相关操作，比如遇到XX就跳转到本地页面
                Intent xx＝new Intent（this，XXXX.class）;
                startActivity(xx);
                return true;
            } else if {
                ／／需要内部跳转的网页，添加header
                HashMap<String, String> map = new HashMap<>();
                map.put("HTTP_VERSION", MyApp.getVersion(context));
//加载需要显示的网页
                view.loadUrl(url, map);
                return super.shouldOverrideUrlLoading(view, url);
            }
        }
    });复制代码

加上之前的给请求增加cookies（cookies貌似也要给没个链接设置下），这样基础的网络请求相关的基本就算告一个小段落了。

BTW，关于内部跳转之后的退出／返回上一页，可以用

@Override
public void onBackPressed() {
    if (web_push.canGoBack()) {
        if (web_push.getUrl().equals(url)) {
//url：进入时候的初始url，放这儿也就是做个多一个判断，现在看了看，貌似加不加都行
            super.onBackPressed();
        } else {
            web_push.goBack();
        }
    } else {
        super.onBackPressed();
    }
}复制代码

进行JS操作（H5 JS调用本地native方法，本地调取JS方法获取相关信息）：

也比较简单，网上也有无数现成的方法，基本都是注册个接口来进行处理，以常用的点击网页的按钮进行调用本地分享功能和本地调用JS代码获取信息进行分享两个功能来举例子

先写一个回调处理类：

public class JSInterface {
    private Activity context;
    private ShareOpen shareOpen;
    private String title="";
    private String content="";
    private String link="";
    private String img="";
    private String defLink="";

    public JSInterface(Activity context) {
        super();
        this.context = context;
    }
    /**
     * shareOpen是分享相关的方法
     */


    /**
     * JS调用Android(Java)含参数的方法
     * @param pic 图片地址
     * @param link 分享地址
     * @param tittle 分享标题
     * @param content 分享的内容
     */
    @JavascriptInterface
    public void js4Android(String pic, String link, String tittle, String content) {
        //Android代码逻辑
        shareOpen.startShare(context,pic,link,tittle+"="+content,"",false,"dream");
    }

    /**
     * 本地使用js代码之后的数据回传
     *
     * @param params 回调参数
     * @param code   回调的类型
     */
    @JavascriptInterface
    public void js4params(String params, int code) {

        if (TextUtils.isEmpty(params)) {
            YcLog.d("=======>", "params is null");
        } else {
            if (code == 1) {
                YcLog.d("=======>111", params);
                title = params;
            } else if (code == 2) {
                YcLog.d("=======>222", params);
                img = params;
            } else if (code == 3) {
                link = params;
                YcLog.d("=======>333", params);
            } else if (code == 4) {
                YcLog.d("=======>444", params);
                content = params;
            }else if(code==5){
                YcLog.d("=======>555", params);
                defLink=params;
            }else if (code==6){
                YcLog.d("=======>666", params);
                if (!TextUtils.isEmpty(params)){
                    title = params;
                }
            }
        }

        if(TextUtils.isEmpty(title)){
            title=context.getString(R.string.app_name);
        }
        if(TextUtils.isEmpty(content)){
            content=context.getString(R.string.login_slogn);
        }
        if(TextUtils.isEmpty(link)){
            link=defLink;
        }
        if(code==7){
            shareOpen.startShare(context,img,link,title+"="+content,"",false,"dream");
        }
    }

}
复制代码

Activity中webview的相关设置

Button shareButton；
      bt_share.setOnClickListener(new View.OnClickListener() {
          @Override
          public void onClick(View v) {
              web_push.post(new Runnable() {//印象中写这个是为了等待js加载完成，不写估计也行
                  @Override
                     if (Build.VERSION.SDK_INT < 19) {  
//API在19以后会有不同的调用方式，我都用的是19之前的。。。这里只是写出来表示可以作区分，
//因为个人感觉19之后的一个方法回调string回来有点局限性，对于js代码要求较高                    
                        getJs();
                      } else {
                        getJS();                 
                    } 
               });
            }
        });webview.setWebChromeClient(wvcc);／／别忘记加上这个，不然js脚本就没法之行了JSInterface jsInterface = new JSInterface(context);
webview.addJavascriptInterface(jsInterface, "js4Android");//添加到webview

//需要执行的JS代码，js代码也可以是一行，也可以是js的一个复杂的函数
private void getJs() {
    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
        webview.evaluateJavascript("javascript:var a='aaa';var b='bbb'; return b;",
                new ValueCallback<String>() {
                    @Override
                    public void onReceiveValue(String value) {
                        //此处为 js 返回的结果
                        Toast.makeText(WebActivity.this, value.toString(), Toast.LENGTH_SHORT).show();
                        YcLog.d("======>", value);
                    }
                });
    }

private void getJS() {
    //获取隐藏域的相关信息，最后通过一个类型7做标志位置调用分享功能。
    webview.loadUrl("javascript:window.js4Android.js4params(location.href,5)");
    webview.loadUrl("javascript:window.js4Android.js4params(document.getElementById('shareDesc').value,4)");
    webview.loadUrl("javascript:window.js4Android.js4params(document.getElementById('shareLink').value,3)");
    webview.loadUrl("javascript:window.js4Android.js4params(document.getElementById('shareImg').value,2)");
    webview.loadUrl("javascript:window.js4Android.js4params( document.getElementById('shareTitle').value,6)");
    webview.loadUrl("javascript:window.js4Android.js4params(document.title,1)");
    webview.loadUrl("javascript:window.js4Android.js4params(000,7)");
}复制代码