LinkedIn批量连接按钮点击与自动关闭弹窗

玩过 LinkedIn 自动化的朋友应该都遇到过这个令人头疼的问题：编写好的脚本刚运行几轮，按钮就点击不动了，浏览器控制台无情地抛出 "Node is detached from document" 报错，整个流程瞬间崩溃。

简单来说，问题根源在于页面的动态更新机制。当你使用 Puppeteer 批量点击 LinkedIn 的 "Connect" 按钮时，起初通过 page.$$() 获取了所有按钮的引用，但一旦点击某个按钮，页面 DOM 会立即重绘或局部刷新。之前获取的那些元素句柄瞬间变为 detached 状态，再调用 .click() 必然报错。

问题究竟出在哪里？

核心原因并不复杂：page.$$() 返回的仅仅是一个静态快照，它建立的是对选中元素的静态引用，而非一个能随页面变化实时更新的动态“指针”。因此，不能一次性将所有按钮拉出来存储后再循环使用。正确的做法是：在每一轮迭代中重新查询 DOM，按顺序获取当前仍然有效的那个按钮。

根据个人经验，只要理清这个思路，整个逻辑就能顺畅运行。下面直接贴一段在生产环境中验证过的代码，关键点已在注释中清晰标注：

const connectButtonsSelector = 
  '.artdeco-button.artdeco-button--2.artdeco-button--secondary.ember-view' +
  ':not(.artdeco-button--circle):not(.artdeco-button--muted):not([aria-label="Message "])';

// 第一步：只记录初始按钮数量，避免一次性获取所有句柄
const buttonsCount = (await page.$$(connectButtonsSelector)).length;
console.log(`Found ${buttonsCount} Connect buttons`);

for (let i = 0; i < buttonsCount; i++) {
  try {
    // 关键动作：每轮都重新查询，确保拿到当前 DOM 中第 i 个有效按钮
    const connectButton = (await page.$$(connectButtonsSelector))[i];
    if (!connectButton) {
      console.warn(`Button at index ${i} no longer exists — skipping`);
      continue;
    }
    await connectButton.click();
    console.log(`✅ Successfully clicked Connect button #${i + 1}`);

    // 第二步：显式等待 Dismiss 按钮出现，避免竞态条件
    await page.waitForSelector('button[aria-label="Dismiss"]', {
      timeout: 8000 // 建议设 5–8 秒，兼顾稳定和响应
    });
    await page.click('button[aria-label="Dismiss"]');
    console.log(`➡️  Dismissed confirmation dialog for #${i + 1}`);

    // 可选：加点延时，降低操作频率，减少被 LinkedIn 针对的风险
    await page.waitForTimeout(1200);
  } catch (error) {
    console.error(`❌ Failed on button #${i + 1}:`, error.message);
    // 出错别停，继续处理下一个
  }
}

⚠️ 有几条重要注意事项必须单独拎出来强调：

• 千万别省略 waitForSelector：Dismiss 按钮是页面异步渲染出来的。如果不等它出现就直接调用 page.click()，大概率会遇到 "No node found" 错误。老老实实等待，是最稳妥的做法。
• 小心全局 page.click() 定位错误：如果页面上同时弹出多个弹窗，那么 aria-label="Dismiss" 这个选择器可能命中多个元素。稳妥起见，建议给选择器添加更精确的定位条件，比如结合父容器，或者使用 :visible 过滤可见元素。
• LinkedIn 的反爬机制非常敏感：高频操作极易触发验证码或临时封号。每次点击之间最好增加 1-2 秒的 waitForTimeout。此外，务必使用真实 User-Agent，并添加 --disable-blink-features=AutomationControlled 参数，从浏览器层面降低被识别的概率。
• 容错机制必须优先考虑：每一轮操作都要用 try/catch 包裹。同时，if (!connectButton) 这个分支必须保留，专门用于跳过那些已经消失的按钮。这样才能确保整个自动化流程不会因为一个元素异常而全线崩溃。

这套方案，概括起来就是“动态重查 + 显式等待 + 分步容错”三招组合拳。在 LinkedIn 首页、搜索结果页或“你可能认识的人”这类模块中批量发送连接请求时，稳定性会显著提升，基本不会出现静默失败、按钮点击无效的尴尬情况。