First-class JSON support with DocJSON
DocJSON is the internal format used by Document Authoring, and it’s designed for high portability and custom integrations. This document representation retains the good parts of existing formats, but it fits better with modern tooling and APIs that often exchange data in JSON. An intermediary format was important for us to maximize the versatility of the library, to integrate better with web technologies, and to provide the best possible developer experience.
DocJSON is used when loading and saving from the editor. The format is easy to understand, and it can be modified outside the editor to fit your custom workflows, including templating and document generation. If you can modify JSON on the client or server, you can generate documents that the Document Authoring library can open and export (in multiple formats).
It’s our intention to fully document the format and push document handling toward more modern alternatives, with better interoperability. You can see a simple example of the format at the end of this guide.
Working with DocJSON in the editor
Before you start, ensure you have the Document Authoring library installed and running. Check out the getting started guides for more information.
Any error handling in the examples below is left out for brevity.
Loading DocJSON
Use the DocAuthSystem.loadDocument method:
// Assuming the `docAuthSystem` instance exists.
const docAuthDocument = await docAuthSystem.loadDocument( await fetch('./document.json').then((response) => response.json()),);
const editor = await docAuthSystem.createEditor( document.getElementById('editor'), { document: docAuthDocument },);Saving DocJSON
Use the DocAuthDocument.saveDocument or DocAuthDocument.saveDocumentJSONString method:
// Assuming the `editor` instance exists.
const currentDoc = editor.currentDocument();
const docObj = await currentDoc.saveDocument();console.log('JS object', docObj);
const docJSON = await currentDoc.saveDocumentJSONString();console.log('JSON string', docJSON);Example
The example below demonstrates the minimal schema required for a valid document (all formatting styles and page setups are optional and fall back to defaults). The JSON properties show that this is version 1 of the container format, which represents a document as a body whose elements hold block-level elements such as paragraphs and tables. Section boundaries are represented by inline break/section elements, and the trailing section’s properties are stored in body.finalSectionPr. In this instance, our document is a single paragraph containing a single text run of Hello world!. Inline elements, such as text runs, are modeled as a flat sequence as opposed to being nested like HTML:
{ "type": "https://pspdfkit.com/document-authoring/persistence/container", "version": 1, "container": { "document": { "body": { "elements": [ { "type": "p", "elements": [ { "type": "r", "text": "Hello world!" } ] } ] } } }}Exploring more
Older DocJSON documents that use body.sections are upgraded automatically when loaded. If your integration constructs or reads raw DocJSON directly, use the flat body.elements shape for new documents.
If you’re interested in diving deeper into the DocJSON format, reach out to us.