ActiveUI

ActiveUI

  • User Guide
  • Developer Documentation

›Guides

About

  • Introduction
  • Changelog

Getting Started

  • Step by Step
  • Development Environment
  • Artifacts
  • ActiveUI Application
  • Usage as an npm Dependency
  • Initialization
  • Project Architecture

Guides

  • Adding KaTex fonts
  • Adding Servers
  • Authentication
  • Bookmark favorites
  • Charts
  • Configuring Widget Handlers and Actions
  • Container
  • Custom UI components with Ant Design
  • Data manipulation
  • Debugging
  • Deployment
  • Internationalization
  • MDX Manipulation
  • Plugins
  • Reporting
  • Settings
  • Tabular View and Pivot Tables
  • Testing

Reference

  • API Reference
  • Default Widget Bookmarks
  • Plugins
  • Settings

Advanced

  • Content Server Setup
  • Experimental Features
  • Maven Integration
  • Offline Installation
  • Script-based Integration

Adding Servers

There are three ways to connect ActiveUI to ActivePivot, ActiveMonitor, and Content servers.

ActiveUI can work with several servers as long as they are behind the same security layer. Only one authentication token will be stored, and it needs to be accepted by all the servers. This also means that the roles of the user have to be supported by all the servers ActiveUI will communicate with.

Through the UI

Before any servers have been added and when a bookmark tree, a data explorer widget or any container requiring an ActivePivot Server is displayed, a button will be displayed, enabling the addition of a new server. The bookmark tree and the data explorer widget also always display an icon for adding a new server, located next to the search bar.

Clicking on the "add server" button will open a popup that will let you add ActivePivot, ActiveMonitor, and Content servers. The popup also contains a "Persist server(s)" checkbox. If you check it, the servers defined in the form will be store in the "servers" setting.

Programmatically

Building the Server URL

The only thing needed to add a server in ActiveUI is its URL. There are several ways to build one:

Hardcoded URL

If the URL is the same on all your environments, the simplest way is to use a string:

// https://{host}:{port}/{path}
const url = 'https://my-host.com:9090/sandbox';

Using a Proxy

This is basically the same technique as the one above but this time you give the URL of a proxy.

When the URL of the server changes, you just have to reconfigure your proxy to point to the new URL. There is nothing to do on the ActiveUI side.

Deriving the URL from the Current Window Location

If the server hosting ActiveUI is on the same machine as the server you want to connect to (but on a different port or path) you can use something similar to the following:

const url = `${window.location.protocol}//${window.location.hostname}:9090/sandbox`;

Environment-Specific URL

You may want to use a different URL depending on the environment on which ActiveUI is deployed. For instance, you might want to connect to http://localhost:9090 in development and https://prod.com:9090 in production.

Build-time Configuration:

Your build process could define the process.env.NODE_ENV for development or production which would allow you to do this:

const url =
  process.env.NODE_ENV === 'production'
    ? 'https://prod.com:9090'
    : 'http://localhost:9090';
Runtime Configuration

You could load a small env.js file before loading your main application bundle. In development, env.js would be window.env = {url: 'http://localhost:9090'}, while in production it would be window.env = {url: 'https://prod.com:9090'}.

The env.js would need to be bundled separately from the rest of your application so that you could change its content easily on the machine where ActiveUI is deployed.

Anywhere in your application, you could then do:

const url = window.env.url;

This technique works well when you want to deploy the same build to several environments but still want to have a different configuration on each environment.

Both these methods can be used easily with the ActiveUI Application.

Methods to Add Servers

Once you have a variable holding your server URL, you can retrieve the serversPool from the ActiveUI SDK API:

const servers = activeUI.queries.serversPool;

From here, we have specific methods for adding each type of server, available on the ServersPool:

Server TypeMethod
ActivePivot ServeraddActivePivotServer
ActiveMonitor ServeraddActiveMonitorServer
Content ServeraddContentServer

Example for adding an ActivePivot server with its related ActiveMonitor and Content servers:

const activePivotServer = servers.addActivePivotServer({
  url: activePivotServerUrl,
  contentServer: servers.addContentServer({url: contentServerUrl}),
  activeMonitorServer: servers.addActiveMonitorServer({
    url: activeMonitorServerUrl,
  }),
});

When adding an ActivePivot Server, providing a Content Server and an ActiveMonitor Server is optional:

  • If no Content Server is provided, ActiveUI will assume that the Content Server url is the same as the ActivePivot Server url.
  • If no ActiveMonitor Server is provided, no ActiveMonitor related feature will be available.
const activePivotServer = servers.addActivePivotServer({
  url: activePivotServerUrl,
});

Adding a 5.4.x Server

If you are using one of the methods mentioned above to add a server in version 5.4.x, then you should specify it using the isVersion54 option. For instance:

const activePivotServer = servers.addActivePivotServer({
  url: activePivotServerUrl,
  isVersion54: true,
});

Adding multiple Servers

Best practice is to always use unique cube names, even across servers. If you create a bookmark in an environment where cube names are not unique, then the serverUrl will be saved inside the bookmark as well.

It is possible to add multiple servers of the same type. For example:

const activePivotServerX = servers.addActivePivotServer({url: X});
const activePivotServerY = servers.addActivePivotServer({url: Y});
const activePivotServerZ = servers.addActivePivotServer({url: Z});

When this is done, each ActivePivot server will have its own separate Content Server for bookmarks. However, settings will be driven by the first added Content Server (in the example below the Content Server from url X).

To share the same Content Server across multiple ActivePivot servers, follow this example:

const contentServer = servers.addContentServer({url: contentServerUrl});

const activePivotServerX = servers.addActivePivotServer({
  url: X,
  contentServer,
});
const activePivotServerY = servers.addActivePivotServer({
  url: Y,
  contentServer,
});
const activePivotServerZ = servers.addActivePivotServer({
  url: Z,
  contentServer,
});

To control which Content Server manages settings, follow this example:

const contentServerForX = servers.addContentServer({
  url: contentServerUrlX,
  withSettingsManager: false,
});
const contentServerForY = servers.addContentServer({
  url: contentServerUrlY,
  withSettingsManager: true,
});

const activePivotServerX = servers.addActivePivotServer({
  url: X,
  contentServerForX,
});
const activePivotServerY = servers.addActivePivotServer({
  url: Y,
  contentServerForY,
});

Using the "servers" Setting

The servers setting can store the different servers you want to connect to. To use it, you can, for instance, write the following JSON into the default preferences file:

{
  "map": {
    "servers": [
      {
        "pivot": {
          "url": "http://localhost:9090",
          "name": "Sandbox"
        },
        "sentinel": {},
        "contentServer": {}
      }
    ]
  }
}

Once you have your servers setting stored in a Content Server, you just need to connect to this Content Server and all the servers defined in the setting will be added automatically.

The typical use case of this setting is to only add one Content Server programmatically and let the setting add all the other servers.

← Adding KaTex fontsAuthentication →
  • Through the UI
  • Programmatically
    • Building the Server URL
    • Methods to Add Servers
    • Adding a 5.4.x Server
    • Adding multiple Servers
  • Using the "servers" Setting
Copyright © 2023 ActiveViam