카톡 대화 파일에는 이름, 사적인 대화, 때로는 연락처와 주소까지 그대로 들어 있습니다. 이런 파일을 넣어 달라고 하면서 “안전합니다”라는 문구만 걸어 두는 것은 충분하지 않다고 생각했습니다. 그래서 카톡 대화 분석기는 서버가 대화 파일을 받을 수 없는 구조로 만들었습니다. 이 글은 그 구조를 어떻게 만들었고, 실제로 그렇게 동작하는지 어떻게 확인했는지에 대한 기록입니다.
1. 분석은 전부 브라우저 안에서
파일을 고르면 브라우저가 기기에 있는 파일을 직접 읽습니다. 업로드가 아닙니다. 그 뒤의 과정도 모두 사용자의 브라우저 안에서 일어납니다.
- 파일 해석: 기기별 내보내기 형식(안드로이드, 아이폰, Windows, Mac)을 알아보고 날짜, 보낸 사람, 메시지 종류를 나눕니다.
- 통계 계산: 참여자별 순위, 시간대별 대화량, 답장 시간, 칭호를 계산합니다.
- 결과 화면과 공유 카드: 결과 화면을 그리고, 공유 카드 이미지도 브라우저의 캔버스 기능으로 직접 만듭니다.
서버에는 처음부터 분석 기능이 없습니다. 사이트는 Cloudflare에 정적 파일(HTML, CSS, JavaScript)로만 배포되어 있고, 파일을 받아 처리하는 서버 코드가 없습니다. 받을 곳이 없으니 보낼 수도 없는 구조입니다.
브라우저 안에서만 처리해도 속도는 충분했습니다. 개발에 쓴 PC에서는 10MB 대화 파일을 1초 안에 분석했습니다. 오래된 단톡방은 파일이 커질 수 있어서, 분석 중에는 단계별 진행 표시와 파일 크기를 보여줍니다.
2. 분석 코드는 미리 받아 둔다
분석은 화면이 멈추지 않도록 Web Worker라는 별도 실행 공간에서 돌립니다. 이 Worker 코드를 파일을 고르는 순간에 내려받게 하면, 페이지를 연 뒤 인터넷이 끊겼을 때 분석이 되지 않습니다. “인터넷이 끊겨도 분석된다”는 안내가 사실이 아니게 되는 셈입니다.
그래서 첫 화면을 그린 직후, 브라우저가 한가해지는 시점에 Worker를 미리 띄워 두도록 했습니다. 지금은 페이지를 연 뒤 인터넷을 끊어도 분석이 그대로 됩니다. Worker를 띄우지 못하는 환경에서는 같은 분석 코드를 페이지 안에서 직접 실행합니다. 어느 쪽이든 파일은 브라우저 밖으로 나가지 않습니다.
3. 브라우저가 외부 통신을 막게 한다
코드에 실수가 생기더라도 파일이 밖으로 나가지 않도록, 사이트 응답 헤더에 콘텐츠 보안 정책(CSP)을 걸었습니다. 이 정책은 페이지가 통신할 수 있는 곳을 브라우저 수준에서 제한합니다.
- 허용: 사이트 자신, 방문 통계 도구(Google Analytics, Cloudflare Web Analytics)
- 그 외의 모든 주소: 브라우저가 차단
- 폰트도 사이트 자신에서만: 글꼴은 외부 폰트 서비스를 쓰지 않고 사이트에 직접 올려 두었습니다.
방문 통계로 보내는 내용도 정해 두었습니다. 이벤트 이름과 숫자, 정해진 코드만 보냅니다.
| 언제 | 보내는 것 |
|---|---|
| 파일을 골랐을 때 | 파일 크기(KB) |
| 분석이 끝났을 때 | 어떤 기기 형식의 파일인지, 단톡방인지 1:1인지, 메시지 수, 해석하지 못한 줄 수, 분석에 걸린 시간 |
| 분석에 실패했을 때 | 실패 사유 코드 |
| 카드를 저장·공유했을 때 | 카드 크기(정사각형·스토리), 이름 가리기를 켰는지 |
참여자 이름, 대화 내용, 파일 이름은 어디에도 넣지 않습니다. 실패 사유를 코드로만 남기는 것도 같은 이유입니다. 어떤 줄에서 실패했는지 원문을 보내면 편하겠지만, 그 줄이 곧 누군가의 대화입니다.
4. 말로 두지 않고 확인했다
배포된 사이트에서 직접 확인한 결과입니다.
| 확인 | 결과 |
|---|---|
| 페이지를 연 뒤 네트워크를 끊고 파일 분석 | 정상 분석 |
| 파일 선택 후 브라우저가 보낸 요청 | 통계 요청 1건(숫자와 코드만), 결과 화면에 필요한 폰트 파일 내려받기. 대화 내용이 담긴 요청 없음 |
| 보안 정책 위반 | 없음 |
폰트 파일 요청은 결과 화면에 처음 나오는 글자를 그리려고 사이트에 올려 둔 폰트 조각을 받는 것이라 대화 내용이 들어가지 않습니다. 인터넷이 끊긴 상태라면 기본 글꼴로 보일 뿐 분석에는 영향이 없습니다.
누구나 같은 방법으로 확인할 수 있습니다.
- PC: 브라우저에서 F12를 눌러 개발자 도구의 네트워크 탭을 열어 둔 채 파일을 분석합니다. 사이트 밖으로 나간 요청과 그 내용을 볼 수 있습니다.
- 휴대폰: 페이지를 연 뒤 비행기 모드를 켜고 파일을 골라 봅니다. 결과가 나온다면 분석에 인터넷이 필요하지 않다는 뜻입니다.
이 구조의 비용
공짜는 아닙니다. 서버가 없으니 결과를 링크로 공유하거나, 로그인해서 결과를 저장해 두었다가 다른 기기에서 다시 여는 기능은 만들 수 없습니다. 대화 내용을 AI로 분석하는 기능도 넣지 않았습니다. 외부 서비스로 대화를 보내야 하기 때문입니다.
대신 결과 카드를 이미지로 저장하거나 휴대폰의 공유 기능으로 바로 보내도록 했습니다. 카드에는 대화 원문을 넣지 않고, 이름 가리기를 켤 수 있습니다. 개인정보를 다루는 도구에서는 이 정도 불편이 맞는 선택이라고 봅니다.
두 번째 실험에도 같은 구조
두 번째 실험인 엑셀 개인정보 마스킹도 같은 구조로 만들었습니다. 같은 보안 정책을 걸었고, 페이지를 연 뒤 인터넷을 끊어도 검사와 정리된 파일 받기가 되는 것을 자동 테스트로 확인했습니다. 다루는 파일이 엑셀로 바뀌었을 뿐, “서버로 보내지 않는다”를 문구가 아니라 구조로 지킨다는 원칙은 같습니다.