A GitHub link has been provided to get the sample application, which demonstrates the rendering of dashboard available in your Bold BI server and followed by steps to create a new embedding application in the Ruby on Rails
on your own.
NOTE: The best way to get started would be reading the Getting Started section of the documentation to start using first. The
Getting Started
guide gives you enough information that you need to know before working on the sample.
Please get the Ruby on Rails sample.
You need to set your embed property details in the Index.html.erb
and Authorizes_Controller.rb
.
ServerUrl | Bold BI Server URL (ex: http://localhost:5000/bi/site/site1, http://dashboard.syncfusion.com/bi/site/site1) |
DashboardID | Provide the dashboard id of the dashboard you want to embed. |
authorizationUrl | URL pointing to AuthorizeServer API file. We are running ruby sample in 3000 port(http://localhost:3000/api/v1/authorizes). |
EmbedSecret | You could get your EmbedSecret key from Embed tab by enabling Enable embed authentication in Administration page |
UserEmail | UserEmail of the Admin in your Bold BI, which would be used to authorize the server |
Get the item id of the dashboard from the BI server. Please refer to this link and the following screenshot.
Then, run your Ruby on Rails sample.
Dashboard can be rendered in design mode or created with the following changes in the embedSample()
method.
function embedSample() {
var boldbiEmbedInstance = BoldBI.create({
serverUrl: "http://localhost:5000/bi/site/site1",
dashboardId: "", //Provide item id to render it in design mode,to create dashboard remove this property
embedContainerId: "dashboard",
embedType: BoldBI.EmbedType.Component,
environment: BoldBI.Environment.Enterprise, // If Cloud, you should use BoldBI.Environment.Cloud
mode: BoldBI.Mode.Design,
height: "800px",
width: "1200px",
authorizationServer: {
url: "http://localhost:3000/api/v1/authorizes"
},
expirationTime: "100000",
});
boldbiEmbedInstance.loadDesigner();
}
serverUrl | Dashboard Server BI URL (ex: http://localhost:5000/bi/site/site1, http://dashboard.syncfusion.com/bi/site/site1) |
dashboardId | Provide the dashboard id of the dashboard you want to embed in view or edit mode. Ignore this property to create new dashboard. |
embedContainerId | Container Id in which dashboard renders.It should not contain hypen. |
mode | In which mode you want to render dashboard. It can either be 'View' or 'Design' mode. |
expirationTime | Set the duration for the token to be alive. |
authorizationServer | Url of the 'GetEmbedDetails' action in the application. |
Based on the dashboard provided in the embed properties, you will authorize the server URL by calling the GetEmbedDetails function by API(http://localhost:3000/api/v1/authorizes) call with the provided EmbedProperties values.
In the above authorization, the SignatureUrl
has been generated with the provided EmbedSecret key
and validated the embed details in Bold BI. Once the details are validated, the dashboard starts to render in the index.html.erb
.
In the Index.html.erb
, change the dashboard Id of the respective dashboard as you wish to embed.
Install the ruby using link by accepting the license.
Once installed, check the version of the ruby using the command prompt ruby -v
.
To install the rails
, run the command gem install rails
. To check the rails version, run the command rails -v
.
To create a new application, run the command rails new myApp --database-postgresql
. Here, myApp
is the folder name, and postgresql
is the data base used. Ruby on rails uses SQLite
as a default database, other than this need to be specified in command.
Change the file directory by the command cd myApp
and run a command rails s
to run the application. Open the browser and go to the localhost://3000
, you are able to view the Ruby on Rails welcome page.
In the index.html.erb
file, include the mandatory file in the <head>
tag. In the <body>
tag, invoke the method embedSample()
and create a DOM element with id dashboard
as follows.
<head>
<title>Demo</title>
<%= javascript_include_tag "https://cdn.boldbi.com/embedded-sdk/v6.17.13/boldbi-embed.js", "data-turbolinks-track" => true %>
</head>
<body onload="embedSample();">
<div id="dashboard"></div>
<script>
function embedSample() {
var boldbiEmbedInstance = BoldBI.create({
//Bold BI server URL (ex: http://localhost:5000/bi/site/site1, http://demo.boldbi.com/bi/site/site1)
serverUrl: "http://localhost:64503/bi/site/site1",
//Get and set the item id of the dashboard to embed from BI server(https://help.syncfusion.com/bold-bi/enterprise-bi/share-dashboards/get-dashboard-link#get-link).
dashboardId: "",
embedContainerId: "dashboard",
embedType: BoldBI.EmbedType.Component,
//Your Bold BI application environment. (If Cloud, you should use `Cloud`, if Enterprise, you should use `Enterprise`)
environment: BoldBI.Environment.Enterprise, // If Cloud, you should use BoldBI.Environment.Cloud
height: "800px",
width: "1200px",
authorizationServer: {
//URL pointing to AuthorizeServer API file. We are running ruby sample in 3000 port(http://localhost:3000/api/v1/authorizes). Learn more about authorize server(https://help.syncfusion.com/bold-bi/embedded-bi/javascript/authorize-server)
url: "http://localhost:3000/api/v1/authorizes"
},
expirationTime: "100000",//Set the duration for the token to be alive.
});
boldbiEmbedInstance.loadDashboard();
}
</script>
</body>
In the embedSample()
method, create an instance to render the dashboard using the loadDashboard()
method.
In the authorize_controller.rb
file, define the variables embedSecret
and userEmail
for authorization purpose. Invoke the method getEmbedDetails()
, which uses the method getSignatureUrl()
to generate the algorithm.
In getEmbedDetails()
API, the embedQuerString
,userEmail
and the value from the GetSignatureUrl()
method is appended as query parameters in the URL to get details of particular dashboard. Then run the application.
class Api::V1::AuthorizesController < ApplicationController
skip_before_action :verify_authenticity_token
def create
#Get the EmbedSecret key from Bold BI(https://help.syncfusion.com/bold-bi/on-premise/site-settings/embed-settings)
@embedSecret = ""
#Enter your Bold BI credentials
@userEmail = ""
@EmbedQueryString = params[:embedQuerString]
@DashboardServerApiUrl = params[:dashboardServerApiUrl]
getEmbedDetails
render :json => Net::HTTP.get(URI.parse(@ApiUrl))
end
private
def getEmbedDetails
@EmbedQueryString = @EmbedQueryString << "&embed_user_email=" << @userEmail
getSignatureUrl
@EmbedSignature = "&embed_signature=" + @signature;
@EmbedDetailsUrl = "/embed/authorize?" + @EmbedQueryString.downcase + @EmbedSignature;
@ApiUrl = @DashboardServerApiUrl << @EmbedDetailsUrl
end
def getSignatureUrl
@EmbedQueryString = @EmbedQueryString.downcase
@hmac = OpenSSL::HMAC.digest('sha256', @embedSecret, @EmbedQueryString)
@signature = Base64.strict_encode64(@hmac)
end
end