jDID THIS ARTICLE SOLVE YOUR ISSUE?
Let us know so we can improve!
Let us know so we can improve!
Function: initializeAnalyticsSdk()
initializeAnalyticsSdk(
config):Promise<BootstrapResponse>
Use this method to initialize the Analytics Embedding SDK with the provided configuration.
Calling this method clears all event data before initialization.
Successful initialization triggers a successEvent, while any failures due to configuration or authorization issues trigger an errorEvent.
Parameters
• config: AnalyticsSdkConfig
The configuration to use for SDK initialization
Returns
Promise<BootstrapResponse>
A promise that resolves to the result of the initialization.
Usage
1//JavaScript
2// Importing required modules and libraries from the Tableau Next Embedding SDK
3import {
4 initializeAnalyticsSdk,
5 AnalyticsDashboard,
6 analyticsEventTarget,
7} from "@salesforce/analytics-embedding-sdk";
8
9analyticsEventTarget.addEventListener(EventName.ERROR, (errorEvent) => {
10 //Listening to global ERROR event, such as SDK or component initialization failures.
11 console.log("Received a global error event", errorEvent); //Error details, such as error code and message, are available in the event object
12});
13
14await initializeAnalyticsSdk({
15 //Configuration object for initializing the Tableau Next Embedding SDK
16 authCredential: "<%- authCredential %>", //The frontdoor URL required for authentication
17 orgUrl: "<%- org-url %>", //The Salesforce org URL that hosts the Analytics component to be embedded.
18});
19
20const analyticsDashboard = new AnalyticsDashboard({
21 parentIdOrElement: "<%- parent-element %>", //The parent ID or element to render the component in
22 idOrApiName: "<%- dashboard-id-or-api-name %>",
23}); //The ID or API name of the component to embed
24
25analyticsDashboard.addEventListener(EventName.ERROR, (event) => {
26 //Listening to component specific ERROR event
27 console.log("Received error", event); // Error details (such as error code and message) are available in the event object
28});
29
30analyticsDashboard.addEventListener(EventName.COMPONENT_LOADED, () => {
31 //Listening to COMPONENT_LOADED event triggered when the component gets loaded
32 console.log("Component Loaded");
33});
34
35analyticsDashboard.render(); //Renders the dashboard in the parent HTML element1//TypeScript
2// Importing required modules and libraries from the Tableau Next Embedding SDK
3import {
4 AnalyticsDashboard,
5 initializeAnalyticsSdk,
6 analyticsEventTarget,
7 type DashboardProps,
8 type AnalyticsSdkConfig
9} from '@salesforce/analytics-embedding-sdk';
10
11analyticsEventTarget.addEventListener(EventName.ERROR, (errorEvent) => { //Listening to global ERROR event, such as SDK or component initialization failures.
12 console.log("Received a global error event", errorEvent) //Error details, such as error code and message, are available in the event object
13});
14
15const config: AnalyticsSdkConfig = { //Configuration object for initializing the Tableau Next Embedding SDK
16 authCredential: "<%- authCredential %>", //The frontdoor url required for authentication
17 orgUrl: "<%- org-url %>" //The Salesforce org URL that hosts the Analytics component to be embedded.
18};
19await initializeAnalyticsSdk(config);
20
21const dashboardProps: DashboardProps = { //Defines the properties required for configuring a dashboard component.
22 parentIdOrElement: '<%- parent-element %>', //The parent ID or element to render the component in
23 idOrApiName: '<%- dashboard-id-or-api-name %>' //The ID or API name of the component to embed
24};
25
26const analyticsDashboard: AnalyticsDashboard = new AnalyticsDashboard(dashboardProps); //A web component for embedding an analytics dashboard
27
28analyticsDashboard.addEventListener(EventName.ERROR, (event) => { //Listening to component specific ERROR event
29 console.log("Received error", event); //Error details (such as error code and message) are available in the event object
30});
31
32analyticsDashboard.addEventListener(EventName.COMPONENT_LOADED, () => { //Listening to COMPONENT_LOADED event triggered when the component gets loaded
33 console.log("Component Loaded");
34});
35
36analyticsDashboard.render(); //Renders the dashboard in the parent HTML elementMulti-org Support
The SDK supports initializing and embedding components from multiple Salesforce orgs.
Use the orgConfigs array to configure multiple orgs:
1// Multi-org initialization
2await initializeAnalyticsSdk({
3 orgConfigs: [
4 {
5 authCredential: "https://org1.salesforce.com/secur/frontdoor.jsp?sid=123...",
6 orgUrl: "https://org1.lightning.force.com", // Must be Lightning URL
7 },
8 {
9 authCredential: "https://org2.salesforce.com/secur/frontdoor.jsp?sid=123...",
10 orgUrl: "https://org2.lightning.force.com", // Must be Lightning URL
11 },
12 ],
13});
14
15// When creating components in multi-org scenarios, always specify orgUrl
16const dashboard1 = new AnalyticsDashboard({
17 parentIdOrElement: "container1",
18 idOrApiName: "Dashboard1",
19 orgUrl: "https://org1.lightning.force.com", // Required in multi-org
20});
21
22const dashboard2 = new AnalyticsDashboard({
23 parentIdOrElement: "container2",
24 idOrApiName: "Dashboard2",
25 orgUrl: "https://org2.lightning.force.com", // Required in multi-org
26});Auth Redirect Flow (Single-Org or Multi-Org: MFA / Password Reset)
In multi-org scenarios, each org can complete with a different outcome. In single-org scenarios,
the same redirect handling applies for the single org. If an org requires additional
authentication, like a MFA challenge or password reset, this method can return a non-success state
for that org with redirect metadata in orgStates:
state:AUTH_REDIRECTredirectUrl: org-provided relative redirect pathredirectOrigin: org-provided origin
For each org in AUTH_REDIRECT, open ${redirectOrigin}${redirectUrl} in a popup/tab and complete
the required auth step, then call retryOrAddOrgs() for the affected org(s) to resume initialization.
Retry parameter patterns:
- Standard retry: use a fresh frontdoor URL/session credential
{ orgUrl, authCredential: "<frontdoor url>" } - MFA/password-reset resumed session (supported): use org URL as credential
{ orgUrl, authCredential: orgUrl }
When the MFA/password-reset completes and session is established, you can retry with
authCredential: orgUrl without regenerating frontdoor URL. If the retry fails, regenerate
frontdoor URL and retry.
Note: The orgUrl parameter must be a Lightning URL (e.g., https://yourorg.lightning.force.com), not the my.salesforce.com domain URL.
j