Web SDK

編集履歴

プラグイン情報

スライドのテキスト、図形、スライドの順序 を変更した後、履歴を開いて以前のバージョンを確認し、変更を比較して、権限があればバージョンを復元できます。履歴はサーバーに永続化されたバージョンを読み取ります。元に戻す・やり直す操作は現在の編集セッションに適用され、履歴サービスは不要です。

共同編集と履歴サービスの準備

共同編集の統合とライセンスの設定を完了してください。2 つのセッションで同じ Slides ドキュメントを編集でき、再読み込み後も変更が保持されることを確認します。

Office 共同編集の拡張と履歴の例を参考に、履歴ストレージと権限を接続します。共同編集のコア機能は履歴を自動的に有効にしません。バックエンドには履歴一覧、各バージョンの内容、復元の機能も必要です。

履歴プラグインの追加

既存の製品、ライセンス、共同編集の設定に以下を追加します。プリセットや既存の設定でこれらのプラグインを登録済みの場合は、重複登録せず、その設定を更新してください。

Shell
pnpm add @univerjs-pro/edit-history @univerjs-pro/edit-history-ui @univerjs-pro/slides-history @univerjs-pro/slides-history-ui
TypeScript
import { UniverEditHistoryPlugin } from '@univerjs-pro/edit-history'import EditHistoryLocale from '@univerjs-pro/edit-history-ui/locale/en-US'import { UniverSlidesHistoryPlugin } from '@univerjs-pro/slides-history'import { UniverSlidesHistoryUIPlugin } from '@univerjs-pro/slides-history-ui'import HistoryLocale from '@univerjs-pro/slides-history-ui/locale/en-US'import { LocaleType, mergeLocales } from '@univerjs/core'import '@univerjs-pro/edit-history-ui/lib/index.css'const historyServerUrl = '/api/history'univerAPI.loadLocales(LocaleType.EN_US, mergeLocales(EditHistoryLocale, HistoryLocale))univer.registerPlugin(UniverEditHistoryPlugin, { historyServerUrl })univer.registerPlugin(UniverSlidesHistoryPlugin)univer.registerPlugin(UniverSlidesHistoryUIPlugin, {  univerContainerId: 'app',  historyServerUrl,})

/api/history をアプリケーションの履歴エンドポイントに置き換え、API がクライアントのリクエストに対応していることを確認します。2 つの historyServerUrl は同じ値にしてください。univerContainerId にはエディターコンテナーの DOM ID を設定し、エディターに合う言語パックを読み込みます。

履歴ビューアーは独立した読み取り専用エディターを作成します。独自のコンテンツには、viewerPlugins を使ってビューアーに含まれていないプラグインを追加してください。内蔵のビューアープラグインを重複登録しないでください。

バージョンの表示と復元

エディターのメニューから履歴を開き、バージョンを選択して内容と変更を確認します。復元すると現在の共有ドキュメントが変更されます。復元権限のあるユーザーだけが実行できるようにし、サーバーでも必ず権限を検証してください。

統合を検証するには、スライドのテキスト、図形、スライドの順序 を変更し、共同編集の確認応答を待ってから履歴一覧とバージョンの内容を確認します。アプリケーションを開き直し、サービスを再起動して永続化を検証してください。以前のバージョンを復元し、別のブラウザーセッションにも復元後の状態が届くことを確認します。

一覧が空の場合は、ドキュメントの履歴が記録されているかを確認し、次にドキュメント ID とサービス URL を確認します。表示できても復元できない場合は、復元権限と共同編集の接続を確認してください。古いバージョンには削除済みのデータが含まれる可能性があるため、履歴の読み取りにも認可が必要です。

スナップショットの比較

レビュー画面や AI Agent に変更情報を渡すには、compareUnitData() を使うか、prepareUnitComparison() で一度計算した結果を繰り返し検索します。対象製品の History プラグインを登録し、Facade エントリーをインポートしてください。同じドキュメントの完全なスナップショットを beforeSnapshot と afterSnapshot に渡します。この読み取り専用の比較には履歴サービスは不要で、復元やマージも行いません。

TypeScript
import { UnitComparisonDetailLevel, UnitComparisonFidelity } from '@univerjs-pro/edit-history'import { UniverInstanceType } from '@univerjs/core'import '@univerjs-pro/edit-history/facade'const comparison = univerAPI.prepareUnitComparison({  comparisonId: 'review-1',  unitId: beforeSnapshot.id,  type: UniverInstanceType.UNIVER_SLIDE,  fidelity: UnitComparisonFidelity.SNAPSHOT,  leftData: beforeSnapshot,  rightData: afterSnapshot,})const overview = comparison.query({ detail: UnitComparisonDetailLevel.SUMMARY })const scope = overview.scopes[0]const page = comparison.query({ scope, offset: 0, limit: 100 })console.log(page.items, page.page.hasMore, page.diagnostics)

scopes から利用可能なビューを取得し、選んだ範囲を query() に渡すと、再計算せずに結果を絞り込めます。既定は 100 件、上限は 1 ページ 1,000 件です。続きは page.hasMore と offset で取得します。summary は絞り込み後も比較全体を表します。diagnostics.readiness と diagnostics.codes を確認し、精度が低下した結果を完全な比較として扱わないでください。エディターを作成しない Node.js・CLI の使い方はヘッドレス比較 APIを参照してください。

このガイドはいかがですか？

© 2026 DreamNum Co., Ltd.