Instant JSON

Instant JSON is our approach to bringing annotations and bookmarks into a modern format while keeping all important properties to make the Instant JSON spec work with PDF. It’s fully documented and supports long-term storage.

Instant JSON stores PDF changes like annotations and bookmarks in a separate JSON file. This means that a PDF document will only need to be transferred once and all changes will be added as an overlay to the existing PDF. This approach significantly reduces the bandwidth since you only need to transfer the JSON instead of the complete PDF.

Conceptually, Instant JSON defines a list of skippedPdfObjectIds. These point to the PDF’s internal object IDs for annotations. Whenever an object ID is marked as skipped, it’ll no longer be loaded from the original PDF. Instead, it could be defined inside the annotations array with the same pdfObjectId. If this is the case, the PDF viewer will display the new annotation, which signals an update to the original one. If an object ID is marked as skipped but the annotations array doesn’t contain an annotation with the same pdfObjectId, it’ll be interpreted as a deleted annotation. An annotation inside the annotations array without the pdfObjectId property is interpreted as a newly created annotation.

All annotations in the annotations array have a unique id field. For updated annotations that were in the original PDF, this field will be the stringified pdfObjectId. Newly created annotations will get a newly generated ULID.

An “empty” Instant JSON contains neither skippedPdfObjectIds nor annotations, which means the original PDF is untouched. All annotations in the initial PDF are still shown.

Instant JSON also defines a list of skippedPdfBookmarkIds that follow the same principals of skippedPdfObjectIds, but instead they contain a list of bookmarks that no longer need to be loaded from the original document.

The Format

We use Flow type declarations to specify the format of Instant JSON:

Copy
1
2
3
4
5
6
7
8
9
10
11
12
declare type InstantJSON = {
  format: "https://pspdfkit.com/instant-json/v1",
  pdfId?: {
    permanent: string,
    changing: string
  },
  skippedPdfObjectIds?: number[],
  annotations?: Object[],
  bookmarks?: Object[],
  skippedPdfBookmarkIds?: string[],
  formFieldValues?: Object[]
};

format

This is a literal string that includes the version information.

pdfId

This optional key contains an object of a permanent PDF ID and a changing PDF ID. According to the PDF spec, a PDF document must contain these IDs. We use the permanent ID to verify that the PDF you’ve opened together with this Instant JSON is indeed the correct one. The changing PDF ID will be updated whenever the PDF file is updated (for example, when saved with different annotations). Since Instant JSON only works with an immutable PDF, the state will be invalid when used with a changed PDF.

Not every PDF will have a valid permanent or changing ID. As such, this field might not be set. We recommend you take care to always use the same PDF.

skippedPdfObjectIds

This is an array of PDF object IDs that will be ignored when importing annotations from the original PDF document. If this array is empty, the key shouldn’t be set.

annotations

This is a list of new or updated annotations. Annotations follow the format for Instant JSON for annotations. When an annotation contains a pdfObjectId, it’s considered to be an update to one of the annotations of the original PDF. For newly created annotations, this key won’t be set.

bookmarks

This is a list that contains any new bookmarks added to the PDF. Bookmarks follow the format for Instant JSON for bookmarks.

skippedPdfBookmarkIds

This is an array of bookmark object IDs from the PDF that will be ignored when importing annotations from the original PDF document. If this array is empty, the key shouldn’t be set.

formFieldValues

This is a list of modified form field values. Objects follow the Instant form field value JSON format. This list won’t be preset when no form field values have been modified.

Instant Annotation JSON API

Annotation JSON is Instant’s representation of a single annotation. This can be generated by using the methods available in PSPDFKit.Annotations. For generating an object in this JSON format, use PSPDFKit.Annotations.toSerializableObject():

Copy
1
2
3
4
5
6
7
const { InkAnnotation, toSerializableObject } = PSPDFKit.Annotations;

const annotation = new InkAnnotation();
const serializedObject = toSerializableObject(annotation);
const json = JSON.stringify(serializedObject);

// The annotation's Instant JSON data can be saved to an external file.
Copy
1
2
3
4
5
var annotation = new PSPDFKit.Annotations.InkAnnotation();
var serializedObject = PSPDFKit.Annotations.toSerializableObject(annotation);
var json = JSON.stringify(serializedObject);

// The annotation's Instant JSON data can be saved to an external file.

For creating an annotation from the JSON, use PSPDFKit.Annotations.fromSerializableObject(), like so:

Copy
1
2
3
4
5
6
7
8
const { fromSerializableObject } = PSPDFKit.Annotations;

const json = "{...}";
const serializedObject = JSON.parse(json);
const annotation = fromSerializableObject(serializedObject);

// Add the newly created annotation to the document.
instance.create(annotation);
Copy
1
2
3
4
5
6
var json = "{...}";
var serializedObject = JSON.parse(json);
var annotation = PSPDFKit.Annotations.fromSerializableObject(serializedObject);

// Add the newly created annotation to the document.
instance.create(annotation);

There are some limitations with Instant JSON, in that not all annotation types are currently supported, and only the properties that can be handled correctly across all of PSPDFKit’s supported platforms (iOS, Android, and Web) are serialized. For more information, check out the detailed JSON Format guide.

Here’s an Instant JSON sample payload for an ink annotation:

Copy
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
{
  "v": 1,
  "type": "pspdfkit/ink",
  "bbox": [89, 98, 143, 207],
  "blendMode": "normal",
  "createdAt": "2018-07-03T13:53:03Z",
  "isDrawnNaturally": false,
  "lineWidth": 5,
  "lines": {
    "intensities": [[0.5, 0.5, 0.5], [0.5, 0.5, 0.5]],
    "points": [
      [[92, 101], [92, 202], [138, 303]],
      [[184, 101], [184, 202], [230, 303]]
    ]
  },
  "opacity": 1,
  "pageIndex": 0,
  "strokeColor": "#AA47BE",
  "updatedAt": "2018-07-03T13:53:03Z"
}

Instant Document JSON API

Exporting

Copy
1
2
3
instance.exportInstantJSON().then(instantJSON => {
  console.log(instantJSON); // => { format: "https://pspdfkit.com/instant-json/v1", ...}
});
Copy
1
2
3
instance.exportInstantJSON().then(function(instantJSON) {
  console.log(instantJSON); // => { format: "https://pspdfkit.com/instant-json/v1", ...}
});

Instant JSON works seamlessly with the annotation API. If you want to persist annotations whenever changes are made, we recommend you use the annotations.didSave event. This event will be triggered automatically and can be configured via Configuration#autoSaveMode.

Note for standalone users: Instead of saving annotations to the backend, a save operation will persist annotations in memory until they’re either exported via Instance#exportInstantJSON or written to the PDF document when you export it using Instance#exportPDF. Unsaved annotations won’t be exported, so as to reflect the server behavior:

Copy
1
2
3
4
5
6
7
8
9
10
instance.addEventListener("annotations.didSave", async () => {
  const instantJSON = await instance.exportInstantJSON();
  await fetch("https://your-server.com/instant-json", {
    method: "POST",
    headers: {
      "Content-Type": "application/json"
    },
    body: JSON.stringify(instantJSON)
  });
});
Copy
1
2
3
4
5
6
7
8
9
10
11
instance.addEventListener("annotations.didSave", function() {
  instance.exportInstantJSON().then(function(instantJSON) {
    fetch("https://your-server.com/instant-json", {
      method: "POST",
      headers: {
        "Content-Type": "application/json"
      },
      body: JSON.stringify(instantJSON)
    });
  });
});

Standalone Importing

When opening a document with Instant JSON using our standalone setup, make sure you always use the same unmodified PDF that was used to create the Instant JSON:

Copy
1
2
3
4
5
6
7
8
9
PSPDFKit.load({
  document: "https://your-server.com/some/document.pdf",
  instantJSON: {
    format: "https://pspdfkit.com/instant-json/v1",
    annotations: [
      { id: "01BS964AM5Z01J9MKBK64F22BQ", type: "pspdfkit/text", ...}
    ],
  },
})
Copy
1
2
3
4
5
6
7
8
9
PSPDFKit.load({
  document: "https://your-server.com/some/document.pdf",
  instantJSON: {
    format: "https://pspdfkit.com/instant-json/v1",
    annotations: [
      { id: "01BS964AM5Z01J9MKBK64F22BQ", type: "pspdfkit/text", ...}
    ],
  },
})

Server Importing

When you upload a new document to PSPDFKit Server, you can include an Instant JSON document as a second file in the upload. Follow the Server guides for an in-depth example.

Here’s an Instant JSON sample payload for a document with an ink annotation and a bookmark:

Copy
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
{
  "annotations": [
    {
      "v": 1,
      "type": "pspdfkit/ink",
      "id": "01CHG7QMTDT1JFYQ8BSKGT6F3P",
      "bbox": [97.5, 97.5, 155, 205],
      "blendMode": "normal",
      "createdAt": "2018-07-03T14:11:21Z",
      "creatorName": "John Appleseed",
      "isDrawnNaturally": false,
      "lineWidth": 5,
      "lines": {
        "intensities": [[0.5, 0.5, 0.5], [0.5, 0.5, 0.5]],
        "points": [
          [[100, 100], [100, 200], [150, 300]],
          [[200, 100], [200, 200], [250, 300]]
        ]
      },
      "name": "A167811E-6D10-4546-A147-B7AD775FE8AC",
      "note": "",
      "opacity": 1,
      "pageIndex": 0,
      "strokeColor": "#AA47BE",
      "updatedAt": "2018-07-03T14:11:21Z"
    }
  ],
  "bookmarks": [
    {
      "action": {
      "pageIndex": 1,
      "type": "goTo"
      },
      "type": "pspdfkit/bookmark",
      "v": 1
    }
  ],
  "format": "https://pspdfkit.com/instant-json/v1",
  "pdfId": {
    "changing": "wljL9fB/TPOAuGjHAsAsHg==",
    "permanent": "qTwUmg5VSm6ysfzcPlFvnQ=="
  },
  "skippedPdfObjectIds": [557]
}

ℹ️ Note: There’s currently no dedicated API like Instant Annotation JSON API for importing and exporting bookmarks alone. Please use the above Instant Document JSON API for this purpose.