**Source URL:** https://limited.veevavault.dev/commercial/library/guides/external-document-viewer

# Vault External Document Viewer

You can embed the external document viewer into a website or use it as a standalone viewer for documents in your Vault. Vault ensures that only the latest steady state version of the document will be accessible through the viewer at all times.

<Aside>
The external document viewer is only available in [PromoMats](https://commercial.veevavault.help/en/lr/26440) and [MedComms](https://medical.veevavault.help/en/lr/26440) Vaults with the **Public Distribution** and **View-Based User** license type features enabled.
</Aside>

The External Viewer has the following unique properties:

*   Allows anonymous access to documents stored in Vault.
*   Can be embedded in an iFrame within a website using the JavaScript code below.
*   Supports use as a standalone browser page.

The Token API generates document access tokens needed by the external viewer:

*   A valid Vault session is required to ensure the non-Vault user has access to the document.
*   Only users with a view-based license can access the endpoint to request an anonymous viewing token.
*   In order to generate the token, a valid session ID is required.

## Setting up the External Viewer

You can include the following snippet of JavaScript code into your website to display a specific Vault document.

```html
<!DOCTYPE html>
<html>
 <body>
   <!-- 1. The <iframe> (and Vault viewer) will replace this <div> tag. -->
   <div id="viewer"></div>

   <script>
     // 2. This code loads the IFrame Viewer API code asynchronously.
     var tag = document.createElement('script');

     tag.src = 'https://js.veevavault.com/vault.js';
     var firstScriptTag = document.getElementsByTagName('script')[0];
     firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

     // 3. This function creates an <iframe> (and Vault viewer) after the API code downloads.
     var viewer;
     function onVeevaVaultIframeAPIReady() {
       viewer = new VV.Viewer('viewer', {
         height: '600',
         width: '600',
         error: 'We\'re sorry. The document you are trying to view is not available.'
       });
     }
   </script>
 </body>
</html>
```

Once the viewer is embedded, a Vault Document Token generated for the desired document needs to be provided in the URL parameters, as well as a DNS parameter to pass the source Vault's DNS.

## Generating Tokens for Vault Documents

Generate tokens with the [Document Tokens endpoint](/commercial/vault-api/api-reference/26.1/documents/document-tokens).

<Endpoint path="/api/{VERSION}/objects/documents/tokens" method="POST" />

## How to Create the URL

When sharing your documents in an embedded viewer, users must navigate to a URL that includes both the anonymous viewing token and your Vault's DNS:

```bash
https://{PAGE_WITH_EMBED_SCRIPT}?token={VIEWING_TOKEN}&dns={CUSTOMER}.veevavault.com
```

For example, a URL for information for the CholeCap product might be:

```bash
https://cholecap.com/about.html?token=3003-cb6e5c3b-4df9-411c-abc2-6e7ae120ede7&dns=myvault.veevavault.com
```

If you want to display multiple documents in the viewer, use the `tokenGroup` parameter when requesting tokens and use any of the tokens from the response within the URL. Vault will determine whether a token belongs to a group and will automatically show all documents within the group. The token in the URL corresponds to the document that displays when the viewer loads.