Detect OpenFin support from a web browser

Many apps are written specifically to run in the OpenFin Runtime. When a user loads your site in their web browser you have always had the option of presenting them with a fins link to launch your application. What you haven't had is the ability to detect whether you should present them with a fins link or an installer if they do not have OpenFin on their machine.

This detection ability is now available through a script you can add to your website.

Detecting OpenFin is a two step process:

  1. Detect the fins protocol. This is possible only if allowed in Desktop Owner Settings.
  2. Detect whether the user can access the OpenFin resources.

Detect the fins protocol

The checkForFinsProtocol() function returns an object that reveals whether the fins protocol is supported on the desktop. If the isFinsDetectionSupported and isFinsSupported properties are both true, then the fins protocol is available.

The way that you call the function varies slightly, depending on whether you are invoking in a <script> element in HTML, or from an installed NPM package.

import { checkForFinsProtocol } from '@openfin/deployment';
//...
const finsProtocolResult = await checkForFinsProtocol();
if (finsProtocolResult.isFinsDetectionSupported && finsProtocol.isFinsSupported){
    // fins protocol is supported
}
//...
<script src="https://cdn.openfin.co/tools/deployment/1.0.0/openfin-deployment.js"></script>
<script>
const finsProtocolResult = await openfinDeployment.checkForFinsProtocol();
if (finsProtocolResult.isFinsDetectionSupported && finsProtocol.isFinsSupported){
    // fins protocol is supported
}
//Anything else you want to do
</script>

Access OpenFin resources

The checkEndpoints() function can be called to check whether the desktop can access OpenFin resources, such as the OpenFin CDN, or any custom endpoints. The function returns an array of Endpoint objects. If the status property of the Endpoint object is true, the resource is available.

import { checkEndpoints, Endpoint, EndpointStatus, OpenFinEndpoint } from '@openfin/deployment';

const endpointResults = await checkEndpoints();
customResult.forEach((status) => {
    console.log(status.url, status.success);
});

// Check all OpenFin endpoints, excluding OpenFinEndpoint.Diagnostics.
const endpointCheckResult = await checkEndpoints([OpenFinEndpoint.Diagnostics]);

// Check additional custom endpoints.
const customEndpoints:Endpoint[] = [
    {
        id: 'OpenFin Website',
        url: 'https://openfin.co',
        displayName: 'OpenFin Website'
    }
];

const customResult = await checkEndpoints([], customEndpoints);

Enable in Desktop Owner Settings

To enable the checkForFinsProtocol function, the following setting needs to be added to the Desktop Owner Settings file.

  "desktopSettings": {
     ... //other settings
     "enableInstallationDetection":true,
     ... //other settings
  }

Samples

Two code samples are available in the @built-on-openfin/deployment repository that demonstrate how to detect the fins protocol and detect access to OpenFin resources.


Did this page help you?