Using the DocViewer Client
Intro
DocViewer is a document viewing and annotating platform. Users upload documents, which are then converted to PDFs, then displayed in the DocViewer client. Users can then annotate and comment on the documents. This is ideal for grading, taking notes, peer reviews, etc.
The primary way to use DocViewer is to load the client in your webpage. This will require the following steps:
The client may be loaded in:
Create a Document
You need to have a publicly available URL that DocViewer can use to retrieve your document. DocViewer will retrieve the document, run it through the conversion process, and push the resulting PDF to Amazon S3. From then on, DocViewer will use only the converted document, not the original.
Please note that even if the original file is a PDF, it will still go through this process.
You will need an API key for this, but for the purposes of local
development you can use apikey
.
With your document URL handy, call the Create Document Endpoint. Example:
POST http://canvadocs.docker/1/documents
Content-Type: application/json
Authorization: Token apikey
{
name: "test.pdf",
preferred_plugin: "pdfjs",
url: "http://www.example.com/test.pdf"
}
Hang on to the id
that is returned by this call. You'll need it in the next step.
Please note that this call returns before the document conversion process is complete. As such, it may take a couple seconds for your document to be ready for the next step. See the Create Session Endpoint for more details.
Launch a Session
With the document id
in hand, you're ready to create a DocViewer session.
Example:
POST http://canvadocs.docker/1/sessions
Content-Type: application/json; charset=utf-8
Authorization: Token apikey
{
"document_id":"P5C5i6g4nldMNrSsFfWnmJJI83qVl6", // Replace with your document ID
"render_id":"P5C5i6g4nldMNrSsFfWnmJJI83qVl6-pdfjs",
"render_plugin":"pdfjs",
"duration":10080,
"annotation_context":"canvadocs_admin",
"permissions":"readwrite",
"user_id":"standard_user",
"user_name":"Standard User",
"user_role":"user-role"
}
For more details on the options available here see the Create Session Endpoint. For the different DocViewer modes, see the Session Types page.
This call will return an id
. This is a jwt that contains everything Docviewer
needs to launch. You'll use this in the next step.
Load the app
You'll need to create an Iframe, with the View Endpoint as the src. Example:
<iframe src="http://canvadocs.docker/1/sessions/SESSION_ID/view" allowfullscreen="1"><iframe>
Where SESSION_ID
is the ridiculously long jwt from the previous step.
And that's it! With the DocViewer client loaded in the Iframe, the user can view, interact with, and annotate the document. Retain the Document ID, then each time you want to load the document, create a new session.