Dynamics 365 Business Central: Preview files within BC (PDF, JPG, PPTX, DOCX, XLSX, TXT, CSV, MP4…… Most file types supported for previewing files in SharePoint) – No JavaScript control add-in

Dynamics 365 Business Central

Hi, Readers.
Today I would like to discuss an interesting topic, can we preview files within BC? For example, preview PDF, Excel, PPT, JPG or other files?

First of all, as of now, this is not possible with standard functionality. For previewing PDFs, some experts use Javascript control add-in that can achieve, more details: PDF Viewer in Business Central
And in the next major (BC26), Microsoft will also add Preview PDF attachments directly in web client feature. This is very helpful for previewing PDF files. However, these methods are currently only applicable to PDF. So is there a way to do the same for files in other formats?

In this post, I will introduce an interesting method that can open most file types supported for previewing files in SharePoint.
PS: File types supported for previewing files in OneDrive, SharePoint, and Teams

Why SharePoint? Let me continue. In fact, the method this time is not complicated. This week we discussed Dynamics 365 Business Central: Manage attachments in SharePoint (Save attachments externally and do not use BC capacity). In it I mentioned that files can be opened directly from BC via the web URL returned by SharePoint. For example,

So we can open the file from the browser through SharePoint. The specific approach is that when opening a file, temporarily upload the file to SharePoint through the Graph API, and then open the file through the returned Web URL. This is the same as the standard Open in OneDrive feature.

The files will be saved in the user’s OneDrive folder and will not be deleted.

The second question is how to open it within BC. The above explanation and standard Open in OneDrive are all about opening a new tab.
In Dynamics 365 Business Central: Using Hyperlink() Method to open a URL in a current session without opening a new tab in the browser, we talked about a simple solution.

Open a URL in a current session without opening a new tab in the browser.

This does not require any special Javascript or creation of a new add-in, it can be done using the standard WebPageViewer control add-in.

That’s all, let’s look at a concrete example.

First create a new page to preview the file.

Then add a new action on the Document Attachment Details page to preview the selected file.

Create a codeunit to manage the logic, this time mainly authentication and uploading.
More details: How to use OAuth 2.0 in AL with SecretText (Using codeunit 501 OAuth2)

More details: How to upload files from Business Central to SharePoint (document library) via AL (Graph API)

Then we can test it.

  • PDF
  • JPG
  • PPTX
  • DOCX
  • XLSX
  • TXT
  • CSV
  • MP4

Test video:

And sorry, I haven’t tried all types of files, but I have tested the ones mentioned in the title. Some files have special editors in SharePoint, such as Json files. If you preview them directly in BC, you will be prompted to download and cannot view them directly.

In SharePoint:

Great, give it a try!!!😁

Source Code: GitHub (Please note that the source code is for reference only, you can improve it according to your own needs)

PS:
1. I have tried deleting the file when closing the page, but since the OnClosePage() trigger has not been executed after the page is completely closed, for editable files such as Excel, PPT, etc., errors may occur that the file is still open (locked) and cannot be deleted. For non-editable files, such as PDF, this error does not occur. So in this case I kept the file and didn’t delete it. If you are interested in the deletion process, you can refer to the code in Github.

Failed to Delete files in SharePoint: 423 {“error”:{“code”:”notAllowed”,”message”:”The resource you are attempting to access is locked“,”innerError”:{“code”:”resourceLocked”,”date”:”2025-01-30T06:07:49″,”request-id”:”3e27ca26-6ceb-4b6a-b0ab-faeea3b28a0d”,”client-request-id”:”3e27ca26-6ceb-4b6a-b0ab-faeea3b28a0d”}}}

This problem may also occur if other users have the file open. Because the logic of this test is to upload a new file each time. When uploading a new file, if the name is the same, the original file will be overwritten, so if a user opens it, it cannot be overwritten. If you want to be more perfect, you can add a GET logic first.
In addition, you can force delete it on the SharePoint side:

2. Using Worksheet page type instead of Card page type can make the page caption appear smaller.

3. If it is not a valid URL or an insecure URL, the following error will occur.

Insecure URL Specified.
Please contact your system administrator.

4. If the SharePoint URL format is correct, but the SharePoint file id is incorrect or has been deleted, the following error will be displayed.

404 NOT FOUND

5. The same function should be possible using OneDrive. I may try it in a future blog. More details: How to upload files from Business Central to OneDrive via AL (Graph API)

6. Just add some basic settings and tests, I hope it can also give you some tips:

Microsoft Graph API: Microsoft Graph is a RESTful web API that enables you to access Microsoft Cloud service resources. After you register your app and get authentication tokens for a user or service, you can make requests to the Microsoft Graph API.

Registering your application establishes a trust relationship between your app and the Microsoft identity platform. This part of the setup is the same as in Using OAuth to connect Business Central APIs and Web Service in Postman. Just the API permissions are different.

To configure application permissions for the app in the app registrations experience on the Microsoft Entra admin center, follow these steps:

  • On the application’s API permissions page, choose Add a permission.
  • Select Microsoft Graph > select Application permissions.
  • In the Select Permissions dialog, choose the permissions to configure to the app.

This time I only added Microsoft Graph -> Application -> Files.ReadWrite.All.

PS: Upload or replace the contents of a driveItem permission

Permission typeLeast privileged permissionsHigher privileged permissions
Delegated (work or school account)Files.ReadWriteFiles.ReadWrite.All, Sites.ReadWrite.All
Delegated (personal Microsoft account)Files.ReadWriteFiles.ReadWrite.All
ApplicationFiles.ReadWrite.AllSites.ReadWrite.All

Then we can test in Postman to see if it is accessible.

Enter the following info in Postman. (You can use variables instead to keep sensitive data secure)

Access Token URLhttps://login.microsoftonline.com/d8f36038-1f93-4543-affc-5dc92b6ee871/oauth2/v2.0/token (Change it to your tenant ID)

Client ID: a80c03cf-6ffa-4b6e-b2c8-6005310d3d87

Client Secret: fME7Q~cAaSBhXMGZoHY3ei64nn1fxGpqF42mh

Scope: https://graph.microsoft.com/.default (Note that Scope is different from BC)

Cilent Authentication: Send client credentials in body

And my test SharePoint site:

https://2qcj3x.sharepoint.com/sites/BCShareFiles

Documents:

Business Central Folder:

Then we can get the GUID of the SharePoint Online site via adding the following _api/site/id at the end of the Site URL:

https://2qcj3x.sharepoint.com/sites/BCShareFiles/_api/site/id

SharePoint (site) id: 5b3b7cec-cbfe-4893-a638-c18a34c6a394

At this time we can get document libraries information.
Test Endpoint:

https://graph.microsoft.com/v1.0/sites/{site-id}/drives

For example,

https://graph.microsoft.com/v1.0/sites/5b3b7cec-cbfe-4893-a638-c18a34c6a394/drives

Documents (drive) id:

 b!7Hw7W_7Lk0imOMGKNMajlK0n-8Wdev9FmPdhx03j5o95rz4xvtmtTIUW5qUH7Jww

If we want to get the file information in the folder, we need to use the following endpoint.
Test Endpoint:

https://graph.microsoft.com/v1.0/drives/{driveId}/root:/{folderPath}:/children

For example,

https://graph.microsoft.com/v1.0/sites/5b3b7cec-cbfe-4893-a638-c18a34c6a394/drives/b!7Hw7W_7Lk0imOMGKNMajlK0n-8Wdev9FmPdhx03j5o95rz4xvtmtTIUW5qUH7Jww/root:/Business%20Central:/children

Here we can get the file (item) id.
File (item) id: 01AA2EHNP46T7UJIJ6DZBYKJUOMSKBYWRZ

Let’s read the contents of the file, 1988-S.jpg.

Test Endpoint:

https://graph.microsoft.com/v1.0/sites/{site-id}/drive/items/{item-id}/content

For example,

https://graph.microsoft.com/v1.0/sites/5b3b7cec-cbfe-4893-a638-c18a34c6a394/drive/items/01AA2EHNP46T7UJIJ6DZBYKJUOMSKBYWRZ/content

If you don’t need to display the content, but only need file information, use the following endpoint

Test Endpoint:

https://graph.microsoft.com/v1.0/sites/{site-id}/drive/items/{item-id}/

For example,

https://graph.microsoft.com/v1.0/sites/5b3b7cec-cbfe-4893-a638-c18a34c6a394/drive/items/01AA2EHNN7JYZKCPZS6NFKDFGKK2PGMJEE/

GET:

This endpoint can also be used for modification and deletion.

PATCH:

DELETE:

One more test this time, try uploading a file to SharePoint from Postman. Here is the endpoint I tested (Including content).

PUT

https://graph.microsoft.com/v1.0/sites/{site-id}/drives/{drive-id}/root:/{folder}/{filename}:/content

For example, I want to upload the SharePointUploadTest.csv file to Documents (root) -> Business Central folder.

Endpoint

https://graph.microsoft.com/v1.0/sites/5b3b7cec-cbfe-4893-a638-c18a34c6a394/drives/b!7Hw7W_7Lk0imOMGKNMajlK0n-8Wdev9FmPdhx03j5o95rz4xvtmtTIUW5qUH7Jww/root:/Business Central/SharePointUploadTest.csv:/content

Then the http action is not Get, but Put.
Headers -> Content-Type -> text/csv:

Body -> binary -> upload file:

Choose Send.
201 Created: A new resource was created successfully.

If the specified folder is not found, a new folder will be created automatically.

Test video:

More details: Working with SharePoint sites in Microsoft Graph and Upload or replace the contents of a driveItem

END

Hope this will help.

Thanks for reading.

ZHU

コメント

Copied title and URL