Forum Discussion

djuvvadi's avatar
djuvvadi
Regular Visitor
7 years ago
Solved

QnA Embedding error

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...
  • TedPattison's avatar
    TedPattison
    7 years ago

    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's avatar
djuvvadi
Regular Visitor
7 years ago

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's avatar
TedPattison
Microsoft Employee
7 years ago

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's avatar
    djuvvadi
    Regular Visitor
    7 years ago

    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's avatar
      TedPattison
      Microsoft Employee
      7 years ago

      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's avatar
        djuvvadi
        Regular Visitor
        7 years ago

        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.