Браузер / Средний уровень / Чтение: 15 мин

Анализ браузера с REA: что происходит после экспорта?

Исследуйте действие экспорта в браузере с REA. Свяжите запросы с загруженным кодом и определите, когда страница создаёт скачивание без сервера.

На этой странице
Что вы получите

Небольшую хронологию, связывающую экспорт с наблюдаемыми запросами или клиентским путём скачивания.

Что понадобится

Браузер Chromium с изолированным отладочным профилем, страница под вашим контролем и REA. Приведённая команда запуска предназначена для Chrome на macOS.

01. Запустите изолированную сессию браузера

Откройте локальное приложение в отдельном отладочном профиле. Это позволяет явно определить страницу и тестовые данные. Замените последний URL адресом своего локального приложения. В Windows или Linux используйте соответствующий исполняемый файл Chrome.

Отладочный адрес — подключение для управления браузером; он отличается от URL приложения. Используйте буквальный адрес loopback и идентификатор цели, возвращённый REA.

Терминал
"/Applications/Google Chrome.app/Contents/MacOS/Google Chrome" \
  --remote-debugging-port=9222 \
  --user-data-dir=/tmp/rea-export-profile \
  http://127.0.0.1:3000

02. Выберите точную страницу

Получите список целей, найдите URL приложения и скопируйте его идентификатор. Изучите страницу перед экспериментом. Если вкладка перезагрузилась или была заменена, снова получите список целей вместо повторного использования старого идентификатора.

Терминал
npx -y [email protected] list-browser-targets http://127.0.0.1:9222 --json
npx -y [email protected] inspect-web-page http://127.0.0.1:9222 TARGET_ID --observation-ms 1000 --json

03. Запишите фон, затем один экспорт

Сначала запишите короткий период бездействия, чтобы увидеть фоновый опрос. Затем начните второе наблюдение и сами нажмите «Экспорт», пока окно наблюдения открыто. Пассивный наблюдатель REA не нажимает кнопку за вас.

Используйте небольшие узнаваемые данные, например две строки с уникальной тестовой меткой. Отметьте, показывает ли приложение индикатор загрузки, скачивает файл или сообщает об ошибке. Сравните две записи, не предполагая, что каждый новый запрос относится к экспорту.

Терминал
npx -y [email protected] observe-web-session http://127.0.0.1:9222 TARGET_ID --observation-ms 10000 --json > export-capture.json
  • Начинается ли запрос после действия?
  • Каковы его метод, URL и сообщённый статус?
  • Можно ли связать его с кнопкой через инициатор или загруженный скрипт?
  • Был ли файл действительно создан и содержит ли тестовые строки?

04. Нет запроса? Изучите клиентский путь

Некоторые функции экспорта создают Blob в JavaScript и скачивают его без запроса к серверу. Поэтому пустой список запросов — полезная подсказка, а не доказательство сбоя записи. Изучите загруженные скрипты и найдите в нужной функции Blob, createObjectURL и атрибут download.

Анализ сборки сообщает о статических кандидатах. Строка, похожая на адрес API, не доказывает вызов. Держите наблюдения запросов и выводы по коду в отдельных столбцах.

Терминал
npx -y [email protected] analyze-web-bundle http://127.0.0.1:9222 TARGET_ID --json
Спросите программирующего агента
Используя выбранную страницу и эту запись экспорта, объясни, запрашивает ли экспорт файл у сервера или создаёт его в браузере. Свяжи наблюдаемую активность с соответствующим загруженным кодом. Укажи недостающие данные. Не делай выводов о содержимом ответа только по метаданным.

05. Повторите с неудобными входными данными

Экспортируйте строку с запятой, кавычкой и переносом строки. Откройте результат парсером соответствующего формата, а не только текстовым редактором. Успешное скачивание не доказывает корректность кодирования файла.

Представьте хронологию действия, выбранный запрос или клиентскую функцию и проверки файла. Это воспроизводимый процесс для вашей цели; статья не содержит записи сессии стороннего сервиса.

Команды сверены с REA 6.4.0. Результаты для конкретной цели зависят от артефакта и провайдера. Исходный источник и границы исследования →

Продолжайте исследованиеВыберите следующее руководство →

Впервые используете инструмент? Что такое REA? · Как мы проверяем руководства