Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 6 additions & 0 deletions src/core/player/PlayerController.ts
Original file line number Diff line number Diff line change
Expand Up @@ -211,7 +211,13 @@ class PlayerController {
// 通知桌面歌词
if (isElectron) {
window.electron.ipcRenderer.send("desktop-lyric:update-data", {
currentTime: startSeek,
lyricLoading: true,
songId: song.id,
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

medium

歌曲 ID (song.id) 在项目中可能是 numberstring 类型(例如在 retryInfo 中定义为 number | string),但 LyricData 接口中将其定义为了 number。建议将 LyricData 接口中的 songId 类型更新为 number | string 以确保类型定义与实际 IPC 通信数据一致。这符合项目信任内部 IPC 数据结构的原则,通过完善类型定义而非增加运行时校验来保证安全。

References
  1. For internal IPC communication, trust the incoming data structure and avoid adding manual, defensive runtime validation for type safety.

songOffset: statusStore.getSongOffset(song.id),
lrcData: [],
yrcData: [],
lyricIndex: -1,
});
}
// 更新任务栏歌词窗口的元数据
Expand Down
9 changes: 6 additions & 3 deletions src/utils/initIpc.ts
Original file line number Diff line number Diff line change
Expand Up @@ -85,7 +85,7 @@ const initIpc = () => {
);

// 给任务栏歌词初始数据
window.electron.ipcRenderer.on(TASKBAR_IPC_CHANNELS.REQUEST_DATA, async () => {
window.electron.ipcRenderer.on(TASKBAR_IPC_CHANNELS.REQUEST_DATA, async () => {
const musicStore = useMusicStore();
const statusStore = useStatusStore();

Expand Down Expand Up @@ -140,6 +140,9 @@ window.electron.ipcRenderer.on(TASKBAR_IPC_CHANNELS.REQUEST_DATA, async () => {
const statusStore = useStatusStore();
if (player) {
const { name, artist } = getPlayerInfoObj() || {};
const songLyric = statusStore.lyricLoading
? { lrcData: [], yrcData: [] }
: toRaw(musicStore.songLyric);
window.electron.ipcRenderer.send(
"desktop-lyric:update-data",
cloneDeep({
Expand All @@ -149,8 +152,8 @@ window.electron.ipcRenderer.on(TASKBAR_IPC_CHANNELS.REQUEST_DATA, async () => {
currentTime: statusStore.currentTime,
songId: musicStore.playSong?.id,
songOffset: statusStore.getSongOffset(musicStore.playSong?.id),
lrcData: musicStore.songLyric.lrcData ?? [],
yrcData: musicStore.songLyric.yrcData ?? [],
lrcData: songLyric.lrcData ?? [],
yrcData: songLyric.yrcData ?? [],
lyricIndex: statusStore.lyricIndex,
lyricLoading: statusStore.lyricLoading,
}),
Expand Down
17 changes: 16 additions & 1 deletion src/views/DesktopLyric/index.vue
Original file line number Diff line number Diff line change
Expand Up @@ -182,6 +182,15 @@ const lyricData = reactive<LyricData>({
lyricIndex: -1,
});

const hasLyricLines = (data: Pick<LyricData, "lrcData" | "yrcData">) =>
Boolean(data.lrcData?.length || data.yrcData?.length);

const shouldIgnoreLoadingUpdate = (data: LyricData) => {
if (data.lyricLoading !== true) return false;
if (hasLyricLines(data) || !hasLyricLines(lyricData)) return false;
return data.songId === undefined || data.songId === lyricData.songId;
};
Comment on lines +188 to +192
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

medium

在切歌场景下,来自前一首歌曲的滞后“加载中”消息可能覆盖当前歌曲的状态。建议在当前已有歌词的情况下,忽略任何不带歌词数据的加载状态更新。这能有效防止 UI 闪烁并确保数据一致性,符合项目在处理异步更新时优先保证数据一致性和防止视觉闪烁的原则。

const shouldIgnoreLoadingUpdate = (data: LyricData) => {
  if (data.lyricLoading !== true) return false;
  if (hasLyricLines(data) || !hasLyricLines(lyricData)) return false;
  return true;
};
References
  1. When a backend process provides incomplete data in its streaming callbacks, prefer collecting the full dataset and then sending it in chunks to the frontend to ensure data consistency and prevent UI flickering.


// 锚点时间(毫秒)与锚点帧时间,用于插值推进
let baseMs = 0;
let anchorTick = 0;
Expand Down Expand Up @@ -306,7 +315,7 @@ const renderLyricLines = computed<RenderLine[]>(() => {
return placeholder("SPlayer Desktop Lyric");
}
// 加载中
if (lyricData.lyricLoading) return placeholder("歌词加载中...");
if (lyricData.lyricLoading && !lyrics?.length) return placeholder("歌词加载中...");
// 纯音乐
if (!lyrics?.length) return placeholder("纯音乐,请欣赏");
// 获取当前歌词索引
Expand Down Expand Up @@ -708,6 +717,12 @@ onMounted(() => {
window.electron.ipcRenderer.on(
"desktop-lyric:update-data",
(_event, data: LyricData & { sendTimestamp?: number }) => {
if (shouldIgnoreLoadingUpdate(data)) {
if (isInitializing.value) {
isInitializing.value = false;
}
return;
}
Object.assign(lyricData, data);
Comment on lines +720 to 726
// 首次接收到歌词数据时,立即结束初始化状态
if (isInitializing.value) {
Expand Down
Loading