Куда девается “Экспорт заметок”?
В этом руководстве используется небольшое приложение Electron. При нажатии кнопки Экспортировать заметки вызывается API на странице, выполняется переход к основному процессу и записывается CSV . Поведение распределено по нескольким файлам.
Экспорт CSV в рамках процессов Electron
-
Средство визуализации → предварительная загрузка
notes.exportCsv()renderer.jsвызывает API, предоставляемый с помощьюpreload.js. -
Примечания: При экспорте предварительной загрузки вызывается IPC-канал: именованное сообщение для основного процесса
notes:export. -
Основной процесс - обработчик экспорта
main.jsmain.js обрабатывает этот канал и вызывает CSV writer.
csv.js форматирует заметки → main.js записывает файлы для downloads/notes.csv.
Спросите об экспорте CSV
Подключите свой агент к REA и передайте ему каталог приложений или файл ASAR:
Используйте REA, чтобы узнать, что происходит, когда я экспортирую заметки в это приложение. Где создан CSV?
Пример запроса. Укажите абсолютный путь к папке приложения или app.asar.
REA считывает файлы приложения и создает карту точек входа, модулей и границ процессов. Ваш агент использует эту карту, чтобы сузить область поиска до функции экспорта.
Отслеживание экспортного кода
Страница вызывает небольшой API
document.querySelector("#export").addEventListener("click", async () => {
const destination = await window.notes.exportCsv();
document.querySelector("#status").textContent = `Saved to ${destination}`;
});
Странице известно имя метода. Реализация находится в предварительной загрузке, которая предоставляет ее в распоряжение средства визуализации.
contextBridge.exposeInMainWorld("notes", {
exportCsv: () => ipcRenderer.invoke("notes:export"),
});
REA записывает notes.exportCsv и буквенный канал notes:export. Он связывает этот вызов с единственным соответствующим обработчиком в основном процессе.
ipcMain.handle("notes:export", () => {
const destination = path.join(app.getPath("downloads"), "notes.csv");
writeFileSync(destination, toCsv(notes), "utf8");
return destination;
});
Чтение обработчика дает ответ на исходный вопрос: csv.js заметки форматируются, и основной процесс записывает файл notes.csv в папку загрузок пользователя.
{
"literal_channels": 1,
"renderer_transmissions": 1,
"main_handlers": 1,
"paired_renderer_transmissions": 1,
"ambiguous_renderer_transmissions": 0
}
Записано с помощью REA 4.1.0 на примере, который можно загрузить ниже. Расположение исходных текстов соответствует выводам API, канала и обработчика.
Проанализируйте этот пример самостоятельно
Скачайте пример и распакуйте его. Архив содержит полную папку с notes-example. Проанализируйте его с Node.jsпомощью и npm; Electron для этого примера не нужен.
Просмотрите шесть исходных файлов
npx -y rea-agents@latest analyze-javascript-application \
/absolute/path/to/notes-example --json
Замените путь на папку, которую вы распаковали. Вы должны найти один IPC-канал и один соответствующий обработчик в normalized_result.summary.ipc. Местоположения источников указаны в normalized_result.graph.
Для вашего собственного приложения используйте ту же команду, указав его каталог или путь к ASAR. Агент может использовать буквенную строку, имя API или IPC-канал с помощью инструментов отслеживания функций REA.
Проверьте устройство записи CSV
Следуйте
notes:exportв его обработчик. Какие входные данные поступают в CSV writer и что произойдет, если запись файла завершится неудачей?
Используйте расположение источников для проверки этих сведений. Имена вычисленных каналов и неоднозначные обработчики могут оставаться неразрешенными; наблюдения во время выполнения дают вам другой способ их изучения.
- Воспользуйтесь мостом обмена Notion и примените тот же подход к пакетному приложению Electron.
- Понаблюдайте, как браузер при экспорте фиксирует реальный клик, и посмотрите, какой запрос он делает.
- Выполнение нативной функции продолжается в двоичном формате, когда функция зависит от нативного кода.