概要

「レポートをアプリに統合する」の手順 2Power BI レポートを取得する」で、Power BI タイルを取得します。 この手順では、レポートを IFrame に読み込みます。

IFrame にレポートを読み込むには、IFramesrc 属性をレポートembedURL プロパティに設定し、視覚的なレポートへアクセスするためのアクセス トークンでメッセージを投稿する onload ハンドラーを作成します。 以下は、レポートを IFrame に読み込むための JavaScript コードです。

レポートを IFrame に読み込む

//Configure IFrame for the report after you have an Access Token. See Default.aspx.cs to learn how to get an Access Token
window.onload = function () {
    if ("" != document.getElementById('MainContent_accessToken').value)
    {
        var iframe = document.getElementById('iFrameEmbedReport');

        // To load a Report do the following:
        // Set the IFrame source to the EmbedUrl from the Get Reports operation
        iframe.src = document.getElementById('MainContent_ReportEmbedUrl').value;

        // Add an onload handler to submit the access token
        iframe.onload = postActionLoadReport;
    }
};

// Post the access token to the IFrame
function postActionLoadReport() {

    // Construct the push message structure
    // this structure also supports setting the reportId, groupId, height, and width.
    // when using a report in a group, you must provide the groupId on the iFrame SRC
    var m = {
        action: "loadReport",
        accessToken: document.getElementById('MainContent_accessToken').value
    };
    message = JSON.stringify(m);

    // push the message.
    iframe = document.getElementById('iFrameEmbedReport');
    iframe.contentWindow.postMessage(message, "*");;
}

レポートの統合サンプル」をダウンロードして実行する場合、サンプルは次のようになります。

まとめ

このチュートリアルでは、レポートを取得し、さらに IFrame にレポートを読み込むことにより、レポートをアプリに統合する方法について学びました。 ASP.NET web アプリにレポートを埋め込むすべての作業パーツを表示する、完全なレポートの統合サンプルをダウンロードすることができます。 完全なレポートをアプリに統合するコード リストを表示することもできます。

参照

Power BI にサインアップする
レポートをアプリに統合するチュートリアル
レポートの統合サンプル
レポートの統合サンプルを構成する
レポートの取得操作
他にわからないことがある場合は、 Power BI コミュニティを利用してください