QnA Embedding error

[djuvvadi]

I followed the instructions to embedded QnA, but getting following error:

Uncaught Error: Attempted to embed component of type: qna but did not find any matching component. Please verify the type you specified is intended.
at Service.embedNew (service.ts:235)
at Service.embed (service.ts:210)

Error is thrown in below function in service.ts:

/**
* Given a configuration based on a Power BI element, saves the component instance that reference the element for later lookup.
*
* @private
* @param {IPowerBiElement} element
* @param {embed.IEmbedConfiguration} config
* @returns {embed.Embed}
*/
private embedNew(element: IPowerBiElement, config: embed.IEmbedConfiguration): embed.Embed {
const componentType = config.type || element.getAttribute(embed.Embed.typeAttribute);
if (!componentType) {
throw new Error(`Attempted to embed using config ${JSON.stringify(config)} on element ${element.outerHTML}, but could not determine what type of component to embed. You must specify a type in the configuration or as an attribute such as '${embed.Embed.typeAttribute}="${Report.type.toLowerCase()}"'.`);
}

// Saves the type as part of the configuration so that it can be referenced later at a known location.
config.type = componentType;

const Component = utils.find(component => componentType === component.type.toLowerCase(), Service.components);
if (!Component) {
throw new Error(`Attempted to embed component of type: ${componentType} but did not find any matching component. Please verify the type you specified is intended.`);
}

const component = new Component(this, element, config);
element.powerBiEmbed = component;

this.addOrOverwriteEmbed(component, element);
return component;
}

Really appreciate any help to resolve this.

Thank you

Dheeraj

[TedPattison]

Here is the basic client-side code you need. Note you must include an array of dataset IDs. The irony here is that you can only pass a single dataset ID in the array as the support for embedding the QnA experience with two or more datasets is not there yet.

// Get data required for embedding
var datasetId = "5c82edbf-46a1-48f3-b337-3ef12c69a94b";
var embedUrl = "https://app.powerbi.com/qnaEmbed?groupId=54afb565-3935-47e1-9a89-67e48a78ca45";
var accessToken = "H4sIAAAAAAAEACWWxa7FCnJF_-VNHclMkXpgPGbmmZmZHeXfc9M93zWopdpL9T__WOk7zGnxz3__U8EzQUY04RjVWIYpMwKv6NR4U7FNHbCV1qbNUbN48dbg0PSQstyrkBXV25ahPKxc-7mfWFQhpoaJU0lA-wLlrOKr0lGwQmN-nLTffMaLJfVoh9M6ySHrgWtsEduTnVw6rAXR7tIuAhDpRhpqK5CzaL8Ex3YB9NS4168EEIrlYW1HfqJRkNRDoDs0NL7hNZvMLYV0_ejI5KeeiU4YcnT4fXK4EANuHU9BVq2EVoBSdPN6a-aVASuUiBrzCN_iC7gr3UZi-MHaO225PqY2J_rQvN6J7AMZfj-sTfnCFvDfocpLPt6YL_sCyw0wQ3lzx2rcZSk53A-eQQDx2R5DZKaTg6fNGXza9QrSJAFqT1GeqKoPjNudfn_RceRocM36pidVsz7iRxLCyKEXCvhdXyJm9YUFA7C-X_fCuwO8KpsmjIvUWjcxqu6XhUG1pC-pSXOkSXTwGNPCxAIICY3zyrJiOuF9tS1jVQsaUS93z2oq0GzhuY_ZUYBv-xRHaE4v_sE1RnSp49aqV8E3EKlmUcJhG9Z4yavmLcR8IxmSPS99V5x6RTLqnN_ZIttjzLNKH-sChSBUrp4GPGDLR756tj9Gk9pbuZSMuGdGZMjQmrR1JOg2gAxNRyN8hDBOzV-ea_tvD4YiD9yFXclpc3kBMsLmp7BxZX7A8lv-cHblqJ7y9iuR6AftRkV7KH4CdFdSG_8xLBEgz8BxCZG4qpd03Irfpn5oytjHpZA9UqnwgYklm292Q_3GSxAZjOG0FKVX_QFQ0ao5tREMNoNxZUo1peW4AhN4DROC9ROnAPPtwkmCDWQnp0g36IKCI3sPuqGV8TvU2vfZOQibNCMubCW1Hr4Hf4vJUzNMK9rcdwVpnQDgqJyxuj2lYhTEb2ioWI7M1w8aLknfPl2OqPZDJXlLebxesRTnKriJWY24vuPLiS_k8r8e4m5-MQakQ2bwO3Cs_hGNv8KBxAgdmvBFc7MbOykEuKxI6AjFfq-Q31CDhsUqwh7aormjgG4WDYStatGeM3YbXmsckkNMMGmKAfgOn2e-XN6ealWV2zOpAgovfvopiz5py7DWIjLs5VvD6f5SfPcR9utrbX3ePVKYDfIJHGHNncmDxW4VHTXQy1cW1OOL0eedgb9ehEQs4f15tRRE9Wqu5ZfwbniuHKMJ81BJIV_z5ghmT9CDSMQvHVn5ooj5RRgM5OumDbnksS5bSawwzist7oO3cZB2Ihx2GM9vWuDa0UsYX6fdgZnDQSug-zSQri5-FakogTy1ez1NTJdDmjGx8E2lgSw2A77MEBwCztpSixF9kyx05SCJxuWT8aonmCmC_nUiIEQ2s5IHoXossfbwPgDKiA8xMi3XJ-OljE1wUPAy_thGu7yUXhVLbzldz09e6NCbi-k4AbxAmFO6gRPd1ZCpQwXHoPnnhoDrGbxRHqWmQ0oB7wAE-3kOcEbrmMgP6QXQHAeSv9l4RGwovz6bGPOSIkAllSnkmX3tJFBDHvl-wyzo_lM855I9WBVJMXuUobvR2FCkJBaClKXKmqLA7xBtiBtCiRY_S3hSUI_9L43Pq_T-TL1Y11YxDEHTtiEn34X9xIXCrnVd-GptewTksRu0FaFYmiNT5GJQJPe4GRyOZksjzV-fqY7QZi_IHSSbH7-C4SHHj78GyOXMiMkwYmDjnAtGWLJkisiSiJYypEMwOBrWjYp6mDFnaRkA9pN9-dIimHkOBvqmvGLj1IizOxCdxELsgOkQri6dDG4IpTkBSLX5ELYryi7IRsOng0xmS8v-aBoLps1HxCYgyCalFYeDJ8OS8TxmLbj6hWlbs5LADUNzYAacGKK3rx-Zg2EOlV6sdzx9paVrBoWevS-G3uAME6e6zIsizZw83JVI_IlHkky5Pbn0zEgNhJRdOGV1TeI4d9CFLHIjvoaU_I4RuE_OEGk_5vmtFsNf9SEZSekEwLg0u77xVkrs9s-GC1nVOZnYihYfOgadgqlBAnzStVAwFkB2nb_GOVnWkD881DtjuipD0LY_3YBRe9olvY2DH7gNTAv7pHhg-0lQS_t2TRlcw0v841CGwPqx7vxZpO6LV-w_PuOR2MkUz2-dtxd1u3jpu1EsGkooq4r7XwmBm8NFPn_htG9NNDNgXYS7rPhayBQvNzN6l63Kcv7-qg4Mj5S6856kDwJ-U5gFY65j2CWZ58re541Wftiy64zL_vxc_YCOMyDzaxg52g3KkfYWoAytE-vVLcU1btqEMbwrs4kF_rbejKNLzXS22mfyZ85bpQr3v_71z3_9w23vcsxq-f69OdyA6KjeMBNabDMmT7iAyQmzoed7v_P-Auhy2tdWlD7Xc4_TWz7O13Q2AQvHA6e0Bs3utK6ZpyfgPGF2rOfGbPac5n45hJf7_OKxyevbJJiAc_vUR-Gf73wUBqeKxhVIH2FPScz01ZEKuavEvHlcFbuFlCJBpPbpjBTGsFrFcCDtODIs9ng_i31ob21iXscTnuvJTHmU4irKPOvx0aXjzKLRj1vpd6KsUaLPqnp6uN23fGPleA6SWW_Po5L4eUJ3r5m4VdCSv5mRVJ1tQe_XWPKt7xryekToZzRWKdgENUxNFG0oRCepVgkLl0jpdr7qaIWaq9oaEFbXFNXtM5zNSnL2fzC_S1NucvBHOX8Vouyh159Ck1mRE6l1WKz_nXLbekqPcyv_YiWs9EqC7M55Wj8KDoXmBG_X3g8SGIrIAYJ3j3eOsTmcJn5CBhOh1vINhSpffWxToBESoWwUuMtTmRTE9kQI4IzJdHaLGb3llrhUPjRZUCXObVtgl7xDdVHr9ZvuoN7y86Pw5Ei3QTjlG8iEKbV1Wy0aoMNcUvcV__l6c6w873nBP7UK9SDmvwenRUn8fHOYf32OnhF0x28bBdqZR_aZWMncXxw_-hL4qDZYGOW5XM7HjmKuo6Ut4xPwpwOxoHzgqU9HlFHvxh8Zj6IL8c9i91XS17I8vDeD1lDjffrAgqHEfsPz6Rv9OyqRO32Euxo_42Gf_MWRNKlT3CEZSyBqFEnH_9_8__4fQpW8SNoLAAA=";

// Get models object to access enums for embed configuration
var models = window['powerbi-client'].models;

var config = {
  type: 'qna',
  tokenType: models.TokenType.Embed,
  accessToken: accessToken,
  embedUrl: embedUrl ,
  datasetIds: [ datasetId ],
  viewMode: models.QnaMode.Interactive
  //,  question: "What is sales revenue by quarter and sales region as stacked area chart"
};


// Get a reference to the embedded report HTML element
var embedContainer = document.getElementById('embedContainer');

// Embed the report and display it within the div container.
var embeddedObject = powerbi.embed(embedContainer, config);

Also, if you are using the app-owns-data model with embed tokens, you must create the embed token by passing the target dataset ID.

public static QnaEmbeddingData GetQnaEmbeddingData() {

  PowerBIClient pbiClient = GetPowerBiClient();

  var dataset = pbiClient.Datasets.GetDatasetByIdInGroup(workspaceId, datasetId);

  string embedUrl = "https://app.powerbi.com/qnaEmbed?groupId=" + workspaceId;
  string datasetID = dataset.Id;

  GenerateTokenRequest generateTokenRequestParameters = new GenerateTokenRequest(accessLevel: "view");

  string embedToken = pbiClient.Datasets.GenerateTokenInGroup(workspaceId, 
                                                              dataset.Id, 
                                                              generateTokenRequestParameters).Token;

  return new QnaEmbeddingData {
    datasetId = datasetId,
    embedUrl = embedUrl,
    accessToken = embedToken
  };

}

[lkj]

Hello, 

I am trying to explore the functionality of Power BI Q&A. I need to perform Q&A on 2 or more datasets in the Power BI workspace. However, I am unable to do so. 

Based on the comment "Here is the basic client-side code you need. Note you must include an array of dataset IDs. The irony here is that you can only pass a single dataset ID in the array as the support for embedding the QnA experience with two or more datasets is not there yet.", could you let me know if the feature for embedding QnA experience for multiple datasets is implemented in the Power BI embedded Service?

Thanks. 

[djuvvadi]

Thank you Ted Pattison for the reply.

Yes, am using app-owns-data model with embed tokens and the code you provided was helpful.

Below is the client-side code which throws the error I reported initially.

@{
    ViewData["Title"] = "QandA";
}
<script src="~/js/powerbi.js"></script>

<div id="qnaContainer" class="body-content" style="float:left;width:100%;display:block"></div>

<script>
    // Get data required for embedding
    var datasetId = "5c82edbf-46a1-48f3-b337-3ef12c69a94b";
    var embedUrl = "https://app.powerbi.com/qnaEmbed?groupId=54afb565-3935-47e1-9a89-67e48a78ca45";
    var accessToken = "H4sIAAAAAAAEACWWxa7FCnJF_-VNHclMkXpgPGbmmZmZHeXfc9M93zWopdpL9T__WOk7zGnxz3__U8EzQUY04RjVWIYpMwKv6NR4U7FNHbCV1qbNUbN48dbg0PSQstyrkBXV25ahPKxc-7mfWFQhpoaJU0lA-wLlrOKr0lGwQmN-nLTffMaLJfVoh9M6ySHrgWtsEduTnVw6rAXR7tIuAhDpRhpqK5CzaL8Ex3YB9NS4168EEIrlYW1HfqJRkNRDoDs0NL7hNZvMLYV0_ejI5KeeiU4YcnT4fXK4EANuHU9BVq2EVoBSdPN6a-aVASuUiBrzCN_iC7gr3UZi-MHaO225PqY2J_rQvN6J7AMZfj-sTfnCFvDfocpLPt6YL_sCyw0wQ3lzx2rcZSk53A-eQQDx2R5DZKaTg6fNGXza9QrSJAFqT1GeqKoPjNudfn_RceRocM36pidVsz7iRxLCyKEXCvhdXyJm9YUFA7C-X_fCuwO8KpsmjIvUWjcxqu6XhUG1pC-pSXOkSXTwGNPCxAIICY3zyrJiOuF9tS1jVQsaUS93z2oq0GzhuY_ZUYBv-xRHaE4v_sE1RnSp49aqV8E3EKlmUcJhG9Z4yavmLcR8IxmSPS99V5x6RTLqnN_ZIttjzLNKH-sChSBUrp4GPGDLR756tj9Gk9pbuZSMuGdGZMjQmrR1JOg2gAxNRyN8hDBOzV-ea_tvD4YiD9yFXclpc3kBMsLmp7BxZX7A8lv-cHblqJ7y9iuR6AftRkV7KH4CdFdSG_8xLBEgz8BxCZG4qpd03Irfpn5oytjHpZA9UqnwgYklm292Q_3GSxAZjOG0FKVX_QFQ0ao5tREMNoNxZUo1peW4AhN4DROC9ROnAPPtwkmCDWQnp0g36IKCI3sPuqGV8TvU2vfZOQibNCMubCW1Hr4Hf4vJUzNMK9rcdwVpnQDgqJyxuj2lYhTEb2ioWI7M1w8aLknfPl2OqPZDJXlLebxesRTnKriJWY24vuPLiS_k8r8e4m5-MQakQ2bwO3Cs_hGNv8KBxAgdmvBFc7MbOykEuKxI6AjFfq-Q31CDhsUqwh7aormjgG4WDYStatGeM3YbXmsckkNMMGmKAfgOn2e-XN6ealWV2zOpAgovfvopiz5py7DWIjLs5VvD6f5SfPcR9utrbX3ePVKYDfIJHGHNncmDxW4VHTXQy1cW1OOL0eedgb9ehEQs4f15tRRE9Wqu5ZfwbniuHKMJ81BJIV_z5ghmT9CDSMQvHVn5ooj5RRgM5OumDbnksS5bSawwzist7oO3cZB2Ihx2GM9vWuDa0UsYX6fdgZnDQSug-zSQri5-FakogTy1ez1NTJdDmjGx8E2lgSw2A77MEBwCztpSixF9kyx05SCJxuWT8aonmCmC_nUiIEQ2s5IHoXossfbwPgDKiA8xMi3XJ-OljE1wUPAy_thGu7yUXhVLbzldz09e6NCbi-k4AbxAmFO6gRPd1ZCpQwXHoPnnhoDrGbxRHqWmQ0oB7wAE-3kOcEbrmMgP6QXQHAeSv9l4RGwovz6bGPOSIkAllSnkmX3tJFBDHvl-wyzo_lM855I9WBVJMXuUobvR2FCkJBaClKXKmqLA7xBtiBtCiRY_S3hSUI_9L43Pq_T-TL1Y11YxDEHTtiEn34X9xIXCrnVd-GptewTksRu0FaFYmiNT5GJQJPe4GRyOZksjzV-fqY7QZi_IHSSbH7-C4SHHj78GyOXMiMkwYmDjnAtGWLJkisiSiJYypEMwOBrWjYp6mDFnaRkA9pN9-dIimHkOBvqmvGLj1IizOxCdxELsgOkQri6dDG4IpTkBSLX5ELYryi7IRsOng0xmS8v-aBoLps1HxCYgyCalFYeDJ8OS8TxmLbj6hWlbs5LADUNzYAacGKK3rx-Zg2EOlV6sdzx9paVrBoWevS-G3uAME6e6zIsizZw83JVI_IlHkky5Pbn0zEgNhJRdOGV1TeI4d9CFLHIjvoaU_I4RuE_OEGk_5vmtFsNf9SEZSekEwLg0u77xVkrs9s-GC1nVOZnYihYfOgadgqlBAnzStVAwFkB2nb_GOVnWkD881DtjuipD0LY_3YBRe9olvY2DH7gNTAv7pHhg-0lQS_t2TRlcw0v841CGwPqx7vxZpO6LV-w_PuOR2MkUz2-dtxd1u3jpu1EsGkooq4r7XwmBm8NFPn_htG9NNDNgXYS7rPhayBQvNzN6l63Kcv7-qg4Mj5S6856kDwJ-U5gFY65j2CWZ58re541Wftiy64zL_vxc_YCOMyDzaxg52g3KkfYWoAytE-vVLcU1btqEMbwrs4kF_rbejKNLzXS22mfyZ85bpQr3v_71z3_9w23vcsxq-f69OdyA6KjeMBNabDMmT7iAyQmzoed7v_P-Auhy2tdWlD7Xc4_TWz7O13Q2AQvHA6e0Bs3utK6ZpyfgPGF2rOfGbPac5n45hJf7_OKxyevbJJiAc_vUR-Gf73wUBqeKxhVIH2FPScz01ZEKuavEvHlcFbuFlCJBpPbpjBTGsFrFcCDtODIs9ng_i31ob21iXscTnuvJTHmU4irKPOvx0aXjzKLRj1vpd6KsUaLPqnp6uN23fGPleA6SWW_Po5L4eUJ3r5m4VdCSv5mRVJ1tQe_XWPKt7xryekToZzRWKdgENUxNFG0oRCepVgkLl0jpdr7qaIWaq9oaEFbXFNXtM5zNSnL2fzC_S1NucvBHOX8Vouyh159Ck1mRE6l1WKz_nXLbekqPcyv_YiWs9EqC7M55Wj8KDoXmBG_X3g8SGIrIAYJ3j3eOsTmcJn5CBhOh1vINhSpffWxToBESoWwUuMtTmRTE9kQI4IzJdHaLGb3llrhUPjRZUCXObVtgl7xDdVHr9ZvuoN7y86Pw5Ei3QTjlG8iEKbV1Wy0aoMNcUvcV__l6c6w873nBP7UK9SDmvwenRUn8fHOYf32OnhF0x28bBdqZR_aZWMncXxw_-hL4qDZYGOW5XM7HjmKuo6Ut4xPwpwOxoHzgqU9HlFHvxh8Zj6IL8c9i91XS17I8vDeD1lDjffrAgqHEfsPz6Rv9OyqRO32Euxo_42Gf_MWRNKlT3CEZSyBqFEnH_9_8__4fQpW8SNoLAAA=";

    // Get models object to access enums for embed configuration
    var models = window['powerbi-client'].models;

    var config = {
        type: 'qna',
        tokenType: models.TokenType.Embed,
        accessToken: accessToken,
        embedUrl: embedUrl,
        datasetIds: [datasetId],
        viewMode: 1
//models.QnAMode.Interactive
        //,  question: "What is sales revenue by quarter and sales region as stacked area chart"
    };


    // Get a reference to the embedded report HTML element
    var embedContainer = document.getElementById('qnaContainer');

    // Embed the report and display it within the div container.
    var embeddedObject = powerbi.embed(embedContainer, config);

</script>

Error:

Uncaught Error: Attempted to embed component of type: qna but did not find any matching component. Please verify the type you specified is intended.
at Service.embedNew (service.ts:235)
at Service.embed (service.ts:210)

attempted to embed component of type:

Embedding of Reports and Dashboards work fine. Its just the QnA which has this issue, and makes me think if I need to include anything more than powerbi.js ?

<script src="~/js/powerbi.js"></script>

Thank you.

Dheeraj

[TedPattison · Accepted solution]

Is your version of powerbi.js up to date? Could it be you are using an older version of powerbi.js before the qna support was added?

The current version is v2.6.5

[djuvvadi]

That was it, I was always using Nuget to update the PowerBI.Javascript to latest but didn't check the actual powerbi.js which was v2.3.1. Thank you!

Now QnA object seems to render but there is an 401 - Unauthorized.

QnA embedded401 - Unauthorized

[TedPattison]

Are you supplying server-side code to generate an access token like this?

GenerateTokenRequest generateTokenRequestParameters = new GenerateTokenRequest(accessLevel: "view");

  string embedToken = pbiClient.Datasets.GenerateTokenInGroup(workspaceId, 
                                                              dataset.Id, 
                                                              generateTokenRequestParameters).Token;

Make sure the dataset id in this code which generates the embed token matches is the same dataset id that you are using in the client-side embed configuration to display the Q&A experience. That would be my first guess at what is wrong.

[djuvvadi]

Yes, I do supply server-side code to generate access:

var tokenResponse = await client.Datasets.GenerateTokenInGroupAsync(firstPBIGroupID,
                                                                    dataset.Id, 
                                                                    generateTokenRequestParameters);


 // Generate Embed Configuration.
 result.EmbedToken = tokenResponse;
 result.EmbedUrl = "https://app.powerbi.com/qnaEmbed?groupId=" + firstPBIGroupID; 
 result.Id = dataset.Id; 

return View(result);

client-side:

   // Read embed application token from Model
    var accessToken = "@Model.EmbedToken.Token";

    // Read embed URL from Model
    var embedUrl = "@Html.Raw(Model.EmbedUrl)";

    // Read dataset Id from Model
    var embedDatasetId = "@Model.Id";

    // Get models. models contains enums that can be used.
    var models = window['powerbi-client'].models;

    // Embed configuration used to describe the what and how to embed.
    var config = {
        type: 'qna',
        tokenType: models.TokenType.Embed,
        accessToken: accessToken,
        embedUrl: embedUrl,
        datasetIds: [embedDatasetId],
        viewMode: models.QnaMode.Interactive
    };

    // Get a reference to the embedded Q&A HTML element
    var qnaContainer = $('#qnaContainer')[0];

    // Embed the QNA and display it within the div container.
    var qna = powerbi.embed(qnaContainer, config);

I tried different datasets but all have the same issue, I even made sure the powerbi pro-user who is used for access is given "Read and Reshare" access.