Open pdf in Browser not SharePoint pdf Viewer

John Twohig 

This is still an issue in 2024, sadly. For what it's worth, here is a potential javascript-based workaround I've been looking into. I'm offering it as help to anyone else who stumbles upon this thread looking for a potential solution.

Background

The sharing URL (which contains a unique token and does not show the file name or path) does not seem to be configurable to open natively in the browser's own PDF viewer. The sharing URL looks something like this: "https://<TENANT>.sharepoint.com/:b:/s/<SITE_NAME>/<UNIQUE_TOKEN>"

The sharing URL redirects to a viewing URL, which has a different format. The viewing URL always opens the doc in the SharePoint viewer. The URL looks something like this: "https://<TENANT>.sharepoint.com/sites/<SITE_NAME>/Documents/Forms/AllItems.aspx?...<QUERY_PARAMS_INCLUDING_FILE_PATH>". To my knowledge, this doesn't seem to be configurable either; plus, you don't have control over it, because it's returned in the Location header for the 302 response you get from accessing the sharing URL.

A path-based URL (that accesses the file via the SharePoint library path) does open in the browser's own PDF viewer. The URL looks like this: "https://<TENANT>.sharepoint.com/sites/<SITE_NAME>/<PATH_TO_DOCUMENT_IN_THE_LIBRARY>/<FILE_NAME>.pdf" However, the path URL is only accessible if a) you are authenticated (logged into SharePoint), OR b) if you have previously visited the sharing URL. This is because the sharing URL sets a browser cookie that gets used for authentication later when the user tries to access the path URL.

Workaround / Hacky Javascript solution

This concept worked when tested in a new `about:blank` tab in Chrome:

function visit(url, shouldClose = false) {
  let w = window.open(url, "_blank");
  if (shouldClose) {
    setTimeout(() => {
      w.close();
    }, 100);
  }
}

// To get to the final "path URL" that opens natively in the browser,
// you have to do something like this:
visit(sharingURL, true);
setTimeout(() => {
  visit(pathURL);
}, 500);

For testing purposes, I manually put together the path URL, but if you're generating the sharing link on the backend (via Microsoft Graph API), you can likewise build the path URL from the path property of the list item fetched from the graph API.