피드로 돌아가기
Dev.toFrontend
원문 읽기
Obfuscated DOM 한계 극복을 위한 Client-side OCR 기반 TTS 아키텍처 설계
Why no text-to-speech tool can read Kindle Cloud Reader — and how I fixed it with OCR
AI 요약
Context
Kindle Cloud Reader가 Custom Font를 활용해 DOM 내 Character Code를 Scrambled Glyph Index로 변환하는 Anti-scraping 기법을 적용함. 이에 따라 기존의 DOM 기반 Text Extraction 방식으로는 실제 텍스트 획득이 불가능한 구조적 제약 발생.
Technical Solution
- DOM 데이터 대신 Rendered Page의 Pixel 정보를 신뢰하는 OCR Pipeline으로 전환
- WASM 기반 Tesseract를 Offscreen Document에 구현하여 Server Round-trip 없는 Client-side 텍스트 복구 체계 구축
- OCR 처리 속도 향상을 위해 이미지 Contrast 조절 및 Scaling 전처리와 인식 완료 페이지의 Caching 로직 적용
- Paginated/Virtualized 구조 대응을 위한 자동 Page-advance 제어 및 캡처 루프 설계
- Heuristic 필터링을 통해 Header, Page Number 등 Layout Noise를 제거하는 텍스트 정제 프로세스 통합
실천 포인트
1. DOM 기반 데이터 추출 실패 시 Canvas나 Custom Font 적용 여부를 먼저 확인하십시오.
2. Client-side WASM 라이브러리를 검토하여 데이터 외부 유출 없이 무거운 연산을 처리하는 구조를 설계하십시오.
3. OCR 도입 시 이미지 전처리(Contrast, Scaling) 단계가 체감 성능의 핵심임을 인지하십시오.
4. 가상 리스트나 페이지네이션 환경에서는 상태 변화 감지와 캡처 시점의 동기화 전략을 수립하십시오.