camera

基础库 1.6.0 开始支持,低版本需做兼容处理

系统相机。扫码二维码功能,需升级微信客户端至6.7.3。需要用户授权 scope.camera

相关api:wx.createCameraContext

属性 类型 默认值 必填 说明 最低版本
mode string normal 应用模式,只在初始化时有效,不能动态变更 2.1.0
device-position string back 摄像头朝向 1.0.0
flash string auto 闪光灯,值为auto, on, off 1.0.0
frame-size string medium 指定期望的相机帧数据尺寸 2.7.0
bindstop eventhandle 摄像头在非正常终止时触发,如退出后台等情况 1.0.0
binderror eventhandle 用户不允许使用摄像头时触发 1.0.0
bindinitdone eventhandle 相机初始化完成时触发 2.7.0
bindscancode eventhandle 在扫码识别成功时触发,仅在 mode="scanCode" 时生效 2.1.0

mode 的合法值

说明 最低版本
normal 相机模式
scanCode 扫码模式

device-position 的合法值

说明 最低版本
front 前置
back 后置

flash 的合法值

说明 最低版本
auto 自动
on 打开
off 关闭

frame-size 的合法值

说明 最低版本
small 小尺寸帧数据
medium 中尺寸帧数据
large 大尺寸帧数据

Bug & Tip

  1. tip: 同一页面只能插入一个 camera 组件
  2. tip:请注意原生组件使用限制
  3. tip:onCameraFrame 接口根据 frame-size 返回不同尺寸的原始帧数据,与 Camera 组件展示的图像不同,其实际像素值由系统决定

示例代码

在开发者工具中预览效果

<!-- camera.wxml -->
<camera device-position="back" flash="off" binderror="error" style="width: 100%; height: 300px;"></camera>
<button type="primary" bindtap="takePhoto">拍照</button>
<view>预览</view>
<image mode="widthFix" src="{{src}}"></image>
// camera.js
Page({
  takePhoto() {
    const ctx = wx.createCameraContext()
    ctx.takePhoto({
      quality: 'high',
      success: (res) => {
        this.setData({
          src: res.tempImagePath
        })
      }
    })
  },
  error(e) {
    console.log(e.detail)
  }
})