关于webview适配H5上传照片或者视频文件的方法

一、必要实现的成果：

用H5实现的App中必要在H5获取手机中的照片可能视频文件上传随处事器。

二、说明实现要领：

因为不懂前端开拓，不知道H5中有 input file之类的标签控件，可以用来选择文件，刚开始的思绪照旧想着native 端是否要通过提供inputstream流方法，将文件内容转达给JS。其后和前端雷同之后，H5在电脑端都是用input 配置type为 file 来实现文件选择成果，于是才开始搜刮资料，发明时必要在webview中配置  setWebChromeClient ，个中有对input 的相应回调:

三、详细实现：

前端代码

<input type="file" accept="*/*" name="choose file"> <input type="file" accept="image/*" name="choose image"> <input type="file" accept="video/*" name="choose video"> <input type="file" accept="image/example" name="take photo and upload image"> <input type="file" accept="video/example" name="take video and upload video">

native端代码：

@RequiresApi(api = Build.VERSION_CODES.LOLLIPOP) @Override public boolean onShowFileChooser(WebView webView, ValueCallback<Uri[]> filePathCallback, WebChromeClient.FileChooserParams fileChooserParams) { mFilePathCallbacks = filePathCallback; // TODO: 按照标签中得吸取范例，启动对应的文件范例选择器 String[] acceptTypes = fileChooserParams.getAcceptTypes(); for (String type : acceptTypes) { Log.d(TAG, "acceptTypes=" + type); } // 针对照相后马长进入上传状态处理赏罚 if ((acceptTypes.length > 0) && acceptTypes[0].equals("image/example")) { Log.d(TAG, "onShowFileChooser takePhoto"); Intent it = CameraFunction.takePhoto(mContext); startActivityForResult(it, TAKE_PHOTO_AND_UPLOAD_REQUEST); return true; } // 针对录像后马长进入上传状态处理赏罚 if ((acceptTypes.length > 0) && acceptTypes[0].equals("video/example")) { Log.d(TAG, "onShowFileChooser record video"); Intent it = CameraFunction.recordVideo(mContext); startActivityForResult(it, RECORD_VIDEO_AND_UPLOAD_REQUEST); return true; } Intent intent = new Intent(Intent.ACTION_GET_CONTENT); intent.addCategory(Intent.CATEGORY_OPENABLE); if (acceptTypes.length > 0) { if (acceptTypes[0].contains("image")) { intent.setType("image/*"); } else if (acceptTypes[0].contains("video")) { intent.setType("video/*"); } else { intent.setType("*/*"); } } else { intent.setType("*/*"); } WebViewActivity.this.startActivityForResult(Intent.createChooser(intent, "File Chooser"), REQUEST_FILE_PICKER); return true; }

回调配置uri

/** * 配置input 标签出发的回调选择文件路径，优先行使path参数， * 其次行使uri参数 * @param uriParam * @param pathParam */ private void setFilePathCallback(Uri uriParam, String pathParam) { //都为空，则配置null if (uriParam == null && pathParam == null) { if (mFilePathCallback != null) { mFilePathCallback.onReceiveValue(null); } if (mFilePathCallbacks != null) { mFilePathCallbacks.onReceiveValue(null); } } else if (null != pathParam) { // 优先行使path if (mFilePathCallback != null) { Uri uri = Uri.fromFile(new File(pathParam)); mFilePathCallback.onReceiveValue(uri); } if (mFilePathCallbacks != null) { Uri uri = Uri.fromFile(new File(pathParam)); mFilePathCallbacks.onReceiveValue(new Uri[] { uri }); } } else if (null != uriParam) { //其次行使uri if (mFilePathCallback != null) { String path = UriUtils.getPath(getApplicationContext(), uriParam); Uri uri = Uri.fromFile(new File(path)); mFilePathCallback.onReceiveValue(uri); } if (mFilePathCallbacks != null) { String path = UriUtils.getPath(getApplicationContext(), uriParam); Uri uri = Uri.fromFile(new File(path)); mFilePathCallbacks.onReceiveValue(new Uri[] { uri }); } } mFilePathCallback = null; mFilePathCallbacks = null; }

针对各个哀求场景举办处理赏罚：

public void onActivityResult(int requestCode, int resultCode, Intent intent) {

总结：既然用H5开拓APP，就必要相识前端，不懂就要问了。查询偏向要对，不然背道而驰，偏向偶然辰比全力重要！

到此这篇关于关于webview适配H5上传照片可能视频文件的要领的文章就先容到这了,更多相干webview适配H5上传照片内容请搜刮剧本之家早年的文章或继承赏识下面的相干文章，但愿各人往后多多支持剧本之家！

（编辑：湖南网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!