Как выбрать элементы внутри элемента iframe в Puppeteer
Поскольку ESPN не предоставляет API, я пытаюсь использовать Puppeteer для сбора данных о моей фэнтези-футбольной лиге. Однако мне трудно войти в систему с помощью puppeteer из-за того, что форма входа в систему вложена в элемент iframe.
Я перешел к http://www.espn.com/логин и выбрал iframe. Кажется, я не могу выбрать ни один из элементов внутри iframe, кроме основного раздела, выполнив
frame.$('.main')
Это код, который, кажется, получает iframe с формой входа.
const browser = await puppeteer.launch({headless:false});
const page = await browser.newPage();
await page.goto('http://www.espn.com/login')
await page.waitForSelector("iframe");
const elementHandle = await page.$('div#disneyid-wrapper iframe');
const frame = await elementHandle.contentFrame();
await browser.close()
Я хочу иметь доступ к полю имени пользователя, полю пароля и кнопке входа в элемент iframe. Всякий раз, когда я пытаюсь получить доступ к этим полям, я получаю возврат null.
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 3
Вы можете получить iframe с помощью contentFrame, как вы это делаете сейчас, а затем вызвать $.
const browser = await puppeteer.launch({ headless: false });
const page = await browser.newPage();
await page.goto('http://www.espn.com/login')
const elementHandle = await page.waitForSelector('div#disneyid-wrapper iframe');
const frame = await elementHandle.contentFrame();
await frame.waitForSelector('[ng-model = "vm.username"]');
const username = await frame.$('[ng-model = "vm.username"]');
await username.type('foo');
await browser.close()
@SwapnikK, вы также можете использовать waitForSelector. Ответ отредактирован.
await elementHandle.contentFrame() имеет значение null:
const frame = await elementHandle.contentFrame();
Пожалуйста, уточните ответ. Это выглядит недостаточно
const frame = await elementHandle.contentFrame();
У меня возникла проблема с поиском элементов полосы. Причина тому следующая:
You can't access an with different origin using JavaScript, it would be a huge security flaw if you could do it. For the same-origin policy browsers block scripts trying to access a frame with a different origin. See more detailed answer here
Поэтому, когда я пытался использовать методы кукловода: Page.frames() и Page.mainFrame().ElementHandle.contentFrame(), я не возвращал мне ни одного iframe. Проблема в том, что это происходило тихо, и я не мог понять, почему он ничего не мог найти.
Добавление этих аргументов к параметрам запуска решило проблему:
'--disable-web-security',
'--disable-features=IsolateOrigins,site-per-process'
Большое спасибо за ваш ответ, это решило мою проблему. если вы знаете, не могли бы вы поделиться какими-либо недостатками включения этих флагов?
frame.$('[ng-model = "vm.username"]') кажется, возвращает ноль.