input 属性开启手机前置摄像头拍照

最新推荐文章于 2025-03-05 17:18:49 发布

Bright2017

最新推荐文章于 2025-03-05 17:18:49 发布

阅读量4.1k

点赞数 3

分类专栏：遇到过的问题网页中用到过的效果

本文链接：https://blog.csdn.net/Bright2017/article/details/105748868

版权

网页中用到过的效果同时被 2 个专栏收录

138 篇文章

订阅专栏

遇到过的问题

99 篇文章

订阅专栏

本文探讨了在移动端实现人脸识别的挑战，特别是前置摄像头的调用。通过HTML5的input标签，介绍了如何在不同设备上（如iOS、安卓8.0以上版本）成功启用前置摄像头进行拍照，并附上了部分手机型号的测试结果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

最近有个需求，需要做人脸识别，不用太过复杂，只需要拍照上传，和人脸对比接口进行对比即可。

调用摄像头这里让我很郁闷，因为要开启前置摄像头。原本打算使用Web AP( MediaDevices.getUserMedia )，但是这个不能拍照，可以开启摄像头然后Canvas截图保存，但是不适合移动端。

解决办法：

//1.开启视频录像
<input type="file" accept="video/*" capture="camcorder">
//2.开启录音 --- 测试无效
<input type="file" accept="audio/*" capture="microphone">
//3.开启拍照
<input type="file" accept="image/*" capture="camera" />

capture的值

user：手机前置摄像头，

environment：手机后置摄像头

注：capture属性值为user（前置摄像头）目前只有iOS 以及安卓8.0以上版本支持

测试手机

OPPOA5（前置可以开启）

OPPOA57（前置不能开启）

VIVOX23 （前置可以开启）

华为麦芒7（前置不能开启）

iPhone 6s Plus （前置可以开启）

参考资料：https://www.jianshu.com/p/cdccf0e80fa8

如果有帮到你的话，欢迎激励一下作者。