WebView支持<input type="fi
开发过程中我们可能遇到如下需求：
WebView加载一个网页，网页中包含一个从手机拍照或者从相册获取图片并上传的功能需求。
由于项目中实际只需要图片，因此在示例代码中是以交互图片为例。
一、原理
当触发web的<input>标签之后，会回调WebChromeClient的一个方法（不同Api Level方法签名不同），在这个方法中处理从相册或者拍照的请求，最后在Activity的onActivityResult方法中返回结果。
二、具体实现
1、实现WebChromeClient中的回调方法
在WebChromeClient增加如下方法（只给出了方法签名，具体实现逻辑，个人可以自行实现，无外乎就是请求相册或者照相之类的代码，后面会给出我的例子）
// Android < 3.0 调用这个方法
public void openFileChooser(ValueCallback uploadMsg)
// 3.0 + 调用这个方法
public void openFileChooser(ValueCallback uploadMsg,String acceptType)
// Android > 4.1.1 调用这个方法
public void openFileChooser(ValueCallback uploadMsg,String acceptType,String capture)
// For Android 5.0+
public boolean onShowFileChooser(WebView webView,ValueCallback<Uri[]> filePathCallback,WebChromeClient.FileChooserParams fileChooserParams)
之所以有这么几个方法，是因为不同的android版本，调用的方法不同，这也属于webview的一个坑。
5.0之前的方法中有一个ValueCallback类型的参数，这个是关键，其他的参数可自行了解含义。
我们需要把这个参数保留起来，然后在上述方法中实现具体的业务逻辑，通常就是弹出一个对话框，让用户选择是拍照还是从相册获取图片。
a.拍照
/**
* 拍照获取图片
*/
Uri captureUri = null;
private void getPhotoByCamera() throws IOException {
captureUri=null;
File captureFile = createImageFile(this);//创建图片文件
captureUri= Uri.fromFile(captureFile);
Intent it =newIntent(MediaStore.ACTION_IMAGE_CAPTURE);
it.putExtra(MediaStore.EXTRA_OUTPUT,captureUri);
it.putExtra("PhotoPath",captureFile.getAbsolutePath());
startActivityForResult(it,REQUEST_CODE_FILE_CAPTURE);
}
跟大部分的拍照代码很类似，核心关键是保留文件的Uri参数，在最后返回给用户
b.从相册选择相片
/**
* 从相册获取图片
*/
private void getPhotoByAlbums() {
Intent intent =newIntent(Intent.ACTION_PICK);
intent.setDataAndType(MediaStore.Images.Media.EXTERNAL_CONTENT_URI,"image/*");
startActivityForResult(intent,REQUEST_CODE_FILE_CHOOSER);
}
二、处理onActivityResult方法
protected void onActivityResult(int requestCode, int resultCode,Intent data) {
super.onActivityResult(requestCode,resultCode,data);
try{
if(requestCode == REQUEST_CODE_FILE_CHOOSER) {
if(null == mUploadMsg && null == mUploadMsgL) return;
Uri result = data ==null|| resultCode !=RESULT_OK?null: data.getData();
if(mUploadMsgL!=null) {
onActivityResultAboveL(requestCode,resultCode,data);
}else if(mUploadMsg!=null) {
String imagePath = UriUtil.getPath(this,result);//获取文件路径
//4.4以后，从相册获取的图片的uri通常是以content://开始，需要转换成file://形式的uri
if(!TextUtils.isEmpty(imagePath)) {
result = Uri.parse("file:///"+ imagePath);
}
mUploadMsg.onReceiveValue(result);
mUploadMsg=null;
}
}else if(requestCode ==REQUEST_CODE_FILE_CAPTURE) {
if(null==mUploadMsg&&null==mUploadMsgL)return;
Uri result =captureUri==null|| resultCode !=RESULT_OK?null:captureUri;
if(mUploadMsgL!=null) {
onActivityResultAboveL(requestCode,resultCode,data);
}else{
mUploadMsg.onReceiveValue(result);
mUploadMsg=null;
}
}
}catch(Exception e) {
e.printStackTrace();
}
}
@TargetApi(Build.VERSION_CODES.LOLLIPOP)
private void onActivityResultAboveL(intrequestCode, intresultCode,Intent data) {
if(requestCode !=REQUEST_CODE_FILE_CHOOSER||mUploadMsgL==null) {
return;
}
Uri[] results =null;
if(resultCode == Activity.RESULT_OK) {
if(data !=null) {
String dataString = data.getDataString();
//
//ClipData clipData = data.getClipData();
//if(clipData !=null) {
//results =newUri[clipData.getItemCount()];
//for(inti =0;i < clipData.getItemCount();i++) {
//ClipData.Item item = clipData.getItemAt(i);
//results[i] = item.getUri();
//}
//}
if(!TextUtils.isEmpty(dataString))
results =newUri[]{Uri.parse(dataString)};
}else{
if(data ==null) {
// If there is not data, then we may have taken a photo
if(captureUri!=null) {
results =newUri[]{captureUri};
}
}
}
}
mUploadMsgL.onReceiveValue(results);
mUploadMsgL=null;
}
大写的注意：一旦web触发了WebChromeClient的方法传递过来了ValueCallback（5.0及以上是ValueCallback<Uri[]>）参数，那么最终一定要调用参数的onReceiveValue方法,即如果在流程处理中出现了异常或者用户取消了流程，则需要调用onReceiveValue（null）,流程处理成功的时候传递相应数据即可。
直接贴代码了，有问题的后续可以直接联系我，QQ：862638161
