uni-app uni.scanCode 扫描二维码打开后镜头是反转的

uni-app uni.scanCode 扫描二维码打开后镜头是反转的

产品分类：

uniapp/App

PC开发环境操作系统：

Windows

PC开发环境操作系统版本号：

Windows 11 家庭中文版24H2

HBuilderX类型：

正式

HBuilderX版本号：

4.66

手机系统：

Android

手机系统版本号：

Android 13

手机厂商：

pda

手机机型：

pda

页面类型：

vue

vue版本：

vue3

打包方式：

云端

项目创建方式：

HBuilderX

示例代码：

uni.scanCode 扫描二维码，打开后镜头是反转的,摄像头拍摄照片正常

操作步骤：

触发扫码

预期结果：

画面正常

实际结果：

反转

bug描述：

uni.scanCode 扫描二维码，打开后镜头是反转的,摄像头拍摄照片正常


更多关于uni-app uni.scanCode 扫描二维码打开后镜头是反转的的实战教程也可以访问 https://www.itying.com/category-93-b0.html

2 回复

提供一下图片效果，没有见到过类似的问题

更多关于uni-app uni.scanCode 扫描二维码打开后镜头是反转的的实战教程也可以访问 https://www.itying.com/category-93-b0.html


这是一个已知的uni-app扫码组件在部分Android设备上的兼容性问题。问题根源在于设备厂商对摄像头预览画面的镜像处理逻辑不一致。

解决方案：

  1. 检查设备摄像头参数 在调用uni.scanCode前，可以通过plus.camera.getCamera()获取摄像头信息，确认前后摄像头ID：
plus.camera.getCamera().then(cameras => {
    console.log('可用摄像头:', cameras)
})
  1. 使用原生扫码插件替代 推荐使用HTML5+的原生扫码模块，可以更精确控制摄像头：
const barcode = plus.barcode.create('qr', {
    scanType: [plus.barcode.QR]
})
barcode.start()
  1. 临时解决方案 在扫码页面添加CSS镜像变换：
/* 仅针对扫描预览容器 */
.camera-preview {
    transform: scaleX(-1);
}
回到顶部