OnlineDocumentViewer가 Doconut SDK로 브라우저에서 문서를 렌더링하는 방법

OnlineDocumentViewer는 PDF, Word 파일, CAD 도면 및 수십 가지 다른 형식을 웹 페이지 내에서 직접 표시합니다. 이는 무거운 작업을 Doconut SDK에 위임함으로써 이루어집니다. Doconut SDK는 원본 파일을 픽셀 단위로 완벽한 이미지 스트림으로 변환한 뒤, 가벼운 JavaScript 래퍼를 통해 해당 이미지를 브라우저로 스트리밍합니다.

Doconut SDK: 모든 미리보기를 지원하는 렌더링 코어

Doconut SDK는 PDF, DOCX, XLSX, PPTX, DWG, PSD, SVG 등 50개 이상의 네이티브 파일 형식을 이해합니다. 요청이 들어오면 Doconut은 소스 문서를 파싱하고, 폰트와 레이어를 해석한 뒤 원본 레이아웃과 픽셀 단위로 일치하는 래스터 표현을 생성합니다. 변환이 서버에서 이루어지기 때문에 클라이언트는 Microsoft Office, AutoCAD 혹은 기타 데스크톱 애플리케이션이 필요하지 않습니다.

토큰에서 픽셀까지: 엔드‑투‑엔드 요청 흐름

토큰‑서명 URL 생성 – 백엔드가 OnlineDocumentViewer REST API를 호출하면서 파일 식별자와 disableDownload: true와 같은 선택 플래그를 전달합니다. API는 암호화 토큰이 포함된 단기간 유효 URL을 반환합니다.
서버가 Doconut 호출 – OnlineDocumentViewer 서비스는 요청을 Doconut SDK에 전달하고, 샌드박스 환경에서 파일 변환을 수행합니다.
픽셀 스트림 전송 – Doconut은 렌더링된 페이지를 이미지 타일 형태로 스트리밍합니다. SDK는 타일을 스크롤 가능한 캔버스로 이어 붙여 줌 레벨과 스크롤 위치를 유지합니다.
뷰어가 캔버스 표시 – 프론트엔드는 플러그인 없이 원활한 미리보기를 제공받으며, 이는 네이티브 PDF 뷰어와 동일하게 동작합니다.

이 흐름은 .NET 백엔드, Node.js 서비스 또는 HTTP 요청을 발행할 수 있는 모든 플랫폼에서 동일하게 작동하여 “크로스‑플랫폼” 요구사항을 충족합니다.

픽셀‑완벽 정확도: 고‑품질 렌더링이 UI에 의미하는 바

고‑품질 렌더링은 모든 글리프, 벡터 형태, 레이어가 원본 작성자가 의도한 그대로 표시된다는 것을 보장합니다. 임베디드 OpenType 폰트를 포함한 PDF의 경우 Doconut이 폰트 데이터를 추출해 요청된 줌 레벨에서 각 글리프를 래스터화하므로 대체 폰트가 나타나지 않습니다. CAD 도면(DWG)에서는 선 굵기, 해치 패턴, 레이어 가시성이 왜곡 없이 재현됩니다. 결과적으로 파일을 네이티브 데스크톱 애플리케이션에서 여는 것과 동일한 미리보기를 제공해, 스크린샷에 의존하던 시각적 격차를 없애줍니다.

토큰‑기반 접근 제어 – 모든 미리보기 URL에는 서명된 토큰이 포함되어 있으며, 서버는 Doconut을 호출하기 전에 토큰을 검증합니다. 토큰이 없거나 만료된 경우 요청이 거부됩니다.
자동 파일 삭제 – 렌더링 파이프라인이 완료되면 원본 파일은 임시 저장소에서 삭제됩니다. 서버에 지속적인 복사본이 남지 않습니다.
엔드‑투‑엔드 암호화 – 프론트엔드, OnlineDocumentViewer 서비스, Doconut 간 모든 트래픽은 TLS를 통해 전송됩니다.
도메인 제한 – 뷰어를 로드할 수 있는 도메인을 화이트리스트에 등록하여 클릭재킹 공격을 방지할 수 있습니다.

이러한 보호 장치는 엄격한 데이터 보호 규정을 충족해야 하는 SaaS 제품에 문서 미리보기를 안전하게 삽입할 수 있게 해줍니다.

대규모에서도 서브‑초 로드 타임

Doconut이 강력한 클라우드 인스턴스에서 변환을 수행하기 때문에 대부분의 문서는 1초 미만에 렌더링됩니다. 클라이언트가 Windows, macOS, Linux, iOS, Android 중 어느 환경에 있든 관계없습니다. 뷰어는 현재 화면에 보이는 타일만 스트리밍하므로 모바일 네트워크에서도 대역폭 사용량이 낮게 유지됩니다. 아키텍처는 클라우드‑네이티브이며, 전 세계 로드 밸런서를 통해 여러 인스턴스가 자동으로 확장되어 일관된 지연 시간을 제공합니다.

다음에 시도해볼 내용

온라인 문서 뷰어(https://onlinedocumentviewer.com)에 가입하고 샘플 PDF를 업로드합니다.

Doconut 웹사이트에서 렌더링 엔진에 대한 자세한 정보를 확인하세요: https://doconut.com.
추가 통합 가이드는 https://doconut.app에서 확인할 수 있습니다.