html5调用手机摄像头

39次阅读

共计 610 个字符,预计需要花费 2 分钟才能阅读完成。

曾经做过一个项目, 仿照当下最火的军装照页面,做出图片融合效果。当时的整个项目组都动容了,太难了,总共用了三种方案

1、canvas
2、python opencv
3、C++

这些不是重点,重点是在上传照片调取摄像头功能

上传照片 <input type=’file’> 标签,如果调用摄像头,很多小伙伴就会想到 js 各种 API,但最终一无所获,其实 html5 就可以解决

<input type="file" accept="image/*" capture="camera">
<input type="file" accept="video/*" capture="camcorder">
<input type="file" accept="audio/*" capture="microphone">

capture 表示可以捕获到系统默认的设备
accept 表示直接打开系统文件目录
camera 表示摄像头
camcorder 表示摄像机
microphone 表示录音

在给大家普及一下 multiple 属性,表示可以支持多选

<input type="file" accept="image/*" multiple>

加上 multiple 标签 capture 就没什么用了,
注意:本人亲测,multiple 在 ios 下好用,android 下不好使

虽然 javascript 是弱类型语言,受限于设备,但是随着技术的逐渐更新,设备机能的逐渐高新,我相信 javascript 逐渐会越来越强大的。

正文完
 0