簡介

步驟 2 將報表整合到應用程式的取得 Power 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 社群