The API itself is coming via the Microsoft Graph and works on driveItems and is well documented at https://docs.microsoft.com/en-us/graph/api/driveitem-list-thumbnails.
If you want to test this out yourself, download the SPFx sample from https://github.com/SharePoint/sp-dev-fx-webparts/blob/main/samples/js-msgraph-thumbnail/README.md to get started.
Digging into the API’s, the approach I have chosen to go from a SharePoint item to a Graph item is to use the site id, list id and item id – all id’s easily available per SharePoint item, either via REST API’s or the search API, using the calling signature below:
<endpoint>/sites/<site id>/lists/<list id>/items/<item id>
/driveItem/thumbnails/0/<custom size>/content
The above URL can be used directly in an <img> tag, removing the need for multiple calls in order to get the actual image.
Token | Description |
endpoint | graph.microsoft.com/v1.0
(https://docs.microsoft.com/en-us/graph/api/overview?view=graph-rest-1.0) tenant.sharepoint.com/_api/v2.0 (https://docs.microsoft.com/en-us/sharepoint/dev/apis/sharepoint-rest-graph) |
site id | Site object id – GUID. |
list id | List object id – GUID. |
item id | ListItem object id or unique id – Integer/GUID. |
custom size | See Requesting custom thumbnail sizes in the official Microsoft Graph documentation. |
If you choose to get the drive item in a different way, that’s all good, as the thumbnail API itself would be the same. In addition to using custom sizes for the preview, there are also some default sizes you can use, all documented.
The above approach have been verified for most common file types (except Excel) as well as for modern pages.