🎈 perf: 优化 cookie 登录体验

.github/workflows/build.yml

@@ -21,6 +21,9 @@ jobs:
         uses: actions/setup-node@v4
         with:
           node-version: "22.x"
+      # 安装 pnpm
+      - name: Install pnpm
+        run: npm install -g pnpm
       # 复制环境变量文件
       - name: Copy .env.example
         run: |
@@ -31,10 +34,10 @@ jobs:
           }
       # 安装项目依赖
       - name: Install Dependencies
-        run: npm install
+        run: pnpm install
       # 构建 Electron App
       - name: Build Electron App
-        run: npm run build:win
+        run: pnpm run build:win
         env:
           GITHUB_TOKEN: ${{ secrets.ACCESS_TOKEN }}
       # 清理不必要的构建产物

.github/workflows/release.yml

@@ -21,7 +21,10 @@ jobs:
       - name: Install Node.js
         uses: actions/setup-node@v4
         with:
-          node-version: "20.x"
+          node-version: "22.x"
+      # 安装 pnpm
+      - name: Install pnpm
+        run: npm install -g pnpm
       # 复制环境变量文件
       - name: Copy .env.example
         run: |
@@ -32,10 +35,10 @@ jobs:
           }
       # 安装项目依赖
       - name: Install Dependencies
-        run: npm install
+        run: pnpm install
       # 构建 Electron App
       - name: Build Electron App for Windows
-        run: npm run build:win || true
+        run: pnpm run build:win || true
         env:
           GITHUB_TOKEN: ${{ secrets.ACCESS_TOKEN }}
       # 上传构建产物
@@ -66,6 +69,9 @@ jobs:
         uses: actions/setup-node@v4
         with:
           node-version: "20.x"
+      # 安装 pnpm
+      - name: Install pnpm
+        run: npm install -g pnpm
       # 复制环境变量文件
       - name: Copy .env.example
         run: |
@@ -76,10 +82,10 @@ jobs:
           fi
       # 安装项目依赖
       - name: Install Dependencies
-        run: npm install
+        run: pnpm install
       # 构建 Electron App
       - name: Build Electron App for macOS
-        run: npm run build:mac || true
+        run: pnpm run build:mac || true
         shell: bash
         env:
           GITHUB_TOKEN: ${{ secrets.ACCESS_TOKEN }}
@@ -111,6 +117,9 @@ jobs:
         uses: actions/setup-node@v4
         with:
           node-version: "20.x"
+      # 安装 pnpm
+      - name: Install pnpm
+        run: npm install -g pnpm
       # 更新 Ubuntu 软件源
       - name: Ubuntu Update with sudo
         run: sudo apt-get update
@@ -135,10 +144,10 @@ jobs:
           fi
       # 安装项目依赖
       - name: Install Dependencies
-        run: npm install
+        run: pnpm install
       # 构建 Electron App
       - name: Build Electron App for Linux
-        run: npm run build:linux || true
+        run: pnpm run build:linux || true
         shell: bash
         env:
           GITHUB_TOKEN: ${{ secrets.ACCESS_TOKEN }}

electron/main/loginWin.ts

@@ -1,123 +1,73 @@
-import {
-  BrowserWindow,
-  MenuItemConstructorOptions,
-  Menu,
-  session,
-  dialog,
-  ipcMain,
-} from "electron";
+import { BrowserWindow, session } from "electron";
 import icon from "../../public/icons/favicon.png?asset";
+import { join } from "path";
 
-const openLoginWin = (mainWin: BrowserWindow) => {
-  const loginSession = session.fromPartition("login-win");
+const openLoginWin = async (mainWin: BrowserWindow) => {
+  let loginTimer: NodeJS.Timeout;
+  const loginSession = session.fromPartition("persist:login");
+  // 清除 Cookie
+  await loginSession.clearStorageData({
+    storages: ["cookies", "localstorage"],
+  });
   const loginWin = new BrowserWindow({
     parent: mainWin,
-    title: "登录网易云音乐",
+    title: "登录网易云音乐（ 若遇到无响应请关闭后重试 ）",
     width: 1280,
     height: 800,
     center: true,
-    modal: true,
+    autoHideMenuBar: true,
     icon,
     // resizable: false,
     // movable: false,
     // minimizable: false,
     // maximizable: false,
     webPreferences: {
-      nodeIntegration: false,
-      contextIsolation: true,
-      partition: "login-win",
+      session: loginSession,
+      sandbox: false,
+      webSecurity: false,
+      preload: join(__dirname, "../preload/index.mjs"),
     },
   });
 
   // 打开网易云
-  loginWin.loadURL("https://music.163.com/#/my/");
+  loginWin.loadURL("https://music.163.com/#/login/");
 
   // 阻止新窗口创建
   loginWin.webContents.setWindowOpenHandler(() => {
     return { action: "deny" };
   });
 
-  // 登录完成
-  const loginFinish = async () => {
-    if (!loginWin) return;
-    // 获取 Cookie
-    const cookies = await loginWin.webContents.session.cookies.get({ name: "MUSIC_U" });
-    if (!cookies?.[0]?.value) {
-      dialog.showMessageBox({
-        type: "info",
-        title: "登录失败",
-        message: "未查找到登录信息，请重试",
+  // 检查是否登录
+  const checkLogin = async () => {
+    try {
+      loginWin.webContents.executeJavaScript(
+        "document.title = '登录网易云音乐（ 若遇到无响应请关闭后重试 ）'",
+      );
+      // 是否登录？判断 MUSIC_U
+      const MUSIC_U = await loginSession.cookies.get({
+        name: "MUSIC_U",
       });
-      return;
+      if (MUSIC_U && MUSIC_U?.length > 0) {
+        if (loginTimer) clearInterval(loginTimer);
+        const value = `MUSIC_U=${MUSIC_U[0].value};`;
+        // 发送回主进程
+        console.log("cookie:", value);
+        mainWin?.webContents.send("send-cookies", value);
+        loginWin.destroy();
+      }
+    } catch (error) {
+      console.error(error);
     }
-    const value = `MUSIC_U=${cookies[0].value};`;
-    // 发送回主进程
-    mainWin?.webContents.send("send-cookies", value);
-    await loginSession?.clearStorageData();
-    loginWin.close();
   };
 
-  // 页面注入
-  // loginWin.webContents.once("did-finish-load", () => {
-  //   const script = `
-  //     const style = document.createElement('style');
-  //     style.innerHTML = \`
-  //       .login-btn {
-  //         position: fixed;
-  //         left: 0;
-  //         bottom: 0;
-  //         width: 100%;
-  //         height: 80px;
-  //         display: flex;
-  //         align-items: center;
-  //         justify-content: center;
-  //         background-color: #242424;
-  //         z-index: 99999;
-  //       }
-
-  //       .login-btn span {
-  //         color: white;
-  //         margin-right: 20px;
-  //       }
-
-  //       .login-btn button {
-  //         border: none;
-  //         outline: none;
-  //         background-color: #c20c0c;
-  //         border-radius: 25px;
-  //         color: white;
-  //         height: 40px;
-  //         padding: 0 20px;
-  //         cursor: pointer;
-  //       }
-  //     \`;
-  //     document.head.appendChild(style);
-  //     const div = document.createElement('div');
-  //     div.className = 'login-btn';
-  //     div.innerHTML = \`
-  //       <span>请在登录成功后点击</span>
-  //       <button>登录完成</button>
-  //     \`;
-  //     div.querySelector('button').addEventListener('click', () => {
-  //       window.electron.ipcRenderer.send("login-success");
-  //     });
-  //     document.body.appendChild(div);
-  //   `;
-  //   loginWin.webContents.executeJavaScript(script);
-  // });
-
-  // 监听事件
-  ipcMain.on("login-success", loginFinish);
-
-  // 菜单栏
-  const menuTemplate: MenuItemConstructorOptions[] = [
-    {
-      label: "登录完成",
-      click: loginFinish,
-    },
-  ];
-  const menu = Menu.buildFromTemplate(menuTemplate);
-  loginWin.setMenu(menu);
+  // 循环检查
+  loginWin.webContents.once("did-finish-load", () => {
+    loginWin.show();
+    loginTimer = setInterval(checkLogin, 1000);
+    loginWin.on("closed", () => {
+      clearInterval(loginTimer);
+    });
+  });
 };
 
 export default openLoginWin;

src/components/Modal/Login/LoginCookie.vue

@@ -38,7 +38,7 @@ const openWeb = () => {
   window.$dialog.info({
     title: "使用前告知",
     content:
-      "请知悉，该功能仍旧无法确保账号的安全性！请自行决定是否使用！如遇打开窗口后页面出现白屏或者无法点击等情况，请关闭后再试。在登录完成后，请点击菜单栏中的 “登录完成” 按钮以完成登录（ 通常位于窗口的左上角，macOS 位于顶部的全局菜单栏中 ）",
+      "请知悉，该功能仍旧无法确保账号的安全性！请自行决定是否使用！如遇打开窗口后页面出现白屏或者无法点击等情况，请关闭后重试",
     positiveText: "我已了解",
     negativeText: "取消",
     onPositiveClick: () => window.electron.ipcRenderer.send("open-login-web"),