㈠ vue 做 h5 怎么实现 扫码功能调用手机相机扫码
这个和vue没关系
<input type="file" accept="image/*" capture="camera">
在页面导入二维码解析库,用相机识别二维码,再用库进行识别
兼容性不好
㈡ H5调用本地相册/相机上传图片
在开发中有时候会用到H5调用本地图片粗伏或者相机,像第三方的实名认证,在线客服等蔽凳档等都需要上宏乱传图片。H5中只需要通过 <input> 调用即可,ios是可以的实现的,不需要自己处理,除非客户端压缩图片,但是Android中需要自己处理,比较坑,本文记录H5调用本地图片或者相机的实现过程以及遇到的问题。
H5主要是通过 input 标签来获取图片
通过 WebView 加载 h5 页面,监听 WebView 对应的方法,实现自己的逻辑。
当点击 input 标签的时候会调用 WebChromeClient 的 onShowFileChooser() 方法(5.0+)或者 openFileChooser() 方法(3.0+)在改方法中处理自己逻辑,这里是弹出一个原生的选择框,选择从相册还是拍照获取图片。
拍照和打开相册功能封装到了 PhotoUtils 工具类中了。
file_paths.xml
从相册中选择
onActivityResult() 方法处理
这里使用 Luban 压缩以后再上传的