fix: 解决长时间暂停后重新播放资源过期问题

sigoden · Nov 8, 2021 · d57ff98 · d57ff98
1 parent f31f294
commit d57ff98
Show file tree

Hide file tree

Showing 3 changed files with 23 additions and 6 deletions.
diff --git a/src/background/store.js b/src/background/store.js
@@ -37,6 +37,8 @@ let audioState = { ...EMPTY_AUDIO_STATE, volumeMute: null }
 let persistData = null
 // 上次刷新时间
 let refreshAt = 0
+// 上次暂停时间
+let pausedAt = null
 
 const store = proxy({ ...COMMON_PROPS, dir: 1, chinaIp: null })
 
@@ -53,15 +55,22 @@ export function updateAudioTime (currentTime) {
   audio.play()
 }
 
-export function togglePlaying () {
+export async function togglePlaying () {
   let { playing } = store
   if (!audio) {
     return { playing }
   }
   if (playing) {
+    pausedAt = Date.now()
     audio.pause()
     playing = false
   } else {
+    if (pausedAt && Date.now() - pausedAt > 10 * 60 * 1000) {
+      const currentTime = audioState.currentTime
+      await loadAndPlaySong(store.selectedPlaylist, store.selectedSong.id, false)
+      updateAudioTime(currentTime)
+      pausedAt = null
+    }
     audio.play()
     playing = true
   }
@@ -129,7 +138,15 @@ export async function changePlaylist (playlistId) {
     const songsIndex = store.playMode === PLAY_MODE.SHUFFLE ? selectedPlaylist.shuffleIndexes : selectedPlaylist.normalIndexes
     songId = songsIndex[0]
   }
-  return loadAndPlaySong(selectedPlaylist, songId)
+  loadAndPlaySong(selectedPlaylist, songId)
+    .then(({ selectedSong }) => {
+      sendToPopup({ topic: 'sync', change: { selectedSong } })
+    })
+    .catch(err => {
+      sendToPopup({ topic: 'error', message: err.message })
+    })
+  store.selectedPlaylist = selectedPlaylist
+  return { selectedPlaylist, selectedSong: null }
 }
 
 export async function loadSongsMap () {
@@ -581,7 +598,6 @@ async function updateAudioSrc (src, playing) {
       return reject(audio.error)
     }
     audio.onloadedmetadata = () => {
-      console.log('onloadedmetadata')
       return resolve()
     }
   })

diff --git a/src/popup/PlayList.js b/src/popup/PlayList.js
@@ -28,7 +28,6 @@ export default function PlayList ({ maxHeight }) {
   const currentPlaylistId = selectedPlaylist?.id
   const playlistRefs = createRefs(playlists)
   useEffect(() => {
-    setLoading(true)
     storeUtils
       .loadSongsMap()
       .then(songsMap => setSongsMap(songsMap))
@@ -39,6 +38,7 @@ export default function PlayList ({ maxHeight }) {
   const [songs, songRefs] = useMemo(() => {
     const songs = selectedPlaylist?.normalIndexes
       .map(id => {
+        if (!songsMap[id]) return null
         if (id === songsMapChanged?.songId) {
           if (songsMapChanged?.op === 'invalid') {
             songsMap[id].valid = false
@@ -52,6 +52,7 @@ export default function PlayList ({ maxHeight }) {
     return [songs, songRefs]
   }, [selectedPlaylist, songsMap, songsMapChanged])
   const changePlaylist = id => {
+    setLoading(true)
     storeUtils.changePlaylist(id)
   }
   useEffect(() => {

diff --git a/src/popup/Player.js b/src/popup/Player.js
@@ -112,10 +112,10 @@ export default function Player () {
         <Grid container direction='column' sx={{ mx: 1 }}>
           <Grid item sx={{ display: 'flex', alignItems: 'baseline' }}>
             <Box sx={{ maxWidth: 175, whiteSpace: 'nowrap', textOverflow: 'ellipsis', overflow: 'hidden' }}>
-              {selectedSong?.name || ''}
+              {selectedSong?.name || '歌名'}
             </Box>
             <Box sx={{ ml: 2, maxWidth: 175, whiteSpace: 'nowrap', textOverflow: 'ellipsis', overflow: 'hidden', fontSize: '14px', opacity: 0.6 }}>
-              {selectedSong?.artists || ''}
+              {selectedSong?.artists || '歌手'}
             </Box>
           </Grid>
           <Grid item alignItems='center' sx={{ display: 'flex' }}>