소개

Inko SDK 개요

Inko는 Git처럼 시점별로 편집을 추적하는 PDF 뷰어·편집기 SDK입니다. 고객사 웹 시스템에 임베드하면 펜·형광펜·텍스트·도형 주석 편집기와 함께, 시중 PDF 솔루션에 없는 세 가지를 SDK 기본 기능으로 제공합니다.

• 버전 자동 추적 (append-only) — 모든 저장이 덮어쓰기가 아닌 새 버전으로 쌓입니다.
• 다중 사용자 레이어 — 여러 사용자의 편집본을 한 화면에 겹쳐 보고, 개별로 켜고 끌 수 있습니다.
• 이어서 편집 — 어느 시점의 버전이든 편집 캔버스로 불러와 그 지점부터 계속 작업합니다.

이 문서는 Inko SDK 라이센스를 보유한 고객사 개발팀을 위한 통합 가이드와 API 레퍼런스를 제공합니다. 문서에 포함된 기능은 라이브 데모에서 직접 사용해 볼 수 있습니다.

동작 구조

Inko는 뷰어 본체(정적 빌드 산출물)와 SDK 래퍼(pdfv-sdk.js) 두 부분으로 구성됩니다. 뷰어 본체를 고객사 서버의 /pdfv/ 경로에 배포하면, SDK가 해당 뷰어를 iframe으로 마운트하고(지정한 영역에 뷰어 화면을 생성해 붙이고), postMessage(브라우저 내장 창↔iframe 메시지 통신 기능)로 양방향 통신합니다.

• 빌드 의존성 없음 — npm 설치·번들러 설정 없이 <script> 한 줄로 사용합니다.
• 프레임워크 무관 — JSP·React·Vue·Angular·PHP 등 JS가 동작하는 모든 환경을 지원합니다.
• origin 검증 내장 — SDK와 뷰어 간 메시지는 출처(origin·source)를 검증한 뒤에만 처리됩니다.

<div id="pdf-container" style="width:100%;height:80vh"></div>
<script src="/pdfv/sdk/pdfv-sdk.js"></script>
<script>
  var viewer = Inko.mount('#pdf-container', {
    src: '/pdfv/index.html',
    pdfUrl: '/files/contract.pdf',
    onSave: function (canvasData, ok) {
      // canvasData를 자체 DB에 INSERT — 이것이 곧 '버전 1개'
    }
  });
</script>

핵심 개념

canvasData — 편집 데이터의 단위

사용자가 PDF 위에 남긴 모든 편집(펜·형광펜·텍스트·도형)은 canvasData라는 직렬화된 문자열 하나(편집 내용 전체를 저장·전송하기 쉽게 텍스트로 변환한 것)로 표현됩니다. 원본 PDF는 변경되지 않으며, 편집 내용은 PDF와 분리된 레이어로 관리됩니다.

SDK는 canvasData의 내부 형식을 해석하거나 저장하지 않습니다. onSave 콜백으로 받은 값을 고객사 자체 DB에 그대로 저장하고, 다시 보여줄 때 그대로 전달하면 됩니다. 문서 데이터가 외부로 나가지 않는 구조이므로 보안 심사가 까다로운 엔터프라이즈 망 환경에도 적합합니다.

버전 — append-only로 쌓이는 이력

저장할 때마다 받은 canvasData를 새 행(row)으로 INSERT하면, 그 자체가 버전 이력이 됩니다. 덮어쓰기(UPDATE)가 없으므로 어떤 시점의 작업도 사라지지 않고, 특정 버전을 initialCanvasData로 다시 주입하면 그 시점부터 이어서 편집할 수 있습니다. 자세한 설계 방법은 저장과 버전 관리를 참고하세요.

레이어 — 사용자별 작업의 겹쳐 보기

여러 사용자(또는 여러 버전)의 canvasData를 loadUserCanvasOverlay()로 주입하면, 뷰어 우측 이력 패널에 목록이 나타나고 각 항목을 켜고 끄며 겹쳐 볼 수 있습니다. 계약 검토·도면 회람처럼 여러 명의 흔적을 비교해야 하는 업무에 사용합니다. 자세한 내용은 다중 사용자 레이어를 참고하세요.

지원 환경

사용 중인 기술 스택의 가이드를 선택하면 마운트 코드부터 저장 엔드포인트까지 전체 예제를 볼 수 있습니다.

문서 구성