PDF Cobrowsing

Glance Cobrowse supports cobrowsing PDF files that your customer may wish to view when navigating your website. The following section outlines requirements and implementation steps for enabling cobrowsing of PDF files on your web property.

NOTE: The PDFs must be hosted on a webserver. Glance does not support cobrowsing documents downloaded to the customer’s computer.

How it works

All browsers have a built-in native PDF viewer which, unlike the browser's HTML page viewer, cannot run JavaScript, including the Glance Cobrowse JavaScript. The key to making PDF Cobrowse work is to configure Glance Cobrowse to instead open PDF files in the Glance PDF viewer. When a visitor views a PDF document in the Glance PDF viewer, it can be cobrowsed just like any other page.

Implementation

There are two options for enabling the ability to cobrowse PDFs, depending on how users navigate to PDFs on your web property:

Option 1 – Anchor Tag Selectors

In some cases, a PDF document is opened by a visitor clicking on an anchor tag link. In this case, the Anchor Tag Selector method can be used. For example, if your web page has an anchor tag such as:

<a class="pdf" href="https://www.glancevelo.com/pricelist.pdf">Price List</a>

Glance Cobrowse can be configured to automatically open this pdf in the Glance PDF Viewer. This is done via CSS selectors, similar to how you identify masked fields.

The following are some typical selectors, either of which would work for the anchor tag example above:

“a.pdf” All anchor tags with class=”pdf”
“a[href$=pdf]” All anchor tags which reference .pdf files

You provide the PDF css selector list to Glance Support.

Option 2 – JavaScript API Call

Sometimes PDFs are opened via a window.open call in JavaScript. In this case, the JavaScript API Call method must be used. For example, if your web page has a button which opens a PDF file by calling:

window.open("https://www.glancevelo.com/pricelist.pdf")

You must modify your JavaScript to call GLANCE.Cobrowse.Visitor.viewPDF() instead when in a Cobrowse session:

if (GLANCE.Cobrowse.Visitor.inSession()) GLANCE.Cobrowse.Visitor.viewPDF(params) else window.open("[url to the pdf file]")

where

params = { url : ["url to the pdf file"] }

The url to the pdf file must be an absolute url. If the JavaScript works with relative URLs, you can build an absolute URL by combining window.location with the relative path:

var absurl = window.location.protocol + "//" + window.location.hostname + window.location.pathname + "/" + relativeurl GLANCE.Cobrowse.Visitor.viewPDF({url: absurl})

Features

The Glance PDF viewer includes the following interface elements for navigating through the document:

  • Page selector, which allows the visitor to open a specific page in the document
  • Page forward and back buttons
  • Zoom in and out
  • Page up and page down keys

There is a link to open the document in the browser’s native PDF viewer, to get additional functionality not supported by the Glance viewer:

  • Print
  • Form filling (Chrome)

However, once the visitor opens the document in the native viewer, the agent cannot follow.

Limitations

The following is a list of the current limitations of PDF Cobrowsing:

  • No form filling
  • No printing
  • No masking
  • Agent cannot scroll
  • PDFs currently always open in the same tab, regardless of how the website behaves when not in a cobrowse session
  • Original page and PDF must share same protocol to avoid mixed content errors
  • Original page and PDF must either be on the same domain, or the PDF server must return CORS (cross-origin resource sharing) headers
  • Any limitations of PDF.js: no video, high-resolution images, etc.

By continuing to use the site, you agree to the use of cookies. Learn More