微信小步伐摄像头权限状态同步获取判断前端体现以及多次授权弹窗的问题 - ToB企服应用市场:ToB评测及商务社交产业平台

// utils/cameraPermission.js
/**
* 检查摄像头权限
* @returns {Promise<boolean>} 返回一个 Promise，表示是否已授权
*/
function checkCameraPermission() {
return new Promise((resolve, reject) => {
wx.getSetting({
success(res) {
resolve(!!res.authSetting['scope.camera']);
},
fail(err) {
reject(err);
}
});
});
}
/**
* 请求摄像头权限
* @returns {Promise<boolean>} 返回一个 Promise，表示是否授权成功
*/
function requestCameraPermission() {
return new Promise((resolve, reject) => {
wx.authorize({
scope: 'scope.camera',
success() {
resolve(true);
},
fail() {
resolve(false);
}
});
});
}
/**
* 检查并请求摄像头权限
* @returns {Promise<boolean>} 返回一个 Promise，表示是否已授权
*/
function checkAndRequestCameraPermission() {
return new Promise(async (resolve, reject) => {
try {
let isAuthorized = await checkCameraPermission();
if (isAuthorized) {
resolve(true);
return;
}
// 用户未授权，尝试请求授权
isAuthorized = await requestCameraPermission();
if (isAuthorized) {
resolve(true);
return;
}
// 用户拒绝授权，提示用户前往设置
wx.showModal({
title: '提示',
content: '您未授权摄像头权限，是否前往设置？',
success(modalRes) {
if (modalRes.confirm) {
wx.openSetting({
success(settingData) {
resolve(!!settingData.authSetting['scope.camera']);
},
fail(err) {
reject(err);
}
});
} else {
// 用户拒绝前往设置，不再提示
resolve(false);
}
}
});
} catch (err) {
reject(err);
}
});
}
module.exports = {
checkAndRequestCameraPermission
};

复制代码

<camera wx:if="{{cameraShow}}" mode="scanCode" frame-size='large' flash="{{ cameraFlash }}" class="scan-view" bindscancode='scancode'>
<view >
<t-icon name="close" class="arrowBack" size="60rpx" />
<span>{{title}}</span>
<span style="width: 100rpx;"></span>
</view>
<view class="cameratips" wx:if="{{!hasCameraPermission}}">您未开启摄像头权限</view>
</camera>

复制代码

const animation = wx.createAnimation({}); // 创建移动动画对象
// const innerAudioContext = wx.createInnerAudioContext() // 提示音
// innerAudioContext.src = ' mp3 文件网络地址 '
const { checkAndRequestCameraPermission } = require('../../../utils/cameraPermission');
Page({
/**
* 页面的初始数据
*/
data: {
canScan: true,
deviceId:'',
hasCameraPermission: false,
cameraShow:false,
cameraContext: null
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
this.checkAndRequestPermission();
// 监听应用显示事件
this.appShowHandler = () => {
this.checkAndRequestPermission();
};
wx.onAppShow(this.appShowHandler);
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
// 页面卸载时移除事件监听
if (this.appShowHandler) {
wx.offAppShow(this.appShowHandler);
}
// 确保在页面卸载时关闭摄像头
this.stopUsingCamera();
},
async checkAndRequestPermission() {
try {
const isAuthorized = await checkAndRequestCameraPermission();
this.setData({ hasCameraPermission: isAuthorized,cameraShow:true });
if (isAuthorized) {
this.startUsingCamera();
} else {
this.stopUsingCamera();
}
} catch (err) {
console.error('检查和请求摄像头权限时出错:', err);
}
},
startUsingCamera() {
// 创建摄像头上下文
const cameraContext = wx.createCameraContext();
this.setData({ cameraContext }, () => {
// 确保在数据更新后再打开摄像头
this.openCamera(cameraContext);
});
},
openCamera(cameraContext) {
// 这里可以添加具体的打开摄像头逻辑
console.log('尝试打开摄像头');
// 示例：拍照
cameraContext.takePhoto({
quality: 'high',
success: (res) => {
console.log('拍照成功', res.tempImagePath);
},
fail: (err) => {
console.error('拍照失败', err);
}
});
},
stopUsingCamera() {
this.setData({ cameraShow:false })
// 停止使用摄像头的逻辑
console.log('停止使用摄像头');
// 销毁摄像头上下文
if (this.data.cameraContext) {
this.data.cameraContext = null;
this.setData({ cameraShow:true })
}
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
},
// 添加扫描动画
startAnimation() {
let down = true
setInterval(() => {
if (down) {
animation.translateY(100).step({ duration: 3000 })
} else {
animation.translateY(0).step({ duration: 3000 })
}
down = !down
this.setData({ animation: animation.export() })
}, 3000)
},
scancode(event) {
// if (!this.data.canScan) {
// return; // 如果不能扫码，直接返回
// }
// this.setData({ canScan: false }); // 设置为不能扫码
// wx.vibrateShort() // 触发手机振动
// innerAudioContext.play() // 提示音
const { result } = event.detail // 获取校验扫描结果
this.setData({
deviceId:result
})
},
})

复制代码