【问题标题】:How to get the file duration using Ionic File, Media and Media Object?如何使用离子文件、媒体和媒体对象获取文件持续时间?
【发布时间】:2020-01-03 00:54:07
【问题描述】:

我使用的是 Ionic 3,我使用了名为 Ionic Native - MediaIonic File 的本机插件。我正在使用我的移动设备在 android 中成功录制音频,并且播放按钮工作正常。但是我想获取音频文件的持续时间并显示持续时间的总长度。我还想在单击按钮时显示当前持续时间。

这是我的 home.html

中的代码
<ion-header>
  <ion-navbar>
    <ion-title>
      Sound Recorder & Player
    </ion-title>
  </ion-navbar>
</ion-header>

<ion-content padding>
  <ion-card>
    <ion-card-content>
      <ion-card-title>
        <button ion-button primary (click)="stopRecord()" *ngIf="recording"><ion-icon name="mic-off"></ion-icon>&nbsp;&nbsp;Stop Record</button>
        <button ion-button primary (click)="startRecord()" *ngIf="!recording"><ion-icon name="mic"></ion-icon>&nbsp;&nbsp;Start Record</button>
      </ion-card-title>
    </ion-card-content>
  </ion-card>
  <ion-list>
    <ion-item *ngFor="let audio of audioList; index as i;">
      <p>{{audio.filename}}</p>
      <button ion-button clear item-end large (click)="playAudio(audio.filename, i)"><ion-icon name="play"></ion-icon></button>
    </ion-item>
  </ion-list>
</ion-content>

这是我的 home.ts

中的代码
import { Component } from '@angular/core';
import { NavController, Platform } from 'ionic-angular';
import { Media, MediaObject } from '@ionic-native/media';
import { File } from '@ionic-native/file';

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {

  recording: boolean = false;
  filePath: string;
  fileName: string;
  audio: MediaObject;
  audioList: any[] = [];

  constructor(
    public navCtrl: NavController,
    private media: Media,
    private file: File,
    public platform: Platform
  ) {

  }

  ionViewWillEnter() {
    this.getAudioList();
  }

  getAudioList() {
    if(localStorage.getItem("audiolist")) {
      this.audioList = JSON.parse(localStorage.getItem("audiolist"));
      console.log(this.audioList);
    }
  }

  startRecord() {
    if (this.platform.is('ios')) {
      this.fileName = 'record'+new Date().getDate()+new Date().getMonth()+new Date().getFullYear()+new Date().getHours()+new Date().getMinutes()+new Date().getSeconds()+'.3gp';
      this.filePath = this.file.documentsDirectory.replace(/file:\/\//g, '') + this.fileName;
      this.audio = this.media.create(this.filePath);
    } else if (this.platform.is('android')) {
      this.fileName = 'record'+new Date().getDate()+new Date().getMonth()+new Date().getFullYear()+new Date().getHours()+new Date().getMinutes()+new Date().getSeconds()+'.3gp';
      this.filePath = this.file.externalDataDirectory.replace(/file:\/\//g, '') + this.fileName;
      this.audio = this.media.create(this.filePath);
      let duration = this.audio.getDuration();
      console.log(duration)
    }
    this.audio.startRecord();
    this.recording = true;
  }

  stopRecord() {
    this.audio.stopRecord();
    let duration = this.audio.getDuration()
    console.log(duration)
    let data = { filename: this.fileName };
    this.audioList.push(data);
    localStorage.setItem("audiolist", JSON.stringify(this.audioList));
    this.recording = false;
    this.getAudioList();
  }

  playAudio(file,idx) {
    if (this.platform.is('ios')) {
      this.filePath = this.file.documentsDirectory.replace(/file:\/\//g, '') + file;
      this.audio = this.media.create(this.filePath);
    } else if (this.platform.is('android')) {
      this.filePath = this.file.externalDataDirectory.replace(/file:\/\//g, '') + file;
      this.audio = this.media.create(this.filePath);
      let duration = this.audio.getDuration()
      console.log('Duration:', duration)
    }
    this.audio.play();
    this.audio.setVolume(1.0);
  }

}

我尝试console.log getDuration() 函数,这是在Media 的文档中编写的。但是它总是返回我 -1

这里有什么想法吗?

如果有人可以提供帮助,我们将不胜感激。 提前致谢。

【问题讨论】:

    标签: file ionic-framework ionic3 media


    【解决方案1】:

    您正在使用:
    let duration = this.audio.getDuration(); console.log(duration)

    开始录制之前:

     if (this.platform.is('ios')) {
      this.fileName = 'record'+new Date().getDate()+new Date().getMonth()+new Date().getFullYear()+new Date().getHours()+new Date().getMinutes()+new Date().getSeconds()+'.3gp';
      this.filePath = this.file.documentsDirectory.replace(/file:\/\//g, '') + this.fileName;
      this.audio = this.media.create(this.filePath);
    } else if (this.platform.is('android')) {
      this.fileName = 'record'+new Date().getDate()+new Date().getMonth()+new Date().getFullYear()+new Date().getHours()+new Date().getMinutes()+new Date().getSeconds()+'.3gp';
      this.filePath = this.file.externalDataDirectory.replace(/file:\/\//g, '') + this.fileName;
      this.audio = this.media.create(this.filePath);
      ------>let duration = this.audio.getDuration();<-----
      console.log(duration)
    }
    ------>this.audio.startRecord();<-----
    this.recording = true;
    


    你确定你在寻找正确的console.log()吗?请尝试删除第一个console.log()

    【讨论】:

      【解决方案2】:

      如果 file.getDuration() 给出 -1,使用 videoEditor

       import { VideoEditor } from '@ionic-native/video-editor/ngx';
      
       getvideoinfo(fileUri) {
          this.videoEditor.getVideoInfo({ fileUri: fileUri }).then((videoInfo) => {
            alert(videoInfo.duration);
            this.mediaduration = videoInfo.duration;
          }).catch((error) => {
            alert(error);
          });
        }
      

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2016-03-06
        • 1970-01-01
        • 2015-11-27
        • 1970-01-01
        • 2016-12-26
        • 1970-01-01
        相关资源
        最近更新 更多