feat: cache track details, lyrics and album

src/api/track.js

@@ -1,6 +1,13 @@
 import store from '@/store';
 import request from '@/utils/request';
 import { mapTrackPlayableStatus } from '@/utils/common';
+import {
+  cacheTrackDetail,
+  getTrackDetailFromCache,
+  cacheLyric,
+  getLyricFromCache,
+} from '@/utils/db';
+
 /**
  * 获取音乐 url
  * 说明 : 使用歌单详情接口后 , 能得到的音乐的 id, 但不能得到的音乐 url, 调用此接口, 传入的音乐 id( 可多个 , 用逗号隔开 ), 可以获取对应的音乐的 url,
@@ -21,38 +28,70 @@ export function getMP3(id) {
     },
   });
 }
+
 /**
  * 获取歌曲详情
  * 说明 : 调用此接口 , 传入音乐 id(支持多个 id, 用 , 隔开), 可获得歌曲详情(注意:歌曲封面现在需要通过专辑内容接口获取)
  * @param {string} ids - 音乐 id, 例如 ids=405998841,33894312
  */
 export function getTrackDetail(ids) {
-  return request({
-    url: '/song/detail',
-    method: 'get',
-    params: {
-      ids,
-    },
-  }).then(data => {
-    data.songs = mapTrackPlayableStatus(data.songs, data.privileges);
-    return data;
+  const fetchLatest = () => {
+    return request({
+      url: '/song/detail',
+      method: 'get',
+      params: {
+        ids,
+      },
+    }).then(data => {
+      data.songs.map(song => {
+        const privileges = data.privileges.find(t => t.id === song.id);
+        cacheTrackDetail(song, privileges);
+      });
+      data.songs = mapTrackPlayableStatus(data.songs, data.privileges);
+      return data;
+    });
+  };
+  fetchLatest();
+
+  let idsInArray = [String(ids)];
+  if (typeof ids === 'string') {
+    idsInArray = ids.split(',');
+  }
+
+  return getTrackDetailFromCache(idsInArray).then(result => {
+    if (result) {
+      result.songs = mapTrackPlayableStatus(result.songs, result.privileges);
+    }
+    return result ?? fetchLatest();
   });
 }
+
 /**
  * 获取歌词
  * 说明 : 调用此接口 , 传入音乐 id 可获得对应音乐的歌词 ( 不需要登录 )
  * @param {number} id - 音乐 id
  */
-
 export function getLyric(id) {
-  return request({
-    url: '/lyric',
-    method: 'get',
-    params: {
-      id,
-    },
+  const fetchLatest = () => {
+    return request({
+      url: '/lyric',
+      method: 'get',
+      params: {
+        id,
+      },
+    }).then(result => {
+      cacheLyric(id, result);
+      return result;
+    });
+  };
+
+  fetchLatest();
+
+  return getLyricFromCache(id).then(result => {
+    return result ?? fetchLatest();
   });
 }
+
 /**
  * 新歌速递
  * 说明 : 调用此接口 , 可获取新歌速递
@@ -67,6 +106,7 @@ export function topSong(type) {
     },
   });
 }
+
 /**
  * 喜欢音乐
  * 说明 : 调用此接口 , 传入音乐 id, 可喜欢该音乐