13 Replies Latest reply: Jul 7, 2017 1:48 PM by Dayana Junger RSS

    Create Mashup outside Qlik Server Repository folder

    Sumit Kumar

      Hi,

      I want to creating mashups outside the extensions folder. Is there any way to create a mashup for Qlik Sense outside its Extensions folder?

        • Re: Create Mashup outside Qlik Server Repository folder
          David Farache

          Yes there is,

           

          Qlik Sense behaves like a normal web server listening on port 4848. You can see your mashups when you query http://localhost:4848/extensions/yourMashup/ because that is the 'public' folder of your Sense server.

           

          Conversely, you could write your own web server on localhost listening to another port and serve the web applications from there. From there, you can open as well the Qlik applications you need to work with.

            • Re: Create Mashup outside Qlik Server Repository folder
              Sumit Kumar

              Hi David,

              Thanks for your response.

               

              But actually i need to create a mashup in my own directory let's say it on D:/MyMashup, As i assumes that while creating a mashup on Qlik Sense Server uses its own files (require.js, qlik.js, etc) and by using these javascripts it process our queries for render qlik objects to a mashup.

               

              What if i provides these files from my own directory and queries for qlik objects and it return me response as it gives while creating on it's server.

               

              Because when i tried to do same it responding me some error for Handshaking.

               

              My concern is if i am creating mashup in my own directory then how these file will communicate with qlik server to render my object

                • Re: Create Mashup outside Qlik Server Repository folder
                  David Farache

                  Hi Sumit,

                   

                  So if I got it right, you want to run a mashup given the following conditions:

                   

                  1. You have your Qlik Sense Desktop up and running
                  2. You have an application in it, to which you want to connect using the Mashups API
                  3. The files for the mashup are not in the Extensions folder

                   

                  What I've done is to create a separate folder in My Documents and I've written the simplest mashup there can be. It contains only 2 files, index.html and main.js:

                   

                  This is index.html

                  <html lang="en">
                  <head>
                    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
                    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
                    <title>Sample Mashup</title>
                    <meta charset="utf-8">
                    <meta name="HandheldFriendly" content="True">
                    <meta name="MobileOptimized" content="320">
                    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
                    <meta name="apple-mobile-web-app-capable" content="yes">
                    <meta name="apple-mobile-web-app-status-bar-style" content="black">
                    <meta http-equiv="cleartype" content="on">
                  
                  
                    <link rel="stylesheet" href="http://localhost:4848/resources/autogenerated/qlik-styles.css">
                    <script src="http://localhost:4848/resources/assets/external/requirejs/require.js"></script>
                    <script src="./main.js"></script>
                  </head>
                  <body>
                    <div class="flex-container">
                  
                  
                    </div>
                  </body>
                  </html>
                  
                  
                  

                   

                  And as for main.js

                  var config = {
                    "host": "localhost",
                    "prefix": "/",
                    "port": "4848",
                    "isSecure": false
                  };
                  
                  
                  require.config( {
                    baseUrl: ( config.isSecure ? "https://" : "http://" ) + config.host + (config.port ? ":" + config.port : "") + config.prefix + "resources"
                  });
                  
                  
                  require( ["js/qlik", "jquery"], function ( qlik, $ ) {
                    qlik.setOnError( function ( error ){
                    alert( error.message );
                    });
                  
                  
                    var app = qlik.openApp('NameOfYourApp.qvf', config);
                  })
                  
                  
                  

                   

                  This is pretty much all you need to get started building something more complex.

              • Re: Create Mashup outside Qlik Server Repository folder
                Sumit Kumar

                Hi,

                As per above solution i can create my mashup externally, but can i apply qlik's export as excel to it as :

                app.getObject("divid","objectid").then(function(model) {

                  var table = new qlik.table(model);

                  $("#exp").bind('click', function() {

                   table.exportData({

                  download: true

                   });

                  })

                   });

                • Re: Create Mashup outside Qlik Server Repository folder
                  Sumit Kumar

                  Hi David,

                   

                  Above is working fine, but does it works on mobile also?

                  Actually i am creating this mashup on client side by passing Qlik's JS & CSS files to client's machine. As per this i am able to create mashup on Client's system but when i am trying same on Mobile Browser then it is not rendering same on mobile.

                  • Re: Create Mashup outside Qlik Server Repository folder
                    Dayana Junger

                    hi, Sumit!

                     

                    I´m having the same problem as you... I have a mashup in angular running outside the main server and when I call the table, it is not getting the file from config.host, but it is looking in my localhost and I get this error:

                     

                    error.PNG

                     

                    How did you solved this?

                     

                    I´m using this code in the controller:

                     

                    $('#div').click(function(e){

                        app.getObject('XXX').then(function(model) {

                        var table = qlik.table(model);

                        table.exportData({download: true});

                       });  

                      });  

                      • Re: Create Mashup outside Qlik Server Repository folder
                        David Farache

                        Hello Dayana,

                         

                        Can you share the piece of code where you open the application using qlik.openApp(appName, configuration) ?

                         

                        What are the configuration parameters that you're passing to this function?

                          • Re: Create Mashup outside Qlik Server Repository folder
                            Dayana Junger

                            Hi, David!

                             

                            I´m using Angular JS in my localhost (different server of the QlikSense Aplication) and in my View  I have this code that call the Excel in the controller:

                             

                            <div  id="generateExcel" > Excel </div>

                             

                            In the controller I manage this code in this way:

                             

                            var prefix = window.location.pathname.substr( 0, window.location.pathname.toLowerCase().lastIndexOf( "/extensions" ) + 1 );

                             

                            var config = {

                               host: '11.2.33.444',   //the real host of Qlik Aplicattion and my server (localhost) is getting the objects from.

                               prefix: '/', 

                               port: 80, 

                               isSecure: false 

                            };

                            var app;

                             

                            require.config( {

                              baseUrl: (config.isSecure ? "https://" : "http://" ) + config.host + (config.port ? ":" + config.port : "" ) + config.prefix + "resources"

                            } );

                             

                            require( ["js/qlik"], function ( qlik ) {

                            //qlik app

                            var app;

                            //data for case listing

                            var data = {

                            headers: [],

                            rows: []

                            };

                             

                            function getQlikApp () {

                            return qlik.openApp( "9595663-1642-4339-93315-2340", config )  //Qlik Sense Aplication ID

                            }

                             

                            var appbi = angular.module( "appbi", ['ngRoute','ui.bootstrap', 'qlik-angular'] );

                             

                            appbi.controller( "nameCtrl", ['$scope', function ( $scope ) {

                            if ( !app ) {

                            app = getQlikApp();

                            }

                              app.getObject('tableID','xxYYzz'); // get the object of the table in the Qlik Sense Application

                             

                            /*EXCEL*/

                              angular.element('#generateExcel').click(function(e){ 

                                app.getObject('xxYYzz').then(function(model) {

                                var table = qlik.table(model);

                                    table.exportData({download: true});  

                               });  

                              });

                             

                            }]);

                             

                             

                             

                            The problem is when I click in the Excel button :/

                             

                            Instead the button function call the Excel from the host of application ("11.2.33.444") it is calling from my localhost.  If I change the server of the link, it works. For example:


                            Link that is generated from the function and don´t work:

                            link-local.jpg

                            Link that really works when I manually change the number of server:

                             

                            link-server.jpg

                             

                             

                             

                            Any help will be appreciated. Tnks

                             


                             

                              • Re: Create Mashup outside Qlik Server Repository folder
                                Erik Wetterberg

                                Hi,

                                Looks like a bug in the download part. You will have to do the download yourself. Something like:

                                 

                                table.exportData().then(function(reply){

                                //reply contains the url

                                //add the correct host

                                //and call window.open

                                });

                                 

                                Hope this helps

                                 

                                Erik Wetterberg

                                  • Re: Create Mashup outside Qlik Server Repository folder
                                    Dayana Junger

                                    Hi, Erik!

                                     

                                    Thanks! It worked!

                                     

                                    The final function of download part:

                                     

                                      angular.element('#generateExcel').click(function(e){  

                                      app.getObject('xxYYzz').then(function(model) {

                                      var table = qlik.table(model);

                                     

                                      table.exportData({ download: false }, function (link) {

                                     

                                      var url = (config.isSecure ? "https://" : "http://") + config.host + link.replace('../..','') 

                                      window.open(url, "_blank");

                                     

                                      });

                                     

                                       });  

                                      }); 

                                     

                                    I have to use link.replace('../..','')  part because the path of the url was being generated wrong, but fortunatelly now it is getting the host of the Qlik Application and downloading correctly!


                                    I put {download: false} because it was generating twice (one from localhost and other from the host)


                                    Thanks!