Documentation
Demos
Support
Blog
Download Free Trial
Search results

Embed Widgets using SSO in Bold BI

Bold BI supports embedding the widgets to other web applications using Single Sign-On authentication.

Steps to embed widgets

Below are the steps to embed widgets into other web applications.

Get a embed secret code

  1. Go to the settings page and click Embed. Enable the Enable embed authentication under that page.

    Enable embed authentication

  2. Click Generate Secret button.

    Generate secret code

  3. On clicking it, the secret code will be generated. Save the secret key safely, as it will not be able to retrieve or restore this generated secret.

    Copy secret code

  4. Once the secret code is generated, it can be regenerate by clicking the Regenerate Secret button.

    Regenerate secret code

Warning : Resetting this code will break the previously working embedded dashboards.

How to get the Embed Widget Url

  1. Open the desired dashboard and select the More option under the widget you want to embed .Then, select Get Embed Code from the drop-down menu.

InspectElement

  1. Copy the iframe code from the embed code pop-up page.

InspectElement

Creating the embed URL

The embed URL should be in the below format,

{dashboard URL}/{embed parameters}&embed_signature={signature}

Example: http://test.boldbi.com/bi/en-us/site/site1/dashboards/8428c9d9-85db-418c-b877-ea4495dcddd7/Predictive%20Analytics/Personal%20Expense%20Analysis?isWidgetMode=true&widgetId=0000aeab-3359-40c6-b014-1ea98e9a7ce9&embed_nonce=3e253410-1a82-4fb3-a337-122a8007dafc&embed_user_email=test@syncfusion.com&embeds=sdwd&embed_dashboard_views=true&embed_dashboard_export=true&embed_widget_comments=true&embed_timestamp=1583928213&embed_expirationtime=100&embed_signature=VYrDMVX4h85PrRBKX9mystRHYkU8z+HVC9bkVMc2qGY='

Please find the details of the parameter in the URL as below,

Parameter Description
dashboard URL URL of the dashboard, in which the widget is present and will be embedded.
embed parameters Parameters required to embed the particular widget of dashboard with SSO.
signature The authorized key for the dashboard, in which the widget is present and will be embedded.

Parameters to generate the signature in the embed URL

The below values are necessary to form the signature

Parameter Mandatory Description Example
isWidgetMode Yes To enable the widget mode. true
widgetId Yes Widget Id of the widget to be embedded. To know how to get widgetId from the dashboard, here 0fa8d95d-e262-4a89-0976-390e3a57ee50
embed_nonce Yes Random string that restricts the URL reconstruction or attacks from the hackers. 0fa8d95d-e262-4a89-0976-390e3a57ee50
embed_user_email Yes The email id of the user. [email protected]
embed_dashboard_export No The export option to the various formats of the dashboard and widget in the embedded dashboard is displayed based on this value. true
embed_widget_comments No The actions related to comments such as post, edit, delete, reply, posting the image and user mention list options can be performed in widgets based on this value. true
embed_timestamp Yes The current time as UNIX time stamp. The embed URL formed is valid for 604800 sec(7 days as maximum) from this embed time stamp. Example for embed_timestamp is 1583934776.
embed_expirationtime No Set the duration for the token to be alive. It must be represented in seconds. The minimum time is 86400 sec (1 day) and the maximum time is 604800 sec(7 days). Example for embed_expirationtime is 604800

Generating the signature for the embed URL

Parameter Mandatory Description Example
embed_signature Yes A signature is generated using the secret code to authenticate the embed URL. VYrDMVX4h85PrRBKX9mystRHYkU8z+HVC9bkVMc2qGY=

The embed parameter should be formed as in the below format.

isWidgetMode=true&widgetId=0000aeab-3359-40c6-b014-1ea98e9a7ce9&embed_nonce=55a1c8f4-5015-487d-8463-d3ebeae655fd&embed_user_email=test@syncfusion.com&embed_dashboard_export=true&embed_widget_comments=true&embed_timestamp=1583935418&embed_expirationtime=100

To obtain the signature for the embed URL, pass the query parameters as an argument to the below GetSignatureUrl method. It will return the hashed signature, which you must append to the existing query parameters with the query parameter name as ‘embed_signature’.

        
        public string GetSignatureUrl(string queryString)
        {
            // Get the embedSecret key from Bold BI.
            var embedSecret = "8apLLNabQisvriG2W1nOI7XWkl2CsYY";
            var encoding = new System.Text.UTF8Encoding();
            var keyBytes = encoding.GetBytes(embedSecret);
            var messageBytes = encoding.GetBytes(queryString);
            using (var hmacsha1 = new HMACSHA256(keyBytes))
            {
                var hashMessage = hmacsha1.ComputeHash(messageBytes);
                return Convert.ToBase64String(hashMessage);
            }
        }

Provided the code sample to generate the signature in C#. You can write the equivalent code in your platform language.

Available parameter

Name Type In Widgets
embed_widget_comments boolean Show/hide widget comments
embed_dashboard_export boolean Show/hide widget export option
hide_widget_tool string Predefined values: fr-Filter,fs-FullScreen,om-Option Menu

Sample to embed widget of dashboard using SSO authentication

You can download the sample here.

Previous
Next