7 Replies Latest reply: Aug 1, 2018 9:13 AM by Jonathan Vitale RSS

    Qlik Sense Mashups & Angular 4

    Lindy Brits

      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.

        • Re: Qlik Sense Mashups & Angular 4
          Jonathan Vitale

          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

          • Re: Qlik Sense Mashups & Angular 4
            Bala Bhaskar

            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.