微信小程序 相机授权操作

微信小程序 相机授权操作

相机授权页面，点击按钮校验权限，如果还没有授权，则弹出微信授权提示弹窗，如果接受，弹窗消失，再点一次相机按钮则直接进入相机camera页面，相机页面会开启摄像头。
如果授权弹窗是拒接，还可以点击按钮再次唤起授权弹窗。

相机授权页面

<view>
<view class="ocr1-text-1">按提示操作</view>
    <view class="ocr1-text-2">点击开启摄像头按钮进行授权</view>
    <view wx:if="{{!isNeedSettingButton}}" class="big-button" bindtap="openCamera">
          开启摄像头
    </view>
    <view wx:else class="button-outer">
              <button class="open" open-type="openSetting" bindopensetting="getCameraSetting">
                  开启摄像头
              </button>
    </view>
</view>

// js
data: {
    // isAuth: false,
    isNeedSettingButton: false
  },
  directToNext () {
    wx.redirectTo({
      url: '../../take/face-camera/camera'
    })
  },
  openCamera () {
    this.directToNext()
  },
  getCameraSetting () {
    const _this = this
    wx.getSetting({
      success: res => {
        if (res.authSetting['scope.camera']) {
          // 用户已经授权
          _this.setData({
            // isAuth: true,
            isNeedSettingButton: false
          })
        } else {
          // 用户还没有授权，向用户发起授权请求
          wx.authorize({
            scope: 'scope.camera',
            success() { // 用户同意授权
              _this.setData({
                // isAuth: true,
                isNeedSettingButton: false
              })
            },
            fail() { // 用户不同意授权
              _this.setData({
                isNeedSettingButton: true
              })
              wx.showToast({
                title: '授权失败',
                icon: 'none',
                duration: 3000
              })
            }
          })
        }
      },
      fail: res => {
        console.log('获取用户授权信息失败')
        wx.showToast({
          title: '获取用户授权信息失败',
          icon: 'none',
          duration: 3000
        })
        _this.setData({
          isNeedSettingButton: true
        })
      }
    })
  },
/*
  watchIsAuth () {
    let val = ''
    Object.defineProperty(this.data, 'isAuth', {
      set (newVal) {
        if (newVal) {
          let timer = setTimeout(() => {
            clearTimeout(timer)
            timer = null
          }, 6000)
        }
        val = newVal
      },
      get () {
        return val
      }
    })
  },
*/
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    this.getCameraSetting()
  },

相机camera页面

<view class="container" style="position: relative;">
  <camera device-position="front" flash="off" binderror="error" style="width: 100%; height: 100%;"> 
  </camera>
  <view class="container cover-camera-layout">
    <image src="../../../images/face-human.png" mode="widthFix" class="human"></image>
  </view>
</view>