Ionic HTML5音频:本机控件未在Android上显示(离子电容器)

6rqinv9w  于 2023-05-21  发布在  Ionic
关注(0)|答案(1)|浏览(137)

我在我的电容器应用程序中使用HTML5音频播放音乐。在iOS上,本地音频控件显示出来,就像你在this screenshot中看到的那样。不幸的是,它不会出现在Android上。令人惊讶的是,如果我在浏览器中打开我的离子/电容器应用程序并按下播放,它会显示出来。查看Web-App:https://audio-player-sigma.vercel.app
这是我的代码:

const player = new Audio();

player.src = 'https://file-examples-com.github.io/uploads/2017/11/file_example_MP3_2MG.mp3';

player.onplay = () => {
  if ('mediaSession' in navigator) {
    navigator.mediaSession.metadata = new MediaMetadata({
      title: 'Lorem Ipsum',
      artist: 'Lorem Ipsum',
      album: 'Lorem Ipsum',
      artwork: [
        { src: 'https://dummyimage.com/96x96', sizes: '96x96', type: 'image/png' },
        { src: 'https://dummyimage.com/128x128', sizes: '128x128', type: 'image/png' },
        { src: 'https://dummyimage.com/192x192', sizes: '192x192', type: 'image/png' },
        { src: 'https://dummyimage.com/256x256', sizes: '256x256', type: 'image/png' },
        { src: 'https://dummyimage.com/384x384', sizes: '384x384', type: 'image/png' },
        { src: 'https://dummyimage.com/512x512', sizes: '512x512', type: 'image/png' },
      ]
    });
    console.log('init mediaSession metadata');
  } else {
    console.log('mediaSession not available');
  }
};

所以它在系统浏览器中工作,但在电容器构建的.apk中不工作。在iOS App上没有任何问题。一切正常。Github仓库:https://github.com/mariusbolik/capacitor-audio-player
有什么想法可以让它在android capacitor项目中工作吗?谢谢!

6l7fqoea

6l7fqoea1#

https://forum.ionicframework.com/t/struggling-with-music-controls/208360/2
Sadly, the native audio control isn’t displayed on android. So you might use the media controls plugin for this platform.
您将需要使用此:https://github.com/ingageco/capacitor-music-controls-plugin-v3
Android版。

相关问题