Hi team, I received information that it is possib...
# gooddata-cloud
j
Hi team, I received information that it is possible to embed Dashboards editor (create/delete) via an IFRAME using a similar script as this: <iframe src="https://<your_domain>/dashboards/embedded/#/workspace/<workspaceId>/new-dashboard??showNavigation=false" height="700px" width="100%" frameborder="0"></iframe> we currently embed the Analytics editor, that works fine, BUT when I tried to embed the Dashboards editor it did not work. Could you confirm if embedding dashboards editor is indeed supported, and if Dashboards editor IFRAME supports the same
apiTokenAuthentication
as the Analytics editor (currently we authenticate the IFRAME using JWT token) ?
y
Hi Jhonatan, thanks for reaching out. Embedding dashboards editors should be possible via this link: https://{your-domain}dashboards/embedded/#/workspace/{workspace-id}/new-dashboard??showNavigation=false Kindly confirm if thats the one you are using. You can also have a look at our documentation which also explains some steps which can be taken when embedding using iframe. https://www.gooddata.com/docs/cloud/embed-visualizations/iframes/ If this doesn't help, kindly share more information on this to help us further understand what you are currently trying to achieve. Feel free to share some screenshots via dm, for example; the error you are getting, the links being used and what you would like to see.
j
Hi Yvonne, if you check in the snippet I sent I am using the same URL as the one you sent, but this iframe gets stuck in the
Listening for postMessage with API token...
and it doesn't seem to be working as expected when using JWT authentication. Also, I don't really see this iframe being mentioned in the docs, are you able to point to the documentation that really has this iframe being described?
referring specifically to the Dashboards editor IFRAME
y
Hi Jhonatan, thanks for the clarification. Here's a link to our documentation which explains embedding with JWT authentication. Hope this helps. https://www.gooddata.com/blog/simplify-dashboard-embedding-with-jwt-authentication/
j
we have already integrated other IFRAMEs using JWT, such as the analytics editor, what I mentioned is if you know where in the documentation it refers to the IFRAME for dashboard editors? I couldn't really find that one
y
Hi Jhonatan I am not sure I understand what you mean by dashboard editors. Dashboards have edit buttons as shown in the image attached below. The edit button enables you to edit and customise dashboards. When embedding using iFrame, the sizing also affects the display of the dashboard edit button. The edit button can disappear if the sizing is too small. For example, you can try resizing the width to 70% or more to see if it appears. Once you click on the edit button, you will be directed to the editor as shown below. If this does not help, please share some screenshots of the code, and what the dashboard editor should look like to give us a clearer understanding of what you would like to see.
j
what we are looking for is to be able to create new dashboards from the IFRAME I haven't found this specific thing in the docs, but it would be as having this page as an IFRAME along JWT authentication
j
Hi Jhonatan, Do I understand correctly that you don't see the "+" button in your embedded iframe?
j
Hi Julius, the problem appears to be the JWT authentication, we have an IFRAME working fine with JWT for the Analytical designer, but whenever I try the dashboard Iframe it gets stuck in the JWT auth, when I remove the
apiTokenAuthentication=true
the IFRAME loads (as this uses the browser session if I logged in on GoodData in another tab). Have you guys tested the dashboard Iframe with JWT authentication? The dashboard WebComponent does work with JWT, as we use it often, but I don't know if there is a way to enable navigation sidebar in the WebComponent?
m
Hi Jhonatan, I’ve run several tests on this setup, and the dashboard editor page successfully rendered for me inside the iframe while using JWT-based authentication. I’ve attached a screenshot that highlights this behavior for your reference. One key point I want to mention is that I explicitly included the
apiTokenAuthentication=true
parameter in the
src
URL to ensure the authentication went through correctly. Additionally, please double-check the structure of your URL parameters since they must follow the correct syntax. For example:
Copy code
?apiTokenAuthentication=true&showNavigation=false
Note that the first parameter must be preceded by a
?
, and any subsequent parameters should be joined with
&
. If this hierarchy is incorrect, e.g., using two
?
characters or misplacing the
&
, then the URL may be treated as invalid, and the dashboard will fail to render. I’ve also shared an HTML file containing my working test setup. You can compare it with your implementation and identify any discrepancies. Let me know if you need further clarification or run into any other issues.
🙌 1
j
based on your JS example I was able to figure out the issue here, we must specific the correct product when creating the JWT, I did the JWT ages ago so wasn't fresh in memory but I believe it should be good now, when I set showNavigation=true I can now see it properly. Thanks everyone for the help!
🙌 1