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进行操作，可惜我又没成功。。。以上

Atitit.js获取上传文件全路径

Atitit.js获取上传文件全路径 1. 默认的value只能获取文件名..安全原因.. 1 2. Firefox浏览器的读取 1 3. Html5 的file api 2 4. 解决方法::使用a ...

JS获取上传文件的绝对路径，兼容IE和FF

js获取上传文件内容

js 获取上传文件的字节数及内容