WebViewer とは？

WebViewer の JavaScript ライブラリの概要

WebViewer は、ドキュメントを閲覧、注釈、編集するための JavaScript ライブラリです。最も簡単な方法として、アプリ内で WebViewer が配置される DOM 要素を渡し、WebViewer にドキュメントの URL を提供することでドキュメントを表示することができます。

JavaScript

      
        WebViewer({
        initialDoc: 'https://pdftron.s3.amazonaws.com/downloads/pl/demo-annotated.pdf'
        }, document.getElementById('viewer')).then(instance => {
        // WebViewer is initialized
        });

裏側では、デフォルトの WebViewer UI をインスタンス化し、ドキュメントを読み込む iframe が作成されています。UI をカスタマイズしたり、ビューアーやドキュメントを操作するための API が用意されています。下位の API では、独自のビューアーを作成したり、UI を使用せずにドキュメントを処理することができます。

どのように機能するの？

WebViewer は、WebAssembly のようなクライアントサイドの技術を利用して、PDF を素早く解析し、レンダリングします。PDFTron の C++ SDK はモジュールにコンパイルされており、ブラウザに直接読み込むことができます。

これは、ドキュメントのレンダリング作業が完全にブラウザによって行われ、サーバーが不要であることを意味します。サーバーは、ドキュメントと JavaScript ファイルを静的にホストするためだけに使用されるかもしれませんが、ユーザーのコンピュータからローカルファイルを読み込むことも可能です。レンダリングがクライアントで行われるということは、レンダリングを行うサーバーのメンテナンスやスケーリングを心配する必要がないことを意味します。

クライアント レンダリング使用時には、PDF、画像、Office ドキュメントを読み込むことが可能です。

クライアントサイドだけでは不十分な場合とは？

クライアントサイド レンダリングは、最新のブラウザーとそれなりに高性能なデバイスを使用している場合にはうまく機能しますが、ユーザー ベースの大部分が Internet Explorer や低性能なモバイル デバイスを使用している場合はどうでしょうか。クライアントサイド レンダリングはまだ機能しますが、ユーザーにとって許容できるパフォーマンスではないかもしれません。

WebViewer Server は、WebViewer のドロップイン バックエンドで、レスポンシブ表示とすべてのクライアント プラットフォームとの互換性を提供し、純粋なクライアントサイド ソリューションに近いスケーリング パフォーマンスを実現します。WebViewer Server はクライアントの WebViewer と連動し、最初に画像を提供した後、クライアントサイド レンダリングに移行します。

サーバーは Docker コンテナで実行されるので、素早く簡単にセットアップができ、試してみることができます。サーバーがデプロイされると、追加のコンストラクター オプションである webviewerServerURL を渡すだけで、同じ WebViewer API を使用してドキュメントとやり取りできるようになります。

v8.0+ の場合

      
        WebViewer({
        initialDoc: 'https://pdftron.s3.amazonaws.com/downloads/pl/demo-annotated.pdf',
        // demo.pdftron.com is for demo purposes only, replace with your own deployed server
        webviewerServerURL: 'https://demo.pdftron.com'
        }, document.getElementById('viewer').then(instance => {
        // WebViewer is initialized
        });

v7.0+ の場合

      
        WebViewer({
        initialDoc: 'https://pdftron.s3.amazonaws.com/downloads/pl/demo-annotated.pdf',
        // demo.pdftron.com is for demo purposes only, replace with your own deployed server
        pdftronServer: 'https://demo.pdftron.com'
        }, document.getElementById('viewer').then(instance => {
        // WebViewer is initialized
        });

内部的には、WebViewer はドキュメントの URL をサーバーに渡し、サーバーはそれをダウンロードし処理します。クライアント デバイスおよびブラウザの機能とドキュメントのプロパティに基づいて、WebViewer Server はクライアント モジュールがロードされるとクライアント レンダリングに切り替えたり、クライアント レンダリング用にドキュメントを最適化したり、サーバーでのレンダリングを継続したりします。

サーバーをもっと制御したい場合は？

WebViewer Server は Docker コンテナーまたは Tomcat の直接インストーラーとして提供され、設定用のオプションもかなり充実していますが、場合によってはサーバー環境をよりコントロールできることが望ましいかもしれません。WebViewer サーバーの裏側では、PDFTron のネイティブ PDF SDK を使用してファイルのレンダリングと最適化を行っており、これらの同じ API を自分のサーバーで利用することができます。クロスプラットフォーム SDK は Linux、Windows、Mac に対応し、様々な言語で利用可能です。

PDFTron サーバー SDK を使用すると、様々な種類のドキュメントを、あらゆるブラウザやデバイスの WebViewer で素早くレンダリングできる、XOD と呼ばれる Web 最適化 XPS ファイルへ変換することができます。XOD ファイルを使用することで、最高のパフォーマンスを得るためにドキュメントを事前に変換するワークフローも可能になります。カスタム サーバーの展開について詳しくは、こちらをご覧ください。

より多くのファイル形式をサポートする

WebViewer Server は、パフォーマンスの向上だけでなく、CAD ドキュメントを含む他の多くのドキュメント形式の読み込みもサポートしています。詳細はこちらをご覧ください。

WebViewer Server では、サポートされているドキュメント タイプの 1 つに URL を渡すだけで、WebViewer に読み込ませることができます。自分のサーバーで PDFTron SDK を使用する場合、まずドキュメントを XOD または PDF に変換する必要があります。

まとめ

目次



無償トライアル

評価版のダウンロードはこちらから。

お問い合わせ

ライセンス、価格、お見積りなど、本製品に関するご質問、ご不明な点はエクセルソフトまでお気軽にお問い合わせください。