Use Document Viewer

Overview

Use the Document Viewer control to render a document and display it inline in UiPath^® Apps. This feature is useful in certain scenarios, such as displaying an invoice document or a receipt from various sources like storage buckets, entities, or publicly accessible links.

For more information, see the Document Viewer page.

In the exercises below we will build simple apps with different sources for the Document Viewer control. This exercise will help you better understand how the control works and learn how to use it efficiently in your apps.

The different sources for the exercises below are:

• Entities
• Public URL
• Storage bucket

Entities

Prerequisites

Before starting this example, make sure that you have the proper permissions from Data Service. For more information, check the Data Service - Managing Access page.

In this example we will use an entity called File with the following fields:

• Avatar - type File
• Image - type File
• Name - type Text
• Renamed - type File
  
  

  

  
  

Add data to the entity (figures for the File fields and names for the Text field).

Procedure

1. Open your existing application or start a new one.

2. Add the entity created during Prerequisites to your app by clicking the Add any icon from the top of the canvas and selecting Entity.

   
   

   

   
   
3. Add a Document Viewer control to your app.
4. Configure the Data context property of the page by using a Lookup function. Configure the property so that it can search for a data id inside the File entity using the following format: Lookup(Entity, [Entity,Id, "=", "id of the entity"]). In this particular example, it should look like: Lookup(File, [File.Id, "=", "F99D676D-09E7-EC11-B656-281878D3E284"]).
   
5. Go to the Document Viewer control and configure the Source property. Add any File type field from the Data Context section, in the the Resources panel.
   
   

   

   
   

Public URL

Use the Document Viewer control to render a document using a public URL. Add the URL in the Source property of the control.

Note: The URL must be secure, starting with https.

Storage Bucket

Prerequisites

Before starting this example, you must have a storage bucket configured in Orchestrator and imported in your application.

For more information, see the Referencing a Storage Bucket from Orchestrator page

Procedure

1. Open your existing application or start a new one.

2. Add the storage bucket to your app by clicking on the Add any icon from the top of the canvas and selecting Storage bucket.

   
   

   

   
   
3. Add a Document Viewer control to your app.

4. Add a Get file from Storage bucket rule for the Loaded event of the page.

   
   

   

   
   

5. Configure the Get file from Storage bucket rule as follows:

   • In the Storage bucket field, pick the storage bucket containing the file you want to download.
   • Go to the storage bucket in Orchestrator and copy the name of the file you need to download. Paste the name in the File Name field, including the extension.

   • Add a new variable in the Assign file to app variable field.

     
     

     

     
     
6. Select the Document Viewer control and assign the previously created variable in the Source property.