Question

我正在使用ionic-native-media和ionic-native-music-controls 插件处理互联网广播流应用。

问题是当我按下stop按钮音频停止播放但网络标签内 Chrome开发者工具流仍然是加载。有完全停止流媒体的解决方案吗？

代码：

export class RadioPage {
  file: MediaObject;
  constructor(
    public musicControls: MusicControls,
    public media: Media,
    public navCtrl: NavController
  ) { }

  settingMusicControl() {
    this.musicControls.destroy();
    this.musicControls.create({
      track: 'Radio', 
      artist: 'Live Stream', 
      cover: '',   
      isPlaying: true,
      dismissable: true,
      hasPrev: false, 
      hasNext: false,
      hasClose: true,
      hasSkipForward: false,
      hasSkipBackward: false,
      skipForwardInterval: 15,
      skipBackwardInterval: 15,
      album: 'Test Album',
      duration: 0,
      elapsed: 0,
      ticker: 'Ticker'
    });
    this.musicControls.subscribe().subscribe(action => {
      const message = JSON.parse(action).message;
      console.log('message', message);
      switch (message) {
        case 'music-controls-next':
          break;
        case 'music-controls-previous':
          break;
        case 'music-controls-pause':
          this.file.stop();
          this.musicControls.listen();
          this.musicControls.updateIsPlaying(false);
          break;
        case 'music-controls-play':
          this.file.play();
          this.musicControls.listen();
          this.musicControls.updateIsPlaying(true);
          break;
        case 'music-controls-destroy':
          break;
        case 'music-controls-toggle-play-pause':
          break;
        case 'music-controls-seek-to':
          break;
        case 'music-controls-skip-forward':
          break;
        case 'music-controls-skip-backward':
          break;
        case 'music-controls-media-button':
          break;
        case 'music-controls-headset-unplugged':
          break;
        case 'music-controls-headset-plugged':
          break;
        default:
          break;
      }
    });
    this.musicControls.listen();
    this.musicControls.updateIsPlaying(true);
  }

  play() {
    this.file = this.media.create('http://streaming.tdiradio.com:8000/house.mp3');
    this.file.play();
    this.settingMusicControl();
  }

  stop() {
    this.file.stop();
    this.musicControls.listen();
    this.musicControls.updateIsPlaying(false);
  }

}

Chrome开发者工具：

Answer 1

解决方案1：

Ionic Native Media插件：

需要this.file.stop();才能调用另一个函数this.file.release();

解决方案2：

目前最好的解决方案

使用HTML5 Audio Object：

var url = 'http://streaming.tdiradio.com:8000/house.mp3';
var stream = new Audio(url);
stream.preload = 'none';

function play() {
  stream.play();
}

function pause() {
  stream.pause();
  stream.src = ''
  stream.load();
  
  stream = null;
  
  stream = new Audio();
  stream.src = url;
  stream.preload = 'none';
}

<button onclick='play()'>Play</button>
<button onclick='pause()'>Pause</button>

有用的链接：

Control Audio Buffering

停止动作后停止在后台加载无线电流

1 个答案: