Android webview调取安卓原生相机和相册上传图片

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Android webview调取安卓原生相机和相册上传图片相关的知识,希望对你有一定的参考价值。

参考技术A 适配安卓10方式:
返回URI即可

手机上加载webview,网页上上传图片调用原生相机和相册上传图片

先设置好webview的加载以及websetting,这里就不多说了。

主要是setWebChromeClient方法的实现

这个方法分几个版本的适配3.0以下的设备,3.0到4.1的设备,4.1到5.0的设备,以及5.0以上的设备,每个方法参数不一样适配时请注意。5.0以下的参数都是 ValueCallback<Uri> ,以上的设备需要 ValueCallback<Uri[]> ,回传数据的时候也是对应的不要弄错了。

最后的效果如下:

安卓原生与hml交互(WebView基础)

  • WebView加载页面

webView有两种加载方式,

加载网络地址

webView.loadUrl("www.xxx.com/index.html");

加载本地资源

webView.loadUrl("file:///android_asset/example.html");
  • 添加请求头信息,在这里可以加入认证信息等等
Map<String,String> map=new HashMap<String,String>();
map.put("taken","1234");
webView.loadUrl("http://192.168.99.101:8080/xiaoyanAPI/test1",map);
  • 设置页面内链接跳转,拦截了跳转事件,在相应函数中做对应的处理。
webView.setWebViewClient(new WebViewClient() {
            public boolean shouldOverrideUrlLoading(WebView view, String url) {
                view.loadUrl(url);
                return true;
            }
        });
  • 设置允许js方法执行
        WebSettings webSettings=webView.getSettings();
        webSettings.setJavaScriptEnabled(true);
  • 返回键返回上个页面(默认webView将页面存放到缓存栈中)
@Override
    public boolean onKeyDown(int keyCode, KeyEvent event) {
        if (keyCode == KeyEvent.KEYCODE_BACK) {
            if (webView.canGoBack()) {
                webView.goBack();//返回上一浏览页面
                return true;
            } else {
                finish();//关闭Activity
            }
        }
        return super.onKeyDown(keyCode, event);
    }
  • 安卓调用html的js方法

调用无返回值方法可去掉后面的回掉函数,该函数接受js函数返回的数据。

 mWebView.evaluateJavascript("sum(1,2)", new ValueCallback<String>() {
        @Override
        public void onReceiveValue(String value) {
            Log.e(TAG, "onReceiveValue value=" + value);
        }
    });
  • js调用安卓原始里的方法。

在Android4.2以上可以直接使用@JavascriptInterface注解来声明,下面是在一个本地Java方法

 public class JsInteration {
    @JavascriptInterface
    public String back() {
        return "hello world";
    }
}

 

定义完这个方法后再调用mWebView.addJavascriptInterface()方法:

 mWebView.addJavascriptInterface(new JsInteration(), "android");

那么在js中怎么来调用呢?

<script type="text/javascript">
     function s(){
     //调用Java的back()方法
    var result =window.android.back();
    document.getElementById("p").innerHTML=result;
    }

</script>

 

以上是关于Android webview调取安卓原生相机和相册上传图片的主要内容,如果未能解决你的问题,请参考以下文章

使用chrome开发者工具在原生安卓应用中调试WebView

RN - 封装Android原生WebView组件,实现JS获取原生消息回调及JS控制native组件

Android 使用腾讯X5内核WebView和原生做交互

安卓混合开发——原生Java和H5交互,保证你一看就懂!

js与原生的交互

WebView中打开相机,文件选择器的问题和解决方法