diff --git a/src/model/api/music.ts b/src/model/api/music.ts index d3ffb32..c9066cf 100644 --- a/src/model/api/music.ts +++ b/src/model/api/music.ts @@ -26,7 +26,7 @@ export interface MusicLyricModel { } export interface MusicPlayerItem { - id?: number + id: number title: string artist: string | undefined album?: string | undefined diff --git a/src/views/api/Music.vue b/src/views/api/Music.vue index 5ac5c0d..9840606 100644 --- a/src/views/api/Music.vue +++ b/src/views/api/Music.vue @@ -142,7 +142,7 @@ - + @@ -187,6 +187,7 @@ export default class Music extends BaseList { // 是否正在播放音乐 musicPlaying: boolean = false musicList: MusicPlayerItem[] = [] + currentMusic?: MusicPlayerItem created() { this.$http.get('/api/v1/music/listLibs').then(data => { this.musicLibs = data @@ -215,8 +216,9 @@ export default class Music extends BaseList { async playMusic() { try { const data = await this.$http.get('/api/v1/music/list/all', {params: selectedIds.length ? {ids: selectedIds} : this.search}) - this.musicList = data.map((item: MusicModel) => { + this.musicList = data.map((item: MusicModel, index: number) => { const musicItem: MusicPlayerItem = { + id: index, title: item.title || item.name, artist: item.artist, src: `/api/v2/common/music/load/${item._id}`, @@ -227,7 +229,7 @@ export default class Music extends BaseList { } return musicItem }) - // 删除原本可能存在的播放器配置(包含播放地址 时间进度等信息) + this.currentMusic = this.musicList[0] this.musicPlaying = true } catch (err) { console.error(err) @@ -307,23 +309,23 @@ export default class Music extends BaseList { * 创建媒体信息 */ musicPlay() { - if(!('mediaSession' in window.navigator)) return; + if(!('mediaSession' in window.navigator) || !this.currentMusic) return; const player = this.$refs.player - const currentMusic = player.currentMusic const mediaSession: any = navigator.mediaSession + const currentId = this.currentMusic.id mediaSession.metadata = new MediaMetadata({ - title: currentMusic.title, - artist: currentMusic.artist, - album: currentMusic.album, - artwork: [{src: currentMusic.pic}] - }); + title: this.currentMusic.title, + artist: this.currentMusic.artist, + album: this.currentMusic.album, + artwork: [{src: this.currentMusic.pic}] + }) + const currentIndex = this.musicList.findIndex(item => item.id === currentId) mediaSession.setActionHandler('play', () => { // 播放 player.play() }) mediaSession.setActionHandler('pause', () => { // 暂停 player.pause() }) - const currentIndex = this.musicList.findIndex(item => item.src === currentMusic.src) mediaSession.setActionHandler('previoustrack', () => { // 上一首 if (currentIndex === 0) { // 已经是第一首 player.switch(this.musicList.length - 1)