Unlock a world of possibilities! Login now and discover the exclusive benefits awaiting you.
This article is a step-by-step on how to create a nebula.js mashup for Qlik Sense Client managed and is based on the tutorial to create a nebula.js mashup for Qlik Sense SaaS, which can be found here.
Please also make sure all requirements have been fulfilled based on article: https://community.qlik.com/t5/Knowledge/Qlik-Sense-for-Windows-All-you-need-to-know-to-start-using/t...
Requirements:
- Qlik Sense Enterprise on Windows April 2020 or higher
- Node.js 10.0.0 or higher
Create a simple web project
npx @nebula.js/cli create mashup hello-cm
Edit the index.js file in the src folder and input your Qlik Sense server url and the app ID you want to connect to, the result should look as below:
const app = await connect({
url: 'qlikserver1.example.local',
appId: '7fc4d85c-0e07-4160-90a9-c2ca4a45fd81',
});
Edit the connect.js in the src folder and replace the whole content by the following:
import enigma from 'enigma.js';
export default function connectLocal({ url , appId }) {
const loadSchema = () =>
fetch('https://unpkg.com/enigma.js/schemas/12.612.0.json').then((response) => response.json());
const createConnection = () =>
loadSchema().then((schema) =>
enigma
.create({
schema,
url: `wss://${url}/app/${appId}`,
})
.open()
.then((qix) => qix.openDoc(`${appId}`))
);
return createConnection().then(
(app) => app
);
}
Back to index.js, add the following lines to render the object you want:
n.render({
element: document.querySelector('.object'),
id: 'EAjjuyE',
});
See tutorial here in the "Visualize data" section on how to fetch the ID for the wanted object.
Configure package.json to use https
In order to follow best practices on embedded contents, we are now going to modify package.json in order to enable https. Please note that you need to bring your own certificates in pem format.
On line 12 in package.json, add the following argument to the "parcel" command line:
"scripts": {
"start": "parcel src/index.html --open --no-hmr --port 444 --https --cert server.pem --key server_key.pem --host dc1.example.local",
"build": "parcel build src/index.html --dist-dir ./dist"
},
Run the project
Go to the project folder root and run this command:
npm run start
The server runs on https://dc1.example.local:444/
Note that this sample doesn't handle authentication and you might need to first log in to Qlik Sense in your browser before opening the page to see the charts.