Pentaho

 View Only

 Embed pentaho CDE Dashboard in external Web application

  • Pentaho
  • Ctools
  • Pentaho
Raj Karan's profile image
Raj Karan posted 01-10-2018 16:35

I am following this tutorial CDE Advanced Solutions - Pentaho Documentation and have create a simple HTML page (main.html) with code given below.

<!DOCTYPE html> <html> <head> <title></title> <script type="text/javascript" src="http://172.29.11.246:8080/pentaho/plugin/pentaho-cdf-dd/api/renderer/cde-embed.js"></script> </head> <body> <script type="text/javascript"> require(['dash!/public/demo/Hbase.wcdf'], function(SampleDash) { var sampleDash = new SampleDash("content1"); sampleDash.render(); } ); </script> <div id="content1"></div> </body> </html>

I am running this page with python server as instructed in tutorial.

Launching main.html file in browser throws below error.

Failed to load http://172.29.11.246:8080/pentaho/plugin/pentaho-cdf/api/resources/js/compressed/lib/underscore/underscore.js: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:2777' is therefore not allowed access.

I have set allow-cross-domain-resources to true in both pentaho-cdf/settings.xml and pentaho-cdf-dd/settings.xml files.

How can I resolve this problem?


#Ctools
#Pentaho
Data Conversion's profile image
Data Conversion posted 01-10-2018 20:26

For more recent versions try the following:

In CDF, CDE and CDA edit each settings.xml and set:

  <allow-cross-domain-resources>true</allow-cross-domain-resources>

  <cross-domain-resources-whitelist>http://localhost:2777</cross-domain-resources-whitelist>

 

In system/pentaho.xml set:

  <cors-requests-allowed>true</cors-requests-allowed>

  <cors-requests-allowed-domains>http://localhost:2777</cors-requests-allowed-domains>

 

Start/Restart the server and clear the browser cache before opening http://localhost:2777.

Raj Karan's profile image
Raj Karan posted 01-10-2018 20:54

Couldn`t find below lines

<cors-requests-allowed>true</cors-requests-allowed>

<cors-requests-allowed-domains>http://localhost:2777</cors-requests-allowed-domains>

in pentaho.xml file so I added them right after <pentaho-system> opening tag.

 

This works fine.

 

now I am seeing different errors

GET http://172.29.11.246:8080/pentaho/plugin/pentaho-cdf/api/resources/js/compressed/components/filter/templates/Group-skeleton.html.js net::ERR_ABORTED GET http://172.29.11.246:8080/pentaho/plugin/pentaho-cdf/api/resources/js/compressed/components/filter/templates/Group-template.html.js net::ERR_ABORTED

 

 

What could be causing this.

Data Conversion's profile image
Data Conversion posted 01-11-2018 00:01

This is a problem that the filter component currently has, there is an issue open to fix it.

[CDF-972] Filter component doesn't support embedding with CORS - Pentaho Platform Tracking

Raj Karan's profile image
Raj Karan posted 01-11-2018 14:03

The issue is an unassigned. I think it will be safer to assume that it won't be fixed anytime soon.

Is there any other way to embed dashboards in web apps? I only have couple of weeks to decide between embed internal to Pentaho or external to Pentaho.

I have voted for it and watching it too.

Raj Karan's profile image
Raj Karan posted 01-18-2018 15:16

With Pentaho-dashboard project I am able to render dashboards in a NodeJS + AngularJs app. I am still experiencing issue with some dashboards but that is due to another issue discussed here and this seems to be fixed in version8.0. Where as I am on version 7.1, planning to upgrade to 8.0 and hoping i18n issue will get fixed.

Mario Guerrero's profile image
Mario Guerrero posted 11-19-2020 19:10

Thanks

@Raj Karan​ , I have this problem in the last version 9.1 CE, and with ur solution it works.

 

Bless. 😉

Related Content