追蹤安 Electron
CSV 匯出。

按照一個按鈕點選從頁面API,透過Electron IPC,到CSV檔案編寫器。

"Export notes(匯出筆記)"去哪兒了?

本指南使用一個小型 Electron 應用。點選Export notes(匯出筆記)後,頁面呼叫 API,透過程序邊界進入主程序,最後寫出 CSV。這個行為分散在幾個檔案中。

該 CSV 跨匯出 Electron 過程

  1. 渲染器→預載入notes.exportCsv()renderer.js 呼叫由 preload.js.
  2. 程序之間notes:export預載入呼叫IPC通道:主程序的命名訊息。
  3. 主程序匯出處理函式main.js處理這個通道,再呼叫 CSV 寫入函式。

csv.js 格式化註釋→ main.js 寫道 downloads/notes.csv.

REA將字面IPC呼叫與其處理程式相匹配,並標識公開的API。 路徑是從程式碼中推斷出來的;執行時捕獲可以檢查執行的內容。

詢問有關 CSV 匯出

將你的程式設計助手連線到 REA 並給它的應用程式目錄或 ASAR 檔案:

你的程式設計助手

用 REA 找出這個應用匯出筆記時發生了什麼。CSV 檔案在哪裡建立?

示例提示。 包括應用程式資料夾的絕對路徑或 app.asar.

REA讀取應用程式檔案並構建入口點,模組和流程邊界的對映。 你的程式設計助手使用該對映將調查範圍縮小到匯出功能。

跟蹤匯出程式碼

頁面呼叫一個小API

renderer.js · 示例來源
document.querySelector("#export").addEventListener("click", async () => {
  const destination = await window.notes.exportCsv();
  document.querySelector("#status").textContent = `Saved to ${destination}`;
});

頁面知道方法名稱。 實現存在於預載入中,預載入將其暴露給渲染器。

preload.js · 示例來源
contextBridge.exposeInMainWorld("notes", {
  exportCsv: () => ipcRenderer.invoke("notes:export"),
});

REA 記錄 notes.exportCsv 和直接寫在程式碼中的通道名 notes:export,並將呼叫關聯到主程序裡唯一匹配的處理函式。

main.js · 示例來源
ipcMain.handle("notes:export", () => {
  const destination = path.join(app.getPath("downloads"), "notes.csv");
  writeFileSync(destination, toCsv(notes), "utf8");
  return destination;
});

讀取處理函式就能回答最初的問題:csv.js 格式化筆記,主程序將 notes.csv 寫入使用者的下載資料夾。

REA 結果 · summary.ipc 摘錄
{
  "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 本例不需要。

下載示例ZIP

瀏覽六個原始檔
靜態應用分析
npx -y rea-agents@latest analyze-javascript-application \
  /absolute/path/to/notes-example --json

將路徑替換為你解壓縮的資料夾。 你應該在以下位置找到一個IPC通道和一個匹配的處理程式 normalized_result.summary.ipc. 源位置在 normalized_result.graph.

對於你自己的應用程式,請對其目錄或ASARpath使用相同的命令。 程式設計助手可以使用REA的功能跟蹤工具跟隨文字字串,API名稱或IPC通道。

檢查CSV寫入器

追蹤 notes:export 到處理函式。哪些輸入傳給 CSV 寫入函式?如果寫入失敗,會怎樣?

使用源位置檢查這些詳細資訊。 計算的通道名稱和不明確的處理程式可以保持未解析;執行時觀察為你提供了另一種調查它們的方法。

頂部