Articles in this section
Category / Section

How to embed Iframe Embedding using SSO

Published:

Bold BI provides the support to embed dashboards in any application using Iframe based embedding. This article explains Iframe based embedding using Single Sign On (SSO). User could be able to embed dashboard without login prompt while trying to embed using iFrame URL with valid embedSignature.

Prerequisites

You need the mentioned prerequisites to run the sample. For the cloud version, you should have an active Bold BI Cloud application and  for On-Premise, you should Install the latest Bold BI Enterprise build.

Steps to run the sample

  1. Please download the Iframe Embedding SSO sample.
  2. Set the following embed properties in Program.cs file as follows.
    Parameter Description
    dashboardUrl URL of the dashboard to be embed
    secretCode Authorized key for the dashboard to be embed
    userInfo The email id of the user
    >> namespace EmbedDashboardUsingSSO
    >> {
    >>     class Program
    >>     {
    >>         static void Main(string[] args)
    >>         {
    >>             // Variable declaration to form the embed URL
    >>
    >>             string secretCode = "7tFaq2zidmxJN8Pid6IMYhHFqAUwMfK";  // secret code generated in the Bold BI application
    >>             var dashboardUrl = "https://demo.boldbi.com/bi/en-us/dashboards/af43fb72-1e4e-45d5-9783-2a905a928792/Sales/Northwind%20Traders%20Sales%20Analysis(114)?viewid=3988a564-57c9-416e-b645-f6cc50ce5c0b&"; // URL of the dashboard to be embedded. Add '? or &' at the end of the URL based on your dashboard URL
    >>
    >>             // Variable declaration to form the signature for the embed URL
    >>
    >>             var nonce = Guid.NewGuid().ToString(); // random string
    >>             var userInfo = "demo@boldbi.com"; // email address of the user
    >>             bool canSaveView = true; // enable or disable permission to create, open, update, delete view
    >>             bool hasViews = true; // enable or disable the permission to check the views of the dashboard
    >>             bool hasExport = true; // enable or disable the permission to export the dashboards and widgets
    >>             bool hasDashboardComments = true; // enable or disable the permission to comment related actions to dashboards
    >>             bool hasWidgetComments = true; // enable or disable the permission to comment related actions to widgets
    >>             bool isMarkFavorite = true; // enable to disable the permission to make the dashboard favorite
    >>             double timeStamp = DateTimeToUnixTimeStamp(DateTime.UtcNow); // current time as UNIX time stamp
    >>             var expirationTime = "100"; // alive time of the token
    
  1. In Bold BI Server, you can get your Embed Secret key from the administrator setting section using help link.
  2. In the cs file, set the URL of the dashboard in the variable dashboardUrlthat you want to render. Please refer this link to get dashboard URL
    >>             var dashboardUrl = "https://demo.boldbi.com/bi/en-us/dashboards/af43fb72-1e4e-45d5-9783-2a905a928792/Sales/Northwind%20Traders%20Sales%20Analysis(114)?viewid=3988a564-57c9-416e-b645-f6cc50ce5c0b&"; // URL of the dashboard to be embedded. Add '? or &' at the end of the URL based on your dashboard URL
    >>
    
  3. Based on provided Embed Properties, we are making Iframe URL with mandatory parameters as below then proceeded to run the sample.
    >>             string signature = SignURL(embedMessage.ToLower(), secretCode);
    >>             string embedSignature = embedMessage.ToLower() + "&embed_signature=" + signature;
    >>             var embedUrl = dashboardUrl + embedSignature;
    >>             var iframe = "<iframe src='" + embedUrl + "' id='dashboard-frame' width='1200px' height='600px' allowfullscreen frameborder='0'></iframe>";
    >>             var filePath = @"..\..\..\embed.html"; // file named embed will be created in the extracted location in which the embed URL will be maintained
    >>             File.WriteAllText(filePath, iframe);
    >>             string url = filePath;
    >>             Process.Start("chrome.exe", url); // By default, the embed dashboard will be rendered in Google Chrome. Can update the browser as you wish
    >>         }
    

Related links

Was this article useful?
Like
Dislike
Help us improve this page
Please provide feedback or comments
EO
Written by Enos Otieno Juma
Updated:
Comments (0)
Please  to leave a comment
Access denied
Access denied