Documentation
Demos
Support
Blog
Try it Free
Search results

Embed Authentication for the Draft Designer Dashboard

This section explains how to embed the Bold BI Designer Dashboard using Authorization Server Authentication.

How to embed Bold BI Draft Designer Dashboard using Javascript

  1. Include the Bold BI Embed SDK in the <head> tag of your HTML page.

  2. 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/v14.1.11/boldbi-embed.js"></script>
</head>
<body>
    <div id="dashboard_container"></div>
</body>

  3. 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>

Supported Authentication

Note: For more information on designer members, methods, and events, refer to this link

Previous
Next