Aracılığıyla paylaş

Öğretici: Kuruluşunuz için bir uygulamaya Power BI raporu ekleme

Bu öğretici, kuruluşunuz için ekleme (aynı zamanda kullanıcı verilerin sahibidir olarak da bilinir) çözümünün bir parçası olarak, bir .NET 5.0 uygulamasına Power BI raporunun nasıl ekleneceğini açıklar. Kuruluş çözümünüz için bir eklemede, uygulama kullanıcılarınızın kendi kimlik bilgileriyle Power BI'da kimlik doğrulaması yapmanız gerekir.

Bu öğreticide şunları eklemeyi öğreneceksiniz:

  • Power BI raporu
  • Kuruluşunuz için ekleme uygulamasına
  • .NET 5.0 kullanma
  • Kütüphane Microsoft.Identity.Web ile (bu kütüphane .NET Core'da da desteklenir)

Not

Bu öğreticide kullanılan çözümün tamamı DOTNET5-UserOwnsData-Tutorial GitHub deposunda sağlanır.

Önkoşullar

Kaynaklar

Bu öğreticide şunları kullanacaksınız:

Metot

Power BI içeriğini kuruluşunuza yönelik bir ekleme çözümüne eklemek için şu adımları izleyin:

  1. Microsoft Entra uygulamanızı yapılandırma
  2. Ekleme parametresi değerlerini alma
  3. Gerekli NuGet paketlerini ekleme
  4. Sunucu tarafı kimlik doğrulamasını etkinleştirme
  5. Uygulamanızın istemci tarafını oluşturma
  6. Uygulamanızı çalıştırma

1. Adım - Microsoft Entra uygulamanızı yapılandırma

Web uygulamanız Power BI'ı çağırdığında, Power BI REST API'lerini çağırmak ve raporlar, panolar veya kutucuklar gibi Power BI öğelerini eklemek için bir Microsoft Entra belirteci gerekir.

Microsoft Entra uygulamanız yoksa Bir Microsoft Entra uygulamasını Power BI ile kullanmak üzere kaydetme başlığındaki yönergeleri kullanarak bir uygulama oluşturun.

Microsoft Entra uygulamanızı yapılandırmak için Microsoft Entra uygulamanızı yapılandırma başlığındaki yönergeleri izleyin.

2. Adım - Ekleme parametresi değerlerini alma

Raporunuzu eklemek için aşağıdaki değerlere ihtiyacınız vardır:

Alan adı ve kiracı kimliği

Eğer etki alanınızı veya kiracı kimliğinizi bilmiyorsanız, Microsoft Entra kiracı kimliğini ve birincil etki alanı adını bulma sayfasına bakın.

Not

Kullanıcının içeriğini farklı bir kiracıya (konuk kullanıcı) eklemek için parametresini authorityUri ayarlamanız gerekir.

Müşteri Kimliği

İstemci kimliği GUID'sini ( uygulama kimliği olarak da bilinir) almak için şu adımları izleyin:

  1. Microsoft Azure'da oturum açın.

  2. Uygulama kayıtları arayın ve Uygulama kayıtları bağlantısını seçin.

  3. Power BI içeriğinizi eklemek için kullandığınız Microsoft Entra uygulamasını seçin.

  4. Genel Bakış bölümünden Uygulama (istemci) Kimliği GUID'sini kopyalayın.

İstemci sırrı

İstemci gizli anahtarını almak için şu adımları izleyin:

  1. Microsoft Azure'da oturum açın.

  2. Uygulama kayıtları arayın ve Uygulama kayıtları bağlantısını seçin.

  3. Power BI içeriğinizi eklemek için kullandığınız Microsoft Entra uygulamasını seçin.

  4. Yönet altında Sertifikalar ve Gizli Diziler'i seçin.

  5. İstemci sırlarının altında Yeni istemci sırrını seçin.

  6. İstemci gizli dizisi ekle açılır penceresinde, uygulama gizli diziniz için bir açıklama sağlayın, uygulama gizli dizisinin süresinin ne zaman doleceğini seçin ve Ekle'yi seçin.

  7. İstemci gizli dizileri bölümünden, yeni oluşturulan uygulama gizli dizisinin Value sütunundaki dizeyi kopyalayın. İstemci gizli anahtarı değeri, istemci kimliğinizdir.

Not

İstemci gizli anahtarı değerini ilk göründüğü anda kopyaladığınızdan emin olun. Bu sayfadan uzaklaştıktan sonra istemci sırrı artık görüntülenmeyecek ve değerini bir daha görüntüleyemezsiniz.

Çalışma Alanı Kimliği

Çalışma alanı kimliği GUID'sini almak için şu adımları izleyin:

  1. Power BI hizmetinde oturum açma.

  2. Eklemek istediğiniz raporu açın.

  3. URL'den GUID'yi kopyalayın. GUID, /groups/ ve /reports/ arasındaki sayıdır.

    Power BI hizmeti URL'sinde çalışma alanı kimliği GUID'sini gösteren ekran görüntüsü

Not

Çalışma alanı kimliğini program aracılığıyla almak için Get Groups API'sini kullanın.

Rapor Kimliği

Rapor kimliği GUID'sini almak için şu adımları izleyin:

  1. Power BI hizmetinde oturum açma.

  2. Eklemek istediğiniz raporu açın.

  3. URL'den GUID'yi kopyalayın. GUID, /reports/ ve /ReportSection arasındaki sayıdır.

    Power BI hizmeti U R L'de rapor kimliği GUID'sini gösteren ekran görüntüsü

Not

Rapor kimliğini program aracılığıyla almak için Gruptaki Raporları Al API'sini kullanın.

3. Adım - Gerekli NuGet paketlerini ekleme

Başlamadan önce, Microsoft.Identity.Web ve Microsoft.PowerBI.Api NuGet paketlerini uygulamanıza eklemeniz gerekir.

Aşağıdaki NuGet paketlerini uygulamanıza ekleyin:

  • VS Code'da bir terminal açın ve aşağıdaki kodu yazın.

  • Visual Studio'da AraçlarNuGet Paket Yöneticisi>Paket Yöneticisi Konsolu ve aşağıdaki kodu yazın.

dotnet add package Microsoft.Identity.Web -v 0.3.0-preview
dotnet add package Microsoft.Identity.Web.UI -v 0.3.0-preview
dotnet add package Microsoft.PowerBI.Api

Uygulamanız daha önce kimlik doğrulaması yapmak için kullandıysa Microsoft.AspNetCore , şu komutu yazarak bu paketi projenizden kaldırın:

dotnet remove package Microsoft.AspNetCore.Authentication.AzureAD.UI

4. Adım - Sunucu tarafı kimlik doğrulamasını etkinleştirme

Aşağıdaki tabloda yer alan dosyaları oluşturarak veya değiştirerek uygulamanızda sunucu tarafı kimlik doğrulamasını etkinleştirin.

Dosya Kullan
Startup.cs Microsoft.Identity.Web Kimlik doğrulama hizmetini başlatma
appsettings.json Kimlik doğrulaması ayrıntıları
PowerBiServiceApi.cs Microsoft Entra belirtecini alma ve meta verileri ekleme
HomeController.cs Ekleme verilerini görünüme model olarak geçirme

Başlangıç dosyanızı destekleyecek şekilde yapılandırma Microsoft.Identity.Web

tarafından sağlanan kimlik doğrulama hizmetini düzgün bir şekilde başlatmak için Startup.cs içindeki kodu değiştirin.

Uygulamanızın Startup.cs dosyasına aşağıdaki kod parçacığını ekleyin.

Not

içindeki ConfigureServices kod birkaç önemli şeyi gerçekleştirir:

  1. çağrısı AddMicrosoftWebAppCallsWebApi, erişim belirteçleri (Microsoft Entra belirteçleri) almak için Microsoft Kimlik Doğrulama Kitaplığı'nı yapılandırıyor.
  2. AddInMemoryTokenCaches çağrısı, Microsoft Kimlik Doğrulama Kitaplığı'nın erişim belirteçlerini ve yenileme belirteçlerini gizlice önbelleğe almak için kullanacağı bir belirteç önbelleğini yapılandırır.
  3. "services.AddScoped(typeof(PowerBiServiceApi)) çağrısı, PowerBiServiceApi sınıfını bağımlılık enjeksiyonu kullanılarak diğer sınıflara eklenebilen bir servis sınıfı olarak yapılandırır."
using Microsoft.Identity.Web;
using Microsoft.Identity.Web.TokenCacheProviders;
using Microsoft.Identity.Web.TokenCacheProviders.InMemory;
using Microsoft.Identity.Web.UI;
using UserOwnsData.Services;

namespace UserOwnsData {

  public class Startup {

    public Startup (IConfiguration configuration) {
      Configuration = configuration;
    }

    public IConfiguration Configuration { get; }

    // This method gets called by the runtime. Use this method to add services to the container.
    public void ConfigureServices (IServiceCollection services) {

      services
        .AddMicrosoftIdentityWebAppAuthentication(Configuration)
        .EnableTokenAcquisitionToCallDownstreamApi(PowerBiServiceApi.RequiredScopes)
        .AddInMemoryTokenCaches();

      services.AddScoped (typeof (PowerBiServiceApi));

      var mvcBuilder = services.AddControllersWithViews (options => {
        var policy = new AuthorizationPolicyBuilder()
          .RequireAuthenticatedUser()
          .Build();
        options.Filters.Add (new AuthorizeFilter (policy));
      });

      mvcBuilder.AddMicrosoftIdentityUI();

      services.AddRazorPages();

    }
  }
}

Kimlik doğrulama ayrıntıları dosyası oluşturma

Bu öğreticide, appsettings.json dosya, istemci kimliği ve istemci sırrı gibi hassas bilgiler içerir. Güvenlik nedeniyle, bu bilgilerin ayarlar dosyasında tutulmasını önermeyiz. Uygulamanıza eklerken, bu bilgileri tutmak için Azure Key Vault gibi daha güvenli bir yöntem kullanmayı göz önünde bulundurun.

  1. Projenizde yeni bir dosya oluşturun ve appsettings.json olarak adlandırınız.

  2. appsettings.json aşağıdaki kodu ekleyin:

    {
    "AzureAd": {
        "Instance": "https://login.microsoftonline.com/",
        "Domain": "",
        "TenantId": "",
        "ClientId": "",
        "ClientSecret": "",
        "CallbackPath": "/signin-oidc",
        "SignedOutCallbackPath": "/signout-callback-oidc"
    },
    "PowerBi": {
        "ServiceRootUrl": "https://api.powerbi.com"
    },
    "Logging": {
        "LogLevel": {
            "Default": "Information",
            "Microsoft": "Warning",
            "Microsoft.Hosting.Lifetime": "Information"
        }
    },
    "AllowedHosts": "*"
}

  3. 2. Adım - Ekleme parametresi değerlerini alma bölümünden alınan ekleme parametresi değerlerini doldurun.

Not

Önceki kod parçacığında PowerBi:ServiceRootUrl parametresi, Power BI hizmeti için temel URL'yi izlemek amacıyla özel bir yapılandırma değeri olarak eklenmiştir. Microsoft genel bulutundaki Power BI hizmeti için programlama yaparken URL https://api.powerbi.com/ şeklindedir. Ancak, Power BI hizmeti kök URL'si kamu bulutu gibi diğer bulutlarda farklı olacaktır. Bu nedenle, bu değer bir proje yapılandırma değeri olarak depolanır, bu nedenle gerektiğinde kolayca değiştirilebilir.

Microsoft Entra erişim jetonunu alın ve Power BI hizmetini çağırın

Power BI içeriğini (raporlar ve panolar gibi) eklemek için uygulamanızın bir Microsoft Entra belirteci alması gerekir. Belirteci almak için bir yapılandırma nesnesi gerekir.

Bu bölümdeki kod .NET Core bağımlılık ekleme desenini kullanır. Sınıfınızın bir hizmet kullanması gerektiğinde, bu hizmet için bir oluşturucu parametresi ekleyebilirsiniz ve .NET Core çalışma zamanı, hizmet örneğini çalışma zamanında geçirme işlemini üstlenir. Bu durumda, oluşturucu, .NET Core yapılandırma hizmetinin bir örneğini IConfiguration parametresiyle enjekte eder ve bu parametre, appsettings.json dosyasından PowerBi:ServiceRootUrl yapılandırma değerini almak için kullanılır. ITokenAcquisition adlı tokenAcquisition parametresi, Microsoft.Identity.Web kitaplığı tarafından sağlanan Microsoft kimlik doğrulama hizmetine bir referans içerir ve Microsoft Entra ID'den erişim belirteçlerini elde etmek için kullanılır.

RequiredScopes alanı, Power BI hizmeti API tarafından desteklenen bir temsilci izinler seti içeren bir dize dizisi içerir. Uygulamanız, bir Microsoft Entra belirteci almak için ağ üzerinden çağrı yaptığında, Microsoft Entra ID'nin bunları erişim belirtecine dahil edebilmesi için bu temsilci izinler kümesini geçirir.

Not

Microsoft Entra uygulamanızın web uygulamanızın gerektirdiği kapsamlarla yapılandırıldığını doğrulayın. Daha fazla bilgi için bkz . Microsoft Entra uygulamanızın izinlerini değiştirme.

  1. Uygulamanızın projesinde Hizmetler adlı yeni bir klasör oluşturun.

  2. Hizmetler klasöründe PowerBiServiceApi.cs adlı yeni bir dosya oluşturun.

  3. aşağıdaki kodu PowerBiServiceApi.cs ekleyin.

    using Microsoft.Identity.Web;
using Microsoft.PowerBI.Api;
using Microsoft.PowerBI.Api.Models;
using Microsoft.Rest;
using Newtonsoft.Json;

namespace UserOwnsData.Services {

  // A view model class to pass the data needed to embed a single report.
  public class EmbeddedReportViewModel {
     public string Id;
     public string Name;
     public string EmbedUrl;
     public string Token;
  }

public class PowerBiServiceApi {
     private ITokenAcquisition tokenAcquisition { get; }
     private string urlPowerBiServiceApiRoot { get; }

     public PowerBiServiceApi(IConfiguration configuration, ITokenAcquisition tokenAcquisition) {
         this.urlPowerBiServiceApiRoot = configuration["PowerBi:ServiceRootUrl"];
         this.tokenAcquisition = tokenAcquisition;
     }

     public static readonly string[] RequiredScopes = new string[] {
         "https://analysis.windows.net/powerbi/api/Report.Read.All"
     };

    // A method to get the Azure AD token (also known as 'access token')
     public string GetAccessToken() {
         return this.tokenAcquisition.GetAccessTokenForUserAsync(RequiredScopes).Result;
     }

     public PowerBIClient GetPowerBiClient() {
         var tokenCredentials = new TokenCredentials(GetAccessToken(), "Bearer");
         return new PowerBIClient(new Uri(urlPowerBiServiceApiRoot), tokenCredentials);
     }

     public async Task<EmbeddedReportViewModel> GetReport(Guid WorkspaceId, Guid ReportId) {
         PowerBIClient pbiClient = GetPowerBiClient();
         // Call the Power BI Service API to get embedding data
   var report = await pbiClient.Reports.GetReportInGroupAsync(WorkspaceId, ReportId);

   // Return report embedding data to caller
   return new EmbeddedReportViewModel {
    Id = report.Id.ToString(),
    EmbedUrl = report.EmbedUrl,
    Name = report.Name,
    Token = GetAccessToken()
   };
  }

 }

}

HomeController.cs dosyasını değiştirme

Bu kod örneğinde bağımlılık ekleme özelliğini kullanırsınız. PowerBiServiceApi sınıfını bir hizmet olarak ConfigureServices yönteminde services.AddScoped çağırarak kaydettiniz. Oluşturucuya bir PowerBiServiceApi parametre ekleyebilirsiniz ve .NET Core çalışma zamanı bir PowerBiServiceApi örnek oluşturup oluşturucuya geçirme işlemini üstlenir.

Denetleyiciler klasöründen HomeController.cs dosyasını açın ve aşağıdaki kod parçacığına ekleyin:

using Microsoft.AspNetCore.Authorization;
using Microsoft.AspNetCore.Mvc;
using Microsoft.Extensions.Logging;
using UserOwnsData.Models;
using UserOwnsData.Services;

namespace UserOwnsData.Controllers {
    [Authorize]
    public class HomeController : Controller {

        private PowerBiServiceApi powerBiServiceApi;

        public HomeController (PowerBiServiceApi powerBiServiceApi) {
            this.powerBiServiceApi = powerBiServiceApi;
        }

        [AllowAnonymous]
        public IActionResult Index() {
            return View();
        }

        public async Task<IActionResult> Embed() {
            Guid workspaceId = new Guid("11111111-1111-1111-1111-111111111111");
            Guid reportId = new Guid("22222222-2222-2222-2222-222222222222");
            var viewModel = await powerBiServiceApi.GetReport(workspaceId, reportId);
            return View(viewModel);
        }

        [AllowAnonymous]
        [ResponseCache (Duration = 0, Location = ResponseCacheLocation.None, NoStore = true)]
        public IActionResult Error() {
            return View (new ErrorViewModel { RequestId = Activity.Current?.Id ?? HttpContext.TraceIdentifier });
        }
    }
}

5. Adım - Uygulamanızın istemci tarafını oluşturma

İstemci tarafı uygulaması için aşağıdaki tabloda dosyaları oluşturmanız veya değiştirmeniz gerekir.

Dosya Kullan
embed.js İstemci tarafı JavaScript kodunu içerir
Embed.cshtml Uygulamanızın belge nesne modelini (DOM) ve raporu eklemek için bir DIV içerir

Eklenmiş raporunuz için kapsayıcı oluşturma

Embed.cshtml dosyasını oluşturun, bu dosya gömülü raporunuz için bir konteyner olarak kullanılan bir div elemanı içerir ve üç script içerir.

  1. Giriş Sayfasını Görüntüle>klasöründe Embed.cshtml adlı bir dosya oluşturun.

  2. Embed.cshtml dosyasına aşağıdaki kod parçacığını ekleyin.

    @model UserOwnsData.Services.EmbeddedReportViewModel;

<div id="embed-container" style="height:800px;"></div>

@section Scripts {

    <!-- powerbi.min.js is the JavaScript file that loads the client-side Power BI JavaScript API library.
    Make sure that you're working with the latest library version.
    You can check the latest library available in https://cdnjs.com/libraries/powerbi-client -->
    <script src="https://cdn.jsdelivr.net/npm/powerbi-client@2.21.0/dist/powerbi.min.js"></script>

    <!-- This script creates a JavaScript object named viewModel which is accessible to the JavaScript code in embed.js. -->
    <script> 
        var viewModel = {
            reportId: "@Model.Id",
            embedUrl: "@Model.EmbedUrl",
            token: "@Model.Token"
        }; 
    </script>

    <!-- This script specifies the location of the embed.js file -->
    <script src="~/js/embed.js"></script>
}

Raporunuzu eklemek için istemci tarafı JavaScript ekleme

Power BI içeriği eklemek için bir yapılandırma nesnesi oluşturmanız gerekir. Yapılandırma nesnesi oluşturma hakkında daha fazla bilgi edinmek için bkz . Rapor ekleme.

Bu bölümde, değişkenini kullanarak raporunuzu eklemek için yapılandırma nesnesiyle embed.jsmodelsbir JavaScript dosyası oluşturacaksınız.

models, window['powerbi-client'].models çağrılarak başlatılır. models değişkeni, , models.Permissions.Allve models.TokenType.Aadgibi models.ViewMode.Viewyapılandırma değerlerini ayarlamak için kullanılır.

powerbi.embed işlevi raporunuzu gömmek için models yapılandırma nesnesini kullanır.

  1. wwwroot>js klasöründe embed.js adlı bir dosya oluşturun.

  2. aşağıdaki kod parçacığını embed.js dosyasına ekleyin.

    $(function(){
    // 1 - Get DOM object for div that is report container
    let reportContainer = document.getElementById("embed-container");

    // 2 - Get report embedding data from view model
    let reportId = window.viewModel.reportId;
    let embedUrl = window.viewModel.embedUrl;
    let token = window.viewModel.token

    // 3 - Embed report using the Power BI JavaScript API.
    let models = window['powerbi-client'].models;
    let config = {
        type: 'report',
        id: reportId,
        embedUrl: embedUrl,
        accessToken: token,
        permissions: models.Permissions.All,
        tokenType: models.TokenType.Aad,
        viewMode: models.ViewMode.View,
        settings: {
            panes: {
                filters: { expanded: false, visible: true },
                pageNavigation: { visible: false }
            }
        }
    };

    // Embed the report and display it within the div container.
    let report = powerbi.embed(reportContainer, config);

    // 4 - Add logic to resize embed container on window resize event
    let heightBuffer = 12;
    let newHeight = $(window).height() - ($("header").height() + heightBuffer);
    $("#embed-container").height(newHeight);
    $(window).resize(function() {
        var newHeight = $(window).height() - ($("header").height() + heightBuffer);
        $("#embed-container").height(newHeight);
    });

});

6. Adım : Uygulamanızı çalıştırma

Bu öğreticide listelenen tüm ayarlamaları yaptıktan sonra uygulamanızı çalıştırmaya hazır olursunuz. Uygulamanızı yürütür ve Power BI raporunuzun katıştırılmış şekliyle denemeler yapın. İstemci tarafı API'lerini kullanarak uygulamanızı geliştirmek için Power BI tümleşik analiz İstemci API'lerini kullanabilirsiniz.

Uygulamanız hazır olduğunda, eklenmiş uygulamanızı üretim ortamına taşıyabilirsiniz.

İlgili içerik

  • Last updated on