Universal Secure Document Viewer: PDF, DOCX, XLSX Preview with Safe Mode

The Problem

SecureFilePreview could only render images, PDFs (via browser iframe), CSV, and plain text. DOCX, XLSX, and PPTX files showed a generic unsupported fallback. The iframe-based PDF viewer relied on the browser's built-in renderer and was blocked by strict Content-Security-Policy headers. There was no way to prevent users from printing or copying sensitive documents, and no extension blacklist to block executable uploads.

Canvas-Based PDF Rendering

We replaced the sandboxed iframe with pdf.js, Mozilla's open-source PDF engine. Every page renders to an HTML5 canvas element at 1.5× scale for Retina clarity. Unlike iframes, pdf.js does not execute embedded PDF JavaScript — it's a pure parser/renderer. The pdf.js web worker is served as a static file from /pdf.worker.min.mjs, keeping the main thread responsive even for large documents.

Office Document Previews

Safe Mode

A new toggle in the viewer footer activates Safe Mode for confidential documents. When enabled: text selection is disabled (CSS user-select: none), right-click context menus are blocked, the Save/Download button is hidden, a @media print rule blanks the content when printing, and a semi-transparent diagonal "CONFIDENTIAL" watermark overlays the document at 6% opacity without blocking interaction.

Extension Blacklist

A shared BLOCKED_EXTENSIONS constant (18 dangerous extensions including .exe, .bat, .sh, .js, .ps1, .jar, .vbs) is now enforced at four layers: the Secure Vault upload route, the TradeDrive upload service, the frontend file explorer (with toast notification), and the preview modal itself (refuses to open blocked types).

Drive Download CSP

The /drive/files/:id/download endpoint now returns Content-Security-Policy headers. Inline mode (used by the zero-download viewer) gets a restrictive policy that allows styles and images but blocks all scripts, forms, and framing. Attachment mode gets an even stricter policy that blocks everything.