有没有办法点击 headless chrome？

Question

我正在尝试点击 Linkedin 个人资料中的 "my network" 按钮。我可以使用 'goto' 方法直接转到 url，但我希望能够单击它。

我试过使用 'copy selector' 但它似乎不起作用。

const BUTTON_SELECTOR = '#mynetwork-nav-item';
    await page.click(BUTTON_SELECTOR);

我可以登录，但之后就不能用了。

完整代码-

const puppeteer = require('puppeteer');
(async () => {
  /* Initiate the Puppeteer browser */
  const browser = await puppeteer.launch({ headless: false, defaultViewport: { width: 1366, height: 768 }});
  const page = await browser.newPage();

  await page.goto(`https://www.linkedin.com`, { waitUntil: 'networkidle0' });

  let element, formElement, tabs;
  element = await page.$x(`//a[contains(text(),'Sign in')]`);
    await element[0].click();
    await page.waitForNavigation();

    element = await page.$x(`//*[@id="username"]`);
    await element[0].type(`some_id@example.com`);

    element = await page.$x(`(.//*[normalize-space(text()) and normalize-space(.)='Welcome Back'])[1]/following::div[3]`);
    await element[0].click();

    element = await page.$x(`//*[@id="password"]`);
    await element[0].click();

    element = await page.$x(`//*[@id="password"]`);
    await element[0].type(`some_password`);

    await page.keyboard.press(`Enter`)

    const MY_NETWORK_BUTTON = '#mynetwork-tab-icon';
    await page.waitForSelector(MY_NETWORK_BUTTON, {visible: true});
    const [response] = await Promise.all([
    page.waitForNavigation(), // The promise resolves after navigation has finished
    page.click(MY_NETWORK_BUTTON), // Clicking the link will indirectly cause a navigation
    ]);

    console.log('CURRENT URL IS: ', response.url());
})();

Answer 1

首先尝试等待选择器，然后您应该更改选择器，然后点击它。

更新：

const MY_NETWORK_BUTTON = '#mynetwork-tab-icon';
await page.waitForSelector(MY_NETWORK_BUTTON, {visible: true});
const [response] = await Promise.all([
  page.waitForNavigation(), // The promise resolves after navigation has finished
  page.click(MY_NETWORK_BUTTON), // Clicking the link will indirectly cause a navigation
]);

console.log('CURRENT URL IS: ', response.url());

输出：

CURRENT URL IS: https://www.linkedin.com/mynetwork/

Answer 2

只需等待导航完成就足以正确更改标签页

await Promise.all([
    page.waitForNavigation(),
    page.click(MY_NETWORK_BUTTON)
]);

但是问题可能出在其他方面，例如，当我最初创建帐户时，网页提示我在登录后立即添加我的 phone 号码，所以您可能无法单击网络选项卡，因为这由于某些其他原因，选择器不存在。

通常不建议使用表单登录，因为很多网页都有针对抓取/非人类用户的反制措施。特别是 Linkedin 可以要求您在登录后完成验证码以证明您不是机器人。

如果您真的想以这种方式登录，您可以通过将这些选择器更改为简单的方式来改进您负责的代码

await page.goto("https:\/\/www.linkedin.com", { waitUntil: 'networkidle0' });

await page.type("input[name='session_key']",email);
await page.type("input[name='session_password']",password);
await page.keyboard.press(`Enter`);

否则我会建议使用 cookie 登录，这样会更加简化代码。

您可以通过调用

获取 puppeteer 接受的格式的 cookie 列表

await page.cookies();

然后将它们设置为

await page.setCookie(cookie)

我不太确定 linkedin 用于在 cookie 中存储用户信息的格式，但似乎只加载名为 li_at 的 cookie 就足够了，例如

await page.setCookie({
    "name": "li_at",
    "value": INSERT VALUE HERE,
    "domain": ".www.linkedin.com",
    "path": "/",
    "size": 157,
    "httpOnly": true,
    "secure": true,
    "session": false
})

有没有办法点击 headless chrome？

Is there a way to click in headless chrome?

node.js

google-chrome-headless

puppeteer