Get started with the Web SDK
Add the ready-made viewer to any web page, or use the engine on its own.
Choose how to integrate
With the viewer (npm) A complete editing screen in a few linesEngine only Your own interface on the engine APIBlazor The viewer as a Razor component
Frameworks
Install
npm install docuverseThe package contains the engine (uds_pdf.wasm), the engine API (docuverse), the viewer (docuverse/viewer) and a font helper for Node.js (docuverse/fonts).
A licence key is needed: without one, nothing opens. Make a free account for trial keys (everything works, with a watermark), or choose a plan on the pricing page. Each key is for one SDK, made in your account under Keys: a Web SDK key for the viewer in websites (
licenseKey), a Server SDK key for Node.js (setLicenseKey(key)) and .NET (License.SetKey(key)), a Mobile SDK key for apps. A key used with another SDK is refused with an error that says which key to make.Show a document
<div id="viewer" style="height: 100vh"></div><script type="module"> import { createViewer } from 'docuverse/viewer'; const viewer = await createViewer(document.getElementById('viewer'), { document: '/files/contract.pdf', // PDF, .docx or .xlsx: URL, Uint8Array, ArrayBuffer, Blob or File author: 'Jane Doe', // written into new annotations });</script>Without document, the viewer starts empty with an Open button; users can also drag a file onto it.
Save the result
const viewer = await createViewer(element, { document: url, onSave: async (bytes, { fileName }) => { await fetch('/api/files/' + fileName, { method: 'PUT', body: bytes }); },}); // or from your own codeconst pdf = viewer.save(); // Uint8Arrayconst docx = viewer.saveWord(); // when a Word document is openconst xlsx = viewer.saveExcel(); // when a workbook is open