uni.chooseImage最简单可靠,适合90%拍照需求;需前置摄像头时须用<camera>组件或uni.chooseVideo;权限配置、真机调试和平台差异是关键难点。
直接调用 uni.chooseimage 是最简单、兼容性最好的方式,无需写额外权限逻辑或处理 camera 组件嵌套限制,90% 的拍照需求用它就够了。
uni.chooseImage 调用前置/后置摄像头
它本身不直接支持 camera 参数(那是 uni.chooseVideo 才有的),但可通过 sourceType: ['camera'] 强制唤起相机,并在真机上默认使用后置。要切前置,得靠平台差异处理:
- iOS 和多数 Android:无法通过
uni.chooseImage指定前后置,系统按设备默认行为打开(通常是后置) - 微信小程序:可配合
capture属性(仅 H5 不支持),但 uni-app 封装层未透出该能力,实际不可控 - 真正需要前置时,必须换用
uni.chooseVideo(哪怕只拍 1 帧)或<camera>组件
所以如果你只要“拍照”,别纠结前后置控制——uni.chooseImage 简单可靠;如果明确要求前置(比如人脸采集),请跳到下一部分。
<camera> 组件中调用前置摄像头
这是唯一能稳定指定 device-position="front" 的方式,但代价是跨平台约束多:
- 微信小程序中,
<camera>必须是<template>下的**直接子节点**,不能包在<view>或条件编译块里,否则白屏或报错 - App 端无此限制,但为统一,建议所有平台都写成:
<template> <camera device-position="front" style="width: 100%; height: 100vh;"></camera> </template>
- 拍照必须用
uni.createCameraContext()+takePhoto(),不能混用startRecord()—— 小程序里它们互斥,调了录像再拍照会静默失败 - 闪光灯、缩放等属性在 iOS 和部分安卓机型上可能无效,不要依赖 UI 反馈做业务判断
权限和真机调试绕不开的坑
几乎所有失败都卡在这三步,不是代码问题,而是环境没配对:
-
manifest.json中必须声明权限:"app-plus": { "permissions": ["camera"] }, "h5": { "requiredPermissions": ["camera"] } - 微信小程序需在
pages.json配置:"permission": { "scope.camera": { "desc": "用于拍照上传" } } - H5 页面必须跑在 HTTPS 或
localhost下,HTTP 协议下getUserMedia直接拒绝,且不会抛错,只会静默失败 - 模拟器和 HBuilderX 内置浏览器无法调用真实摄像头,**必须用真机测试**;iOS 上还可能出现授权弹窗不出现、或点了允许却没回调的情况,此时加个 3 秒超时提示更稳妥
真正麻烦的从来不是 API 怎么写,而是每个平台对“用户授权”这件事的理解完全不同:iOS 静默拒绝不报错,小程序授权后下次进页面还得重新检查,H5 则完全依赖浏览器策略。把权限校验逻辑写结实,比优化拍照画质重要得多。


















