リアルタイムなコラボレーションモードでPDFを編集する

PDFビューワは、コラボレーションモードにてリアルタイムな共同編集をサポートしており、PDFドキュメントをWeb上の他のユーザーと共有し、同時に編集できます。
ドキュメントを「表示と変更」モードまたは「表示のみ」モードで共有するには、ビューワのツールバーの共有ボタンをクリックします。
共有ドキュメントパネルからPDFを開くと、複数のユーザーがPDFに加わえた変更をリアルタイムで見ることができ、 許可されていれば他のユーザーに見えるように自分でPDFを変更することもできます。
ドキュメントを共有中は、共有ユーザやそのユーザーが共有ドキュメントに加えた変更を確認することができます。

function updateToolbarLayout(layout) { layout.splice(layout.indexOf('save'), 1); layout.splice(1, 0, "save"); layout.splice(2, 0, "share"); } function updateToolbar(viewer) { updateToolbarLayout(viewer.toolbarLayout.viewer.default); updateToolbarLayout(viewer.toolbarLayout.viewer.mobile); } window.onload = function(){ const userName = prompt("名前を入力してください", "ユーザー") || "ユーザー"; const viewer = new DsPdfViewer("#viewer", { workerSrc: "/diodocs/pdfviewer/demos/product-bundles/build/dspdfviewer.worker.js", supportApi: { apiUrl: window.top.SUPPORTAPI_URL, token: window.top.SUPPORTAPI_TOKEN, webSocketUrl: window.top.SUPPORTAPI_WEBSOCKET_URL }, userName, restoreViewStateOnLoad: false, language: "ja" }); viewer.addDefaultPanels(); viewer.addAnnotationEditorPanel(); viewer.addFormEditorPanel(); viewer.addSharedDocumentsPanel(); viewer.beforeUnloadConfirmation = true; updateToolbar(viewer); viewer.open("/diodocs/pdfviewer/demos/product-bundles/assets/pdf/BalancedColumns-annotated.pdf"); }
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>コラボレーションモード</title> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" href="./src/styles.css"> <script src="/diodocs/pdfviewer/demos/product-bundles/build/dspdfviewer.js"></script> <script src="/diodocs/pdfviewer/demos/product-bundles/build/wasmSupportApi.js"></script> <script src="/diodocs/pdfviewer/demos/resource/js/init.js"></script> <script src="./src/app.js"></script> </head> <body> <div id="viewer"></div> </body> </html>
#viewer { height: 100%; }