Кукольник простой формы логин

Question

Код моего кукловода выглядит следующим образом. Я пытаюсь войти в мою страницу широкополосного доступа, которая срабатывает каждый день. Я попробовал команду curl, но она не работает. Итак, я сейчас пытаюсь node js кукловод.

логин. js

// example from github.com login page 
const puppeteer = require('puppeteer')
const screenshot = 'broadband.png';
(async () => {
  const browser = await puppeteer.launch({headless: true, ignoreHTTPSErrors: true})
  const page = await browser.newPage()
  await page.goto('https://server-ip-address/userportal/login.do?requesturi=http%3A%2F%2F1.254.254.254%2F%3F')
  await page.type('input[type="username"]', process.env.BB_USER)
  await page.type('input[type="password"]', process.env.BB_PWD)
  await page.click('[name="lesubmit"]')

  await page.waitForNavigation()
  await page.screenshot({ path: screenshot })
  browser.close()
  console.log('See screenshot: ' + screenshot)
})()

Я запустил его следующим образом

BB_USER='my_username' BB_PWD='my_password' node login.js

Но он всегда говорит

Ошибка: не найден узел для селектора: input [type = "username"]

Вот мой фактический широкополосный логин с:

        <div class="formBox">
            <h2>Login to your account</h2>
            <form name="form1" action="">
                <font color="red" size="2">
                 </font>
                <label>Service Type</label>
                 <select name="type"><option value="1">Check Account Details</option>
                    <option value="2" selected="selected">Internet Access</option></select>             
                <label>User Name</label>
                <input type="text" name="username" value="">
                <label>Password</label>
                <input type="password" name="password" value=""><br />
                <input type="hidden" id="rememberme" name="rememberme"/>
                <div style="background:#f1f6f9; height:40px; margin:10px 0 0 0; padding:15px 0 0 0; border-top:1px solid #dedede;">
                    <a href='/userportal/forgotpasswd.do'>Forgot Password?</a>
                    <input type="button" name="lesubmit" id="ptype" class="btn-primary" value="Login" onclick="return savesettings();" />
                </div>
            </form>
            <div class="clear"></div>
        </div>
    </div>

Честно говоря, я не не знаю, как выбрать селектор в этом случае. Я думал name="username" достаточно, но это не так. Можете ли вы дать некоторые советы?

Answer 1

Добро пожаловать в SF!

Цель 'input[name="username"]' вместо 'input[type="username"]'. Вот так:

await page.type('input[name="username"]', process.env.BB_USER)

Объяснение

В вашем примере, цель HTML равна

<input type="text" name="username" value="">`

Таким образом, правильный селектор будет:

input[name='username']

Что соответствует свойству name, присутствующему в целевом элементе HTML (<input name='username'>)

Ваш исходный код был input[type='username'], что соответствует <input> со свойством type='username'. Однако целевой элемент имеет type='text', а не type='username', поэтому селектор не совпадает, и Puppeteer сообщает, что не может найти соответствующий элемент: No node found for selector: input[type="username"]

Причина имя пользователя для ввода type='text' означает, что свойство input type определяет , какой элемент управления браузером отображает (текст, число, даты, флажки и т. д. c.). Поскольку имена пользователей обычно являются текстовыми, в поле имени пользователя используется type='text'