h5调用摄像头 android,H5 使用移动端摄像头

某些场景下,需要 H5 脱离应用来使用手机系统的摄像头用于照相或者拍摄。

一、方案

目前而言,移动端使用 H5 调用摄像头有两种方案:

getUserMedia Api

这种方法的兼容很差,基本不考虑

input type=file capture

这种方法是目前的主流,兼容 IOS 和 Android,但是 Android 无法调用前置摄像头

其实真正费时间的就是方案的抉择,了解的方案的坑以及市面的流行方案后就可以开始写代码了(代码很简单,百度一大推)

二、案例

PS:非常重要的一点,如果是在 APP 的 webview 下使用该 API,需要APP端在代码层面开通相关的权限(相机、相册、录音,缺一不可),否则会出现闪退或者点击 input 无效的情况

三、代码实现

3.1 拍照

3.2 视频

3.3 其他处理

调用摄像头之后,一般会进行处理

(1)拍照

获取基本信息:file 属性基本满足

压缩:

import lrz from 'lrz';

/**

* 压缩 file

* @param {[type]} file [文件]

* @param {Number} setWidth [压缩大小]

* @return {[type]} [压缩后的文件]

*/

compressFile(file, setWidth = 750) {

return lr

  • 0
    点赞
  • 9
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值