Document Scanning & OCR: Perspective Correction on the Client
REPORT_ABSTRACT
Doc Scanner + OCR takes a photo of a physical document — receipt, letter, book page, ID card — and runs the full pipeline locally: draggable 4-point perspective correction frames the document in real time, a custom 8-DOF perspective transform warps it into a flat rectangular scan, and Tesseract.js v6 runs the OCR engine inside a Web Worker. No image ever leaves the browser; the entire chain executes on-device.
01. FRAMING THE DOCUMENT
Four draggable corner handles let the user align the document within the photo. As the corners move, a live overlay redraws the selection: a dark vignette darkens everything outside the region while a dashed border traces the quadrilateral. The visual feedback loop lets users correct skew, keystone, and perspective before a single pixel is processed.
02. THE PERSPECTIVE SOLVER
The heart of the warp is an 8-DOF homography. Four point correspondences — the user's corners mapped to the target rectangle — define an 8×8 linear system that is solved with Gaussian elimination, yielding the transform matrix. Every output pixel is then inverse-mapped back through that matrix to source coordinates, so the warped scan is resampled directly from the original photo with no cumulative distortion.
03. OCR EXECUTION IN A WORKER
Tesseract.js v6 runs the recognition engine off the main thread inside a Web Worker. The Tesseract logger feeds a live percentage bar as the engine progresses through image preparation, layout analysis, and character recognition — the UI remains fully interactive throughout, even on large, high-resolution scans.
04. OUTPUT AND PRIVACY
The recognized text lands in a copyable block with a one-click TXT download. Because the whole chain — corner solve, warp, raster resampling, and OCR — executes on-device, a document photo never crosses the network. The app ships as a pure static SPA with no upload endpoint to leak it through.