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 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

  • SDK API
  • Default Widget Configurations
  • 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

When no servers have already been added and that a bookmark tree, a data explorer widget or any container requiring an ActivePivot Server is displayed, there will be a button to add a first server. The bookmark tree and the data explorer widget also always display an icon next to the search bar to add a new server.

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 will be 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 than 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 like that:

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 to 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 not be bundled with 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 environment but still want to have a different configuration on each environment.

Both of 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, ActiveMonitor related feature will not be available.
const activePivotServer = servers.addActivePivotServer({
  url: activePivotServerUrl,
});

Adding multiple Servers

ActiveUI assumes cube names are UNIQUE per application. This means that, even if located under different catalogs or server url, cubes should have different names. If this rule is not respected, some part of the UI might not work as expected.

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});

In that case, 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.

← Project ArchitectureAuthentication →
  • Through the UI
  • Programmatically
    • Building the Server URL
    • Methods to Add Servers
    • Adding multiple Servers
  • Using the "servers" Setting
Copyright © 2021 ActiveViam