首页 > 解决方案 > 如何检查我的 Ionic 4 项目中的错误?

问题描述

我正在开发一个记录音频并在之后播放的应用程序(使用 Ionic 4、Angular、Typescript)。出于某种原因,当我在设备上进行测试时,在用户允许应用程序使用本地存储和麦克风后,它会毫无错误地崩溃。有没有办法记录正在发生的事情?我会留下我的 .html 和 .ts 文件。

audios.page.html

 <ion-row>
    <ion-col>
      <ion-button expand="full" (click)="capturarAudio()">Gravar áudio</ion-button>
    </ion-col>
  </ion-row>

  <ion-list>

    <ion-item *ngFor="let arquivo of mediaFiles" tappable (click)="play(arquivo)" text-wrap>
    {{ file.name }}
    <p>{{file.size / 1000 / 1000 | number }} MB </p>
    </ion-item>
  </ion-list> 

音频页面.ts

    import { Component, OnInit } from '@angular/core';
    import { MediaCapture } from '@ionic-native/media-capture/ngx';
    import { IonicStorageModule } from '@ionic/storage';
    import { Media, MediaObject  } from '@ionic-native/media/ngx';
    import { File } from '@ionic-native/file/ngx';
    import { Storage } from '@ionic/storage';

    const MEDIA_FILES_KEY = 'mediafiles';

    @Component({
      selector: 'app-audios',
      templateUrl: './audios.page.html',
      styleUrls: ['./audios.page.scss'],
    })
    export class AudiosPage implements OnInit {

      mediaFiles = [];
      constructor(private mediaCapture: MediaCapture, private storage: Storage, private media: Media, private file: File) { 


      }

      ionViewDidLoad(){

        this.storage.get(MEDIA_FILES_KEY).then(res => {
          this.mediaFiles = JSON.parse(res) || [];
        });
      }

      capturarAudio(){
        this.mediaCapture.captureAudio().then( res => {
          this.storeMediaFiles(res);
        })
      }

      play(myFile){
        console.log('play', myFile);
        if (myFile.name.indexOf('.wav') > -1){
          const audioFile: MediaObject = this.media.create(myFile.localURL)
          audioFile.play();
        }
      }

      storeMediaFiles(files){
        console.log('storage:', files);
        this.storage.get(MEDIA_FILES_KEY).then(res => {
          if (res) {
            let arr = JSON.parse(res);
            arr = arr.concat(files);
            this.storage.set(MEDIA_FILES_KEY, JSON.stringify(arr))
          } else {
            this.storage.set(MEDIA_FILES_KEY, JSON.stringify(files))
          }
          this.mediaFiles = this.mediaFiles.concat(files);
        })

      }

        ngOnInit() {
  }

}

EDIT1:使用 Logcat 我收到此错误:

E/PluginManager: Uncaught exception from plugin
    android.content.ActivityNotFoundException: No Activity found to handle Intent { act=android.provider.MediaStore.RECORD_SOUND }
        at android.app.Instrumentation.checkStartActivityResult(Instrumentation.java:1899)
        at android.app.Instrumentation.execStartActivity(Instrumentation.java:1589)
        at android.app.Activity.startActivityForResult(Activity.java:4229)
        at org.apache.cordova.CordovaActivity.startActivityForResult(CordovaActivity.java:343)
        at android.app.Activity.startActivityForResult(Activity.java:4187)
        at org.apache.cordova.CordovaInterfaceImpl.startActivityForResult(CordovaInterfaceImpl.java:68)
        at org.apache.cordova.mediacapture.Capture.captureAudio(Capture.java:234)
        at org.apache.cordova.mediacapture.Capture.execute(Capture.java:132)
        at org.apache.cordova.CordovaPlugin.execute(CordovaPlugin.java:98)
        at org.apache.cordova.PluginManager.exec(PluginManager.java:132)
        at org.apache.cordova.CordovaBridge.jsExec(CordovaBridge.java:59)
        at org.apache.cordova.engine.SystemExposedJsApi.exec(SystemExposedJsApi.java:41)
        at android.os.MessageQueue.nativePollOnce(Native Method)
        at android.os.MessageQueue.next(MessageQueue.java:323)
        at android.os.Looper.loop(Looper.java:136)
        at android.os.HandlerThread.run(HandlerThread.java:61)

标签: angulartypescriptionic-framework

解决方案


如果您查看有关 Android 权限的文档,您会发现以下步骤。

要查找您需要的权限,请查看此处。然后在下面的代码中使用它。由于 Android API >=26,因此必须在使用该资源之前立即调用 android 权限。


安装

在控制台中运行以下命令:

ionic cordova plugin add cordova-plugin-android-permissions
npm install @ionic-native/android-permissions

用法

import { AndroidPermissions } from '@ionic-native/android-permissions/ngx';


constructor(private androidPermissions: AndroidPermissions) { }

...

this.androidPermissions.checkPermission(this.androidPermissions.PERMISSION.CAMERA).then(
  result => console.log('Has permission?',result.hasPermission),
  err => this.androidPermissions.requestPermission(this.androidPermissions.PERMISSION.CAMERA)
);

this.androidPermissions.requestPermissions([this.androidPermissions.PERMISSION.CAMERA, this.androidPermissions.PERMISSION.GET_ACCOUNTS]);

推荐阅读