Qlik Sense Mashups & Angular 4

[lindybrits]

Hi all

I was wondering if Qlik Sense mashups are possible with Angular 4?

If it is, how would one integrate it?

Kind Regards,

Lindy Brits.

[jonvitale]

From other posts it seems like higher versions of Angular (Qlik is using AngularJS 1.5.8) will have conflicts. There must be ways around it, but I suspect unforseen consequences.

This project on Qlik Branch looks interesting. May be a way to get some Qlik functionality into a non AngularJS (1.X) project. Haven't used, it but interested in how it performs.

Qlik Branch

[Yianni_Ververis]

Qdt-components will take care that for you

https://webapps.qlik.com/qdt-components/angular/index.html

[jonvitale]

jvs‌

Have you actually worked with this in Angular2+? I want to give it a try but I'm afraid I'll get deep into a project to find out that there is some incompatibility between Qlik AngularJS and Angular 6 that makes thing break. I'm more comfortable with Angular 2+, but I don't want to invest weeks of development only to find that I can work with Qlik in the same ways available using AngularJS.

Thanks.

[Yianni_Ververis]

Yes.

Use the same template code for your components

https://github.com/qlik-demo-team/qdt-angular-template/blob/master/src/app/components/qdt-component/...

[Yianni_Ververis]

You do not have to migrate to Angular 6

[balabhaskarqlik]

I can say it is possible with some limitation.

First I have a question: which authentication method do you use in Qlik sense (SAML, JWT, Ticket, etc..) set up in the proxy or vitual proxy in QMC?

Then here you are some info:

- From Angular2,4,5 side (so Client side) it is not possible to create a Qlik sesson in secure way. Technically it is possible, but you always have to provide credentials (Private key, CERT etc..) to client side which is not secure so no way.

- You cannot use iFrame integration because it is not cross browser compatible anymore (IE9,10,11 does not support well)

- You can integrate a Qlik Sense Mashup into a DIV HTML tags with some hack (workaround)

- First you have to authenticate the user and Sign-in to Qlik (I cannot give you more information about the trick, sorry

- If your user is well authenticated in Qlik you can see following Cookie in the Browser:

name: the name of the Cookie set up in the proxy or virtual proxy authentication settings in QMC e.g. X-Qlik-Session

value: the session ID e.g.: 91b42818-382a-4e18-9fe8-746152b15bd4

domain: the domain name of your Qlik instance

it will be a HTTP only proxy so it is not possible to parse it from Angular, let say Client side..

- In the index.html of the Angular 2+ app no need to include any Qlik related Javascript or CSS

- You have to create a component which DYNAMICALY loads the require.js from the Qlik server then DYNAMICALY loads the necessary CSS also from the QLIK server

- Then you have to load finally the mashup related Javascript which will Require the qlik object then instantiate the app

(see dev-hub Mashup editor CSS, JS, HTML files for more details)

- Limitation: require.js overrides (or overloads?) some original JS framework e.g. JQuery, bootstrap.js, I don't know what else.. So MAYBE your app will lost some object because require puts it out of global scope.

[jonvitale]

Sorry to beat a dead horse here (and leave a redundant message that I posted over on Github), but...

Do you know if this will work for development of a mashup that will be run by a Qlik Sense QAP server or local desktop environment? It seems that this code is set up to work on an independent server to pull in Qlik Sense visualizations.(e.g., there is no qext file).

I'd really like to give this a try but I need a bit of hand-holding for the setup part. Once I have it ready I'd love to really work with it and help test out your developments.