How AWS Quicksight 1-Click embedding works on web applications?

Quicksight 1-Click embedding or One-click embedding is possibly one of the easiest ways offered by AWS that enable users to embed the Quicksight dashboard on web applications. The embed code can be created without using the QuickSight embedding API. Users can just copy the QuickSight embed code and insert it into the HTML code of their internal application. It involves a few steps to follow

Domain Whitelisting:

It is essential to whitelist the domain in Quicksight prior to the process of 1-Click embedding. The website domain that is going to use this feature should be on the list of authorized domains in AWS Quicksight. By authorizing the domain, the users can prevent the embed code from the usage by unauthorized applications.

To do so, we have to sign in to the Quicksight account that has the admin role

Then, on the username dropdown, click manage Quicksight which will take us to the admin controls

 

                       

On the left, select Domains and Embedding. At the bottom of the page is a list of websites where the dashboards can be embedded.

Enter the domain name (Make sure you add https or http to all the domains that you add example: https://example-1.com) in the Domain tab. To enable embedded dashboards on all subdomains, select Include subdomains. To add the domain, select Add.

Embed Code:

To get the embed code, use the following steps

  •  Select the Dashboards option on the left which is right above the Analyses option.

Quicksight Dashboard

  •  After opening one of the published dashboards in the QuickSight dashboards section, choose the share button on the top right before the Alerts button.

Quicksight dashboard share

  • Select Copy embed code in the upper left corner of the Share dashboard page that appears

quicksight embed code

  •  The embed code that is copied to your clipboard looks something like the following. Before pasting this to the HTML page of the domain, it is necessary to share the dashboards with the users and groups whom you allow to view the dashboard.

aws quicksight embed code

  • Then, paste the embed code into the HTML code location where you wish to embed the dashboard. The following picture is a demonstration of what the code looks like after pasting. Users and groups who are granted access now be able to view the dashboard on the website.

1-click public embedding

The usage of this feature must be authorized by an administrator of your QuickSight account with the necessary AWS Identity and Administration (IAM) capabilities because it permits dashboards to be activated for any user.

Grant an administrator user public sharing permissions in the IAM console. The new permissions can be added to an existing user or you can add them to a new policy. The sample policy below grants authorizations for use with UpdatePublicSharingSettings


{
"Version": "2012-10-17",
"Statement": [
{
"Action": "quicksight:UpdatePublicSharingSettings",
"Resource": "*",
"Effect": "Allow"
}
]
}

The account-level settings can be activated after you enable this policy.

Now open your QuickSight account and log in. Make the selection Manage QuickSight from the user name drop-down menu. In the menu pane, select Security & permissions. Select Manage from the list of Public access to dashboards.

quicksight public embedd

After Clicking the manage option you will be redirected to the page where you will be able to see manage public access to dashboards. Then enable the option to allow public access for Everyone on the Internet. Once do that, you will have a pop-up asking you to type the word confirm and accept it.

Quicksight Public embed confirm

Not all dashboards are instantly accessible to everyone with an internet connection when this setting is enabled. Authors of the dashboards have the option to individually allow anyone with an internet connection to access the dashboard through the share link.

 

Quicksight dashboard share

Now you will be seeing the setting Anyone on the internet(Public) on every published dashboard. enabling this option would allow the authors and admins to grant the public access to the dashboards individually.

Quicsight Public embed anyone

This is how you can quickly and simply embed interactive QuickSight dashboards with 1-click embedding on your web applications.

2 thoughts on “How AWS Quicksight 1-Click embedding works on web applications?”

Leave a Comment