Embed Tableau into PowerApps without prompting credential

PowerApps is an excellent tool for building custom business applications, with native support for embedding Power BI reports and dashboards. However, if your organization uses both Tableau and PowerApps, embedding Tableau dashboards can be a challenge since it is not natively supported.

In this blog post, I’ll demonstrate how to use the Tableau PCF component to seamlessly embed a Tableau dashboard within PowerApps without requiring users to log in (Connected App Method).

Connected Apps: Use Connected Apps if you want to facilitate an explicit trust relationship between Tableau Online or Tableau Server and external applications where Tableau content is embedded. The trust relationship is established and verified through an authentication token in the JSON Web Token (JWT) standard.

Prerequisites

• Code component feature is enabled in your PowerApps environment. 🔗
• Tableau component solution 🔗
• Tableau Site Admin Role or higher
• Tableau 22.1 version or later, for Connected App UI
• Or Tableau 21.4 version or later, for Connected App API

Install Tableau component

To get started, download the Tableau component managed solution from GitHub and import it into your PowerApps environment. Then, create a blank Canvas App and import the Tableau component into your app.

1. Download Tableau component managed solution from github realease.

2. Go to PowerApps environment to import solution

3. Create a blank Canvas App, click ‘Get more components’ under Insert Tab to import Tableau components.

4. Add Tableau compoent into canvas, and you’ll find some properties under Properties tab awaiting configurations from tableau.

• Source: Embeded link of Tableau dashboard
• ClientId: Client Id of connected app
• SecretId: Secret Id of connected app
• Secret: Secret of connected app
• Username: Tableau account name with proper access permission to dashboard
• Device: Dekstop or Mobile
• HideTabs: show or hide tableau toolbar

Now that we’re done with the PowerApps section, let’s go to Tableau and configure Connected Apps Setting.

Create a connected app

1. Sign in Tableau as a site admin, go to Settings-Connected Apps tab, click ‘New Connected App‘ dropdown and select Direct Trust

2. Enter connected app name.

3. From the Applies to drop-down menu, select All project or Only one project to control which views or metrics can be embedded. If you select the “Only one project” option, select the specific project to scope to. For more information about these two options, see Access level (embedding workflows only).

4. In the Domain allowlist, specify the domains using the rules described in Domain formatting below to control where views or metrics can be embedded.

5. Click ‘Generate New Secret‘ button to generate the secret, and here is the Secret Id and Secret.

6. Next to the connected app’s name, click the actions menu and select Enable. Now all Connected-Apps configurations are done!

Get dashboard embedded link

Open the dashboard view you’d like to embed in PowerApps, click ‘Share‘ button to open the share view and click ‘Copy Link‘ button to get the dashboard link.

Complete the final configurations

Once the Tableau configurations are complete, return back to your Canvas App, paste dashboard link into Source property, and Client Id, Secret Id, Secret Value from Tableau Connected App page, into ClientId, SecretId and Secret properties. Enter your tableau account name into Username property, and “Destkop” into Device property.

The Tableau componet will start redenering for few seconds, and then here we go!! ✨✨✨

Wrap up

In conclusion, by leveraging the Tableau PCF component and the Connected App method, it is possible to seamlessly embed Tableau dashboards within PowerApps without requiring credential. This integration of two powerful platforms can enable organizations to enhance their data analysis capabilities and streamline their workflows.

Not over yet

In next post, I will share the step-by-step instructions about how to create a Tableau PCF.