Forum Discussion

Anonymous's avatar
Anonymous
Not applicable
7 years ago
Solved

Embedding reports from one application (which has embed logic) in another application in a iframe

We have a working application with embedds Power Bi reports (app owns data approach) Our problem: We would like to embed the reports on another site in the same company (another html page in a di...
  • Jayendran's avatar
    7 years ago

    Hi Anonymous ,

     

    Instead of using iframe could you pls try the PowerBI Javascript to embed the report

     

    https://github.com/microsoft/PowerBI-Developer-Samples/blob/master/App%20Owns%20Data/PowerBIEmbedded_AppOwnsData/Views/Home/EmbedReport.cshtml#L62

     

    <script>
        // Read embed application token from Model
        var accessToken = "@Model.EmbedToken.Token";
        // Read embed URL from Model
        var embedUrl = "@Html.Raw(Model.EmbedUrl)";
        // Read report Id from Model
        var embedReportId = "@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.
        // This object is used when calling powerbi.embed.
        // This also includes settings and options such as filters.
        // You can find more information at https://github.com/Microsoft/PowerBI-JavaScript/wiki/Embed-Configuration-Details.
        var config = {
            type: 'report',
            tokenType: models.TokenType.Embed,
            accessToken: accessToken,
            embedUrl: embedUrl,
            id: embedReportId,
            permissions: models.Permissions.All,
            settings: {
                filterPaneEnabled: true,
                navContentPaneEnabled: true
            }
        };
        // Get a reference to the embedded report HTML element
        var reportContainer = $('#embedContainer')[0];
        if ("@Model.Username" != "") {
            $("#RLS").prop('checked', true);
            $("#RLSdiv").show();
        }
        else
        {
            $("#RLS").prop('checked', false);
            $("#RLSdiv").hide();
        }
        if ("@Model.IsEffectiveIdentityRequired.GetValueOrDefault()" == "True") {
            $("#noRLSdiv").hide();
            $("#RLS").removeAttr("disabled");
            $("#RLS").change(function () {
                if ($(this).is(":checked")) {
                    $("#RLSdiv").show(300);
                } else {
                    $("#RLSdiv").hide(200);
                }
            });
        }
        else
        {
            $("#noRLSdiv").show();
        }
        // Embed the report and display it within the div container.
        var report = powerbi.embed(reportContainer, config);
    </script>

    Basically you need to pass the embed token from your Common API to the Customer App