DioDocs for PDF
共有および共同編集
PDFビューワ > PDFの編集 > 共有および共同編集

PDFビューワを使用することで、PDFドキュメントを他のユーザーと共有できます。ドキュメントは、表示モードまたは編集モードで共有でき、複数のユーザーがリアルタイムで作業できます。また、リアルタイムコラボレーションと呼ばれる、共有ドキュメントで他のユーザーの存在とユーザーによる変更を確認することもできます。

以下の画像は、複数のユーザーによって編集された共有モードのPDFドキュメントを示し、変更点はユーザー名とともに表示されます。

SupportApiを使用するように構成すると、PDFドキュメントは次の方法で編集できます。

共有モードの設定

複数のユーザーが共有ドキュメントで作業できる共有モードは、永続的なクライアント接続でのみ機能するように設計されています。これを確実にするために、SupportApiには次のnugetパッケージの依存関係が含まれています。

共有ドキュメントが編集されると、サーバー側のSupportApiコードは変更点を受信して即時に接続されたクライアントに送信します。

共有モードの永続的なクライアント接続をサポートするには、Startup.csファイルを編集してWebアプリケーションを構成します。

共同編集モードの永続的なクライアント接続をサポートするには、以下の手順に従って Program.cs ファイルを編集して Web アプリケーションを構成します。

  1. 「SupportApi.Connection.DsPdfViewerHub.ConfigureServices(services);」を呼び出して、SignalR サービスをサービス コレクションに追加します。
                        DsPdfViewerHub.ConfigureServices(builder.Services);
  2. SignR ハブをマップします。
    // Signalr ハブをコラボレーション モードに設定します。

    IApplicationBuilder applicationBuilder = app.UseEndpoints(endpoints =>

    {

          endpoints.MapControllers();

          endpoints.MapHub("/signalr", opts => {

                  opts.TransportMaxBufferSize = 268435456L;

                  opts.ApplicationMaxBufferSize = 268435456L;

          });

    });

1.  ConfigureServicesメソッドでは、SupportApi.Connection.DsPdfViewerHub.ConfigureServices(services);を呼び出して、SignalRサービスをサービスコレクションに追加します:

        public void ConfigureServices(IServiceCollection services)
        {
            services.AddRazorPages();
            // ルーティングを有効にします
            services.AddMvc((opts) => { opts.EnableEndpointRouting = false; });
            services.AddRouting();
            // SignalRサービスをサービスコレクションに追加します
            SupportApi.Connection.GcPdfViewerHub.ConfigureServices(services);
        }

2. Configureメソッド内にSignalRハブをマップします。


        public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
        {
            app.UseEndpoints(endpoints =>
            {
                endpoints.MapRazorPages();
               // SignalRハブをマップします
                endpoints.MapHub<SupportApi.Connection.GcPdfViewerHub>("/signalr");
            });
  }

コラボレーション モードの永続的なクライアント接続をサポートするには、Startup.cs ファイルを編集して Web アプリケーションを構成します。

[assembly: OwinStartup(typeof(SupportApiDemo_WebForms.Startup))]
namespace SupportApiDemo_WebForms {


  public class Startup {

    public void Configuration(IAppBuilder app)

    {
      // ... 残りのコードはここ
      SupportApi.Connection.GcPdfViewerHub.Configure(app);
      // オプションとして既知のユーザーを追加できます。追加されたユーザー名は、提案ポップアップとしてユーザーインタフェースに表示されます
      GcPdfViewerController.Settings.AvailableUsers.Add("Anonymous");
      GcPdfViewerController.Settings.AvailableUsers.Add("James");
      GcPdfViewerController.Settings.AvailableUsers.Add("Lisa");    
      // たとえば、ICollaborationStorageインタフェースを実装する独自の共有ドキュメントストレージを使用できます
      GcPdfViewerController.Settings
          .Collaboration
          .Storage
          .UseCustomStorage(myCloudStorage);
    }
  }
}

 

メモ:ASP.NET CoreプロジェクトでSupportApiを使用するには、ASP.NET Core3.0以降が必要です。既存のASP.NETCore 2.2プロジェクトを3.0にアップグレードする方法の詳細については、このリンクを参照してください。

共有モードで編集点の保存

共有モードでPDFドキュメントを変更すると、変更されたドキュメントはデフォルトでサーバーのメモリに保存されますが、その変更点は、次のいずれかの場合に破棄されます。

以下のいずれかの方法で回避できます。

  1. 次のコードを使用してローカルフォルダ(ファイルシステム)ストレージを使用します。
    Program.cs
    コードのコピー
    DsPdfViewerController.Settings
      .Collaboration
      .Storage
      .UseFileSystem(Path.Combine(env.ContentRootPath, "LocalStorage"), 8);
    
       
  2. 以下のコードを使用して、共有ドキュメントの有効期間を変更し、共有ドキュメントの変更を24時間保持します。
    Program.cs
    コードのコピー
    DsPdfViewerController.Settings
      .Collaboration
      .Storage
      .UseMemory(24);
    
  3. ICollaborationStorageインタフェースを実装することにより、カスタムストレージタイプを使用して共有ドキュメントを保存します。
    Program.cs
    コードのコピー
    public class FileSystemStorage : ICollaborationStorage
    {
            private readonly string _directoryPath;
            private object _readLock = new object();
            private object _writeLock = new object();
            public FileSystemStorage(string directoryPath)
            {
                _directoryPath = directoryPath;
            }
           //ICollaborationStorage インターフェイスの実装
            public Task<byte[]> ReadData(string key)
            {           
                return Task.Factory.StartNew(() =>
                {
                    string filePath = Path.Combine(_directoryPath, $"{key}");
                    if (File.Exists(filePath))
                    {
                        lock (_readLock)
                        {
                            return File.ReadAllBytes(filePath);
                        }
                    }
                    return null;
                });
               
            }
            public Task WriteData(string key, byte[] data)
            {
                return Task.Factory.StartNew(() =>
                {
                    var filePath = Path.Combine(_directoryPath, $"{key}");
                    lock (_writeLock)
                    {
                        if (data == null)
                        {
                            if (File.Exists(filePath))
                                File.Delete(filePath);
                        }
                        else
                        {
                            File.WriteAllBytes(filePath, data);
                        }
                    }
                });
            }
    }
    
  1. 次のコードを使用してローカルフォルダ(ファイルシステム)ストレージを使用します。
    startup.cs
    コードのコピー
    DsPdfViewerController.Settings
      .Collaboration
      .Storage
      .UseFileSystem(Path.Combine(env.ContentRootPath, "LocalStorage"), 8);
    
       
  2. 以下のコードを使用して、共有ドキュメントの有効期間を変更し、共有ドキュメントの変更を24時間保持します。
    startup.cs
    コードのコピー
    DsPdfViewerController.Settings
      .Collaboration
      .Storage
      .UseMemory(24);
    
  3. ICollaborationStorageインタフェースを実装することにより、カスタムストレージタイプを使用して共有ドキュメントを保存します。
    startup.cs
    コードのコピー
    public class FileSystemStorage : ICollaborationStorage
    {
            private readonly string _directoryPath;
            private object _readLock = new object();
            private object _writeLock = new object();
            public FileSystemStorage(string directoryPath)
            {
                _directoryPath = directoryPath;
            }
           //ICollaborationStorage インターフェイスの実装
            public Task<byte[]> ReadData(string key)
            {           
                return Task.Factory.StartNew(() =>
                {
                    string filePath = Path.Combine(_directoryPath, $"{key}");
                    if (File.Exists(filePath))
                    {
                        lock (_readLock)
                        {
                            return File.ReadAllBytes(filePath);
                        }
                    }
                    return null;
                });
               
            }
            public Task WriteData(string key, byte[] data)
            {
                return Task.Factory.StartNew(() =>
                {
                    var filePath = Path.Combine(_directoryPath, $"{key}");
                    lock (_writeLock)
                    {
                        if (data == null)
                        {
                            if (File.Exists(filePath))
                                File.Delete(filePath);
                        }
                        else
                        {
                            File.WriteAllBytes(filePath, data);
                        }
                    }
                });
            }
    }
    

PDFドキュメントの共有

PDFビューワのツールバーに存在する[共有]ボタンを使用することで、PDFドキュメントを共有できます。

次のコードを使用して[共有]ボタンをツールバーに追加します。

Index.cshtml
コードのコピー
viewer.toolbarLayout.viewer.default = ["share"];
viewer.applyToolbarLayout();

[共有]ボタンをクリックすると、[アクセス管理]ダイアログが開きます。 

[アクセス管理]ダイアログでユーザーにアクセスを提供し、権限を「表示のみ」や「表示と変更」に設定することができます。

既存ユーザーのアクセスを変更したり、ドキュメントの共有を停止したりすることもできます。

メモ:PDFドキュメントの所有者は、上記のすべての操作を実行できます。他のユーザーは、所有者を編集/削除したり、その権限を変更したりすることはできません。ただし、編集権限を持つユーザーは、他のユーザーを追加したり、権限を変更したり、ドキュメントの共有を停止したりできます。

共有されたPDFドキュメントを開く

[共有ドキュメント]パネルを使用して共有されたPDFドキュメントを開くことができます。このパネルには、現在のユーザーが共有しているドキュメント、アクセスできるすべてのドキュメントと、アクセスモードに関する情報が一覧表示されます。

次のコードを使用することで、[共有ドキュメント]パネルをサイドバーパネルに追加することができます。

Index.cshtml
コードのコピー
var viewer = new DsPdfViewer("#root", { supportApi: 'api/pdf-viewer'} );
viewer.addSharedDocumentsPanel();

リアルタイム共同編集

複数のユーザーが同時にPDFドキュメントで共同作業を行う場合、ユーザーの名前とともにリアルタイムの変更を確認できます。共有ドキュメントを開くと、次のように、ドキュメントのアクセスタイプが記載された「共有モード」ラベルがドキュメントの右上に表示されます。

APIでのsharingオプションを使用することでもドキュメントの共有設定を行うことができます。