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

Question

我正在使用 ionic-native-media 和 ionic-native-music-controls 插件开发 Internet 广播流应用程序。

问题是当我按下 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

解决方案一：

Ionic Native Media 插件:

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

方案二：

目前最佳方案

使用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>

有帮助link：

Control Audio Buffering

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

Stop loading radio stream in background after stop action

ionic-framework

ionic2

ionic-native