Android与JS进行交互传文件路径

时间：2022-06-19 16:49:26

webview+h5这种混合开发最近很火，其中最重要的大概就是java代码和js的交互了，刚接触这东西两天，写写收获。

新建一个assets文件夹，要与res这个文件夹同级，其中存放web项目。

先看android端

初始化webview

 // 设置支持JavaScript等

         webView = (WebView) findViewById(R.id.webView);

         settings = webView.getSettings();

         settings.setJavaScriptEnabled(true);

         settings.setCacheMode(WebSettings.LOAD_DEFAULT);        //缓存

         settings.setDomStorageEnabled(true);                    //使用localStorage则必须打开

         settings.setDatabaseEnabled(true);

         settings.setAppCacheEnabled(true);

         settings.setAllowFileAccess(true);

         settings.setSupportZoom(true);

         settings.setBuiltInZoomControls(true);

         settings.setRenderPriority(WebSettings.RenderPriority.HIGH);    //提高渲染优先级

         settings.setBlockNetworkImage(false);                           //把图片放在最后渲染

         webView.setWebChromeClient(new WebChromeClient());

         webView.addJavascriptInterface(new Object() {

             @JavascriptInterface

             public void onUseCamera() {

                 //use system camera

                 Intent intent = new Intent(MediaStore.ACTION_IMAGE_CAPTURE);

                 startActivityForResult(intent, CAPTURE_IMAGE_ACTIVITY_REQUEST_CODE);

             }

         }, "camera");

         webView.addJavascriptInterface(new Object() {

             @JavascriptInterface

             public String onGetPic() {

                 return file.getAbsolutePath();

             }

         }, "getPicture");

         webView.loadUrl("file:///android_asset/login_content.html");

这里执行了点击h5中的按钮，调用系统相机的操作，onActivityResult就不写了，网上一大堆，不过需要注意，onactivityResult中要有

webView.loadUrl("javascript:getPic(" + ")");这样一句代码

。其中名字为camera的javascrptInterface是调用照相机，getPicture的是返回照片路径给js。

下面就是js了

 　　　　　function useCamera(){

            window.camera.onUseCamera();

         }

         function getPic(){

             var filePath = window.getPicture.onGetPic();

             alert(filePath);

             document.getElementById("testImage").src=filePath;

         }

主要就是这样的两个方法，其中useCamera是要在html的button的onclick中调用，getPic是在上面的onActivityForResult中调用，通过文件路径更改id是testImage的图片。

这样直接传文件路径在web项目部署在服务器时是访问不到的，这个应该有解决方案，可惜我没有找到。还有个问题待解决，传一个string的文件路径没问题，但是如果直接传File类型的文件时，js死活都识别不出文件来，目测应该用h5的FileReader进行操作，可惜我又没成功。。。以上

相关文章