이 파일은 웹 페이지(GUI)와 시스템(Node.js/Electron) 사이를 연결하는 '문지기(Bridge)'입니다. 이 파일이 없으면 웹 화면에 있는 버튼을 눌러도 뒤에서 돌아가는 수집 엔진을 호출할 수 없습니다.
preload.cjs가 하는 일보안관: 웹 페이지(out 폴더 안의 React/Next.js)는 보안상 파일 시스템(fs)이나 데이터베이스(sqlite)에 직접 접근할 수 없습니다.
중계자: contextBridge라는 기능을 통해, 웹 페이지가 시스템 명령을 내릴 수 있는 '안전한 통로(API)'만 딱 정해서 열어줍니다.
7~52번 줄)지금 열려 있는 코드의 IPC 객체를 보세요. 이 앱이 지원하는 모든 기능의 명령어 목록이 여기에 다 적혀 있습니다.
collectRun: "수집 시작" 버튼을 누르면 이 명령어가 실행됩니다.
collectStop: "수집 중지" 버튼용입니다.
accountsList: 계정 목록을 DB에서 가져올 때 씁니다.
licenseStatus: 이 앱의 라이선스 인증 상태를 체크합니다.
56~71번 줄)api라는 객체를 보시면:
collect: (usernames) => import_electron.ipcRenderer.invoke(IPC.collectRun, usernames),
이런 식으로 되어 있죠? "웹 화면에서 api.collect(['계정1'])를 호출하면, 시스템의 collectRun 명령어를 실행해라!"라는 뜻입니다.
이제 이 앱의 화면(UI)이 어떻게 이 API를 호출하는지 보거나, 아니면 명령어가 전달된 후 실제로 시스템에서 어떻게 작동하는지 추적해 볼 수 있습니다.
관전 포인트: 웹 화면의 버튼을 눌렀을 때 어떻게 이 preload.cjs를 거쳐 main.cjs로 가는지 그 흐름이 궁금하시죠?
다음 확인 추천: 웹 화면 소스 코드인 renderer 관련 폴더나, 수집 엔진의 collect-service를 직접 확인해 보는 건 어떨까요?
어디를 더 파헤쳐 볼까요? collect-service 쪽을 한번 확인해 볼까요, 아니면 다른 쪽이 궁금하신가요?