topic Re: Qlik Application embed to Website in Integration, Extension & APIs

Qlik Application embed to Website

Ankit03 — Wed, 12 Feb 2025 12:56:12 GMT

Hello everyone

We're utilizing anonymous access to embed the dashboard onto our website. While the link itself works fine and opens as expected, when we attempt to embed iframe in HTML and apply the positioning with the code provided below, the content isn't displayed.
here is the code

<scriptcrossorigin="anonymous"type="application/javascript"src="https://cdn.jsdelivr.net/npm/@qlik/embed-web-components@1/dist/index.min.js"data-host="https://<TENANT_NAME>.se.qlikcloud.com"data-client-id="<CLIENT_ID>"data-access-code="<EMBED_ACCESS_CODE>"data-auth-type="anonymous"></script>

Please help us to find the solution

Re: Qlik Application embed to Website

alex_colombo — Wed, 12 Feb 2025 13:15:02 GMT

Hey @Ankit03 anonymous embedding is working for me. Could you please share qlik-embed html tag where you are defining ui and app id props?

Could you please inspect browser developer console and see if you have any errors?

Re: Qlik Application embed to Website

Ankit03 — Thu, 13 Feb 2025 06:22:48 GMT

Dear @alex_colombo

We are embedding a Qlik Cloud dashboard into our website, enabling public access without requiring users to log in or authenticate, through the use of anonymous access.
This allows the dashboard to be freely accessible to anyone visiting the website, with no need for a Qlik Cloud account or login credentials. The dashboard embed with website for easy viewing

The problem we're facing is that the dashboard works fine when opened directly, but it doesn't display correctly when embedded in an HTML page using an iframe The purpose of this is to embed Qlik sense dashboard on website for easy viewing Rephrase the sentence

We created a custom user role in Qlik Cloud.
Allow the custom user for public link creation
We assigned a Talent admin to this custom role.
We set up a managed space to organize and store our app securely.
We created an OAuth2 Client type for anonymous embedding and then copied the client code.
In the catalog, right-click ellipses, then select Shared with Anonymous link and copied iframe and embedded in the below code .

<html>
<head>
<script

crossorigin="anonymous"

type="application/javascript"

src="https://cdn.jsdelivr.net/npm/@qlik/embed-web-components@1/dist/index.min.js"

data-host="https://ABC.se.qlikcloud.com/"

data-client-id="123456987456321"

data-access-code="123654-45c-aff7-2ef2e0e95f3b.X_96rPk7C7juYTLvpqMBiHP1NZUAR2-YJWSYwaiK2Yk"

data-auth-type="anonymous"
></script>
</head>
</html>
When we run this code, we get a blank page, and upon checking the browser console, no errors are displayed

Re: Qlik Application embed to Website

alex_colombo — Thu, 13 Feb 2025 13:57:58 GMT

You are missing the part where qlik-embed inject Qlik app. You have defined only connection and authentication part. Please see here on how to embed an entire Qlik app and here for an example.

I'm adding an example here as well:

<qlik-embed

  ui="classic/app"

  app-id="de685622-4bfd-4479-be63-b22e6bb5f358"

  sheet-id="TUJPPmG"

  >

  </qlik-embed>