This section explains how to embed the Bold BI Designer Dashboard using Authorization Server Authentication.
Include the Bold BI Embed SDK in the <head>
tag of your HTML page.
Create a <div>
element in the <body>
tag with a unique ID to serve as the dashboard container.
<head>
<script type="text/javascript" src="https://cdn.boldbi.com/embedded-sdk/v12.1.5/boldbi-embed.js"></script>
</head>
<body>
<div id="dashboard_container"></div>
</body>
In the body tag, define functions to create a BoldBI instance, then call the initialization function using the onload
attribute. This ensures secure dashboard loading with user-specific access.
Use the following example to embed a draft dashboard:
<body onload="embedSample();">
<div id="dashboard_container"></div>
<script>
function embedSample() {
var boldbiEmbedInstance = BoldBI.create({
serverUrl: "http://localhost:51777/bi/site/site1",
mode:Bold.Mode.Design,
embedContainerId: "dashboard_container",
authorizationServer:{
url:"your-authorization-server-url"
}
});
boldbiEmbedInstance.loadDesigner();
}
</script>
</body>
Note: For more information on designer members, methods, and events, refer to this link