SisenseJS Overview

Sisense.js is a JavaScript library that enables you to embed Sisense components in web pages without the use of iFrames. By embedding the SisenseJS library, you can:

• Load Sisense runtime anywhere, without iFrames
• Load dashboards in runtime
• Render all/part/new widgets in any DOM container
• Embed Sisense visualizations into your mobile applications

Availability

SisenseJS is available for:

• Windows
• Linux

For versions L8.1.1/L8.2.1 a new version of SisenseJS is available with improvements.

The sisensejs-components library is a component-based wrapper for SisenseJS, built for use with React as well as vanilla JavaScript or TypeScript applications. It is now available as a BETA release on our GitHub (opens new window).

Prerequisites

Dependencies

SisenseJS has the following dependencies:

• Highcharts (opens new window)
• D3.js (opens new window)
• JQuery (opens new window)

Access, Authentication & Security

All embedding methods require authentication for users to interact with Sisense dashboards and charts. See Access, Authentication & Security to determine which authentication methods and any access or security configurations required for your use case.

SisenseJS and SSO

Sisense implements SSO by redirecting users to a script/application that creates a login token for the user, and redirects them back to the destination or resource they were trying to access. If the resource requested is a dashboard, that's where the user will be redirected back to. For SisenseJS the resource requested will be a JavaScript file, so you need to ensure the redirect takes you back to this file.

When Sisense redirects your customers to your login script, Sisense passes a return_to parameter in the URL. This parameter defines the page that Sisense will redirect your customer after authenticating them. For example:

1. A customer visits your site opens a page containing Sisense.JS code
2. The page requests the Sisense.js library file from the Sisense server
3. Sisense recognizes that the user is not authenticated (the HTTP request has no cookie)
4. Sisense redirects the user to https://www.example.com/sisense/sso?return_to=/js/sisense.js

All your SSO handler needs to do, is take the return_to value from the invoked URL and pass it back to Sisense when submitting the JWT token. In other words, upon authentication on your side, your script redirects the user to https://sisense.example.com/jwt?jwt=<payload>&return_to=/js/sisense.js

To avoid redirection errors when logging in, you will need to open the Sisense Advanced Configuration panel and make the following configuration changes:

Windows v8.2.5 or higher

1. Connect to your Sisense server via RDP.
2. Open a browser and navigate to http://localhost:3030.
3. Click on the Sisense logo 5 times to switch to advanced mode.
4. In the left-hand side navigation menu, click on Base Configuration.
5. Scroll down to the Security section and click on it to expand.
6. Toggle on security.redirectToAnyUrl.
7. Click Save Base.

Linux L8.2.4 or higher

1. Log in to Sisense as an admin.
2. Open the Sisense Admin page.
3. Open the System Management screen.
4. Click on the Configuration button at the top-right corner.
5. Click on the Sisense logo 5 times to switch to advanced mode.
6. In the left-hand side navigation menu, click on Base Configuration.
7. Scroll down to the Security section and click on it to expand.
8. Toggle on Allow SAML to redirect to any URL.
9. Click Save Base.

Limitations

Support for Add-ons

When embedding Sisense using Sisense.JS, only widgets are being embedded. Thus, only add-ons (plugins) (opens new window) that apply at the widget level are supported.

For example: The Funnel Widget add-on is compatible with SisenseJS because it is a widget type and can be embedded like any other widget; The Jump To Dashboard add-on is not compatible with SisenseJS because it is built to navigate to other dashboards, which do not exist in the SisenseJS scope.

Note:

Add-ons that affect the system UI or other scopes may have no effect, or have an undesirable effect on certain widgets if the add-on attempts to invoke APIs or components that are not available.

Support for AngularJS and React

Frameworks such as AngularJS/Angular2 and React have a heavy emphasis on async/lazy-loading of their DOM, which means certain DOM elements that Sisense.js requires to function might not exist at the time they are needed by Sisense.js.

Note:

Make sure that all required container elements exist in the DOM before calling the Sisense.connect method

Note:

Sisense.js bootstraps a div element with the ID "sisenseApp" which in turn enables the creation of various overlay DOM elements, such as tooltips.

Note:

Make sure the sisenseApp element and other container elements are loaded before using the Sisense.connect method, by explicitly creating it as an empty container within your page.

There can be only one sisenseApp element on a given page.

<!-- Your Sisense container elements and other DOM here -->
<div id="sisenseApp"></div>