时间戳

首页 > 解决方案 > 在 Android 浏览器上使用 Ionic QRScanner 的问题：放大太多

android - 在 Android 浏览器上使用 Ionic QRScanner 的问题：放大太多

问题描述

我在浏览器的 Ionic 4/Angular 应用程序中使用https://ionicframework.com/docs/native/qr-scanner。

该应用程序在笔记本电脑浏览器上运行良好，并且可以让相机预览和读取 QR 码。

但是，在 Android 浏览器上尝试时，相机放大太多，无法扫描代码。

在互联网上没有太多（只是人们要求将放大/缩小功能添加到插件中），我试图通过另一个插件（https://ionicframework.com/docs/native/camera-preview）控制相机变焦但它没有用。

有谁知道如何解决这个问题？

作为参考，我在此消息的末尾附加了我的代码。

谢谢，

  scanCode() {
    console.log('entering scan function');
    this.qrScanner.prepare()
    .then((status: QRScannerStatus) => {
      console.log('checking status');
       if (status.authorized) {
         this.statusScanning=true;
         // camera permission was granted
         console.log('camera permission granted');
         // start scanning
         this.scanSub = this.qrScanner.scan().subscribe( (scanRes: string) => {
          let object:any=scanRes;
          if(isDefined(object.result))
          {
            let text: string=""+object.result;
            this.myfunction(text);
            this.qrScanner.hide(); // hide camera preview
            this.scanSub.unsubscribe(); // stop scanning
          }
         });
       } else if (status.denied) {
         // camera permission was permanently denied
         // you must use QRScanner.openSettings() method to guide the user to the settings page
         // then they can grant the permission from there
         console.log('status denied');
       } else {
        console.log('permissions denied for now');
         // permission was denied, but not permanently. You can ask for permission again at a later time.
       }
    })
    .catch((e: any) => console.log('Error:', e));
  }

标签： androidbrowserionic4qr-code

解决方案

如果有人遇到与我相同的问题，我发现的最佳选择是放弃 QRScanner 组件并使用 jsQR。我遵循了本页教程中的原则（https://devdactic.com/pwa-qr-scanner-ionic/），一切正常。干杯，

推荐阅读