Importing and exporting annotations with Document Engine

When you use Nutrient Web SDK with Document Engine, all of a document’s annotations are imported from Document Engine when you open it. When you create new annotations or update existing annotations through the UI or the API, the changes are exported to Document Engine as well. This process is transparent to you and your users. You can control when the annotations are saved by changing the auto-save mode.

With Instant, changes made to annotations are automatically synchronized between all the connected users, enabling real-time collaboration capabilities in your application.

Importing and exporting annotations in Instant JSON with Document Engine

You can export and import annotations (including custom rendered annotations) to and from documents opened from Document Engine in the Instant JSON format.

To export annotations, use the PSPDFKit.Instance.exportInstantJSON method. For example, to print an opened document’s Instant JSON to the console, use the following code snippet:

const instantJSON = await instance.exportInstantJSON();
console.log(instantJSON);

To import annotations in the Instant JSON format to the currently open document, use the PSPDFKit.Instance.applyOperations API, as demonstrated in the following code snippet. The instantJson variable in the code below is an Instant JSON object — for example, the result of parsing a JSON string with JSON.parse:

await instance.applyOperations([
  { type: "applyInstantJson", instantJson: instantJson }
]);

Importing and exporting annotations in XFDF with Document Engine

You can also export and import annotations (including custom rendered annotations) to and from documents opened from Document Engine in the XFDF format.

To export annotations, use the PSPDFKit.Instance.exportXFDF method. For example, to print the opened document’s XFDF file to the console, use the following code snippet:

const xfdf = await instance.exportXFDF();
console.log(xfdf);

To import annotations as XFDF to the currently open document, use the PSPDFKit.Instance.applyOperations API, as demonstrated in the following code snippet. The xfdf variable in the code below is an XFDF string:

await instance.applyOperations([
  { type: "applyInstantXfdf", xfdf: xfdf }
]);