Schnellstart: Blazor Server-Web-API-Beispiel (C #)

Artikel
11/16/2023

In diesem Schnellstart erstellen Sie eine Blazor Server-Anwendung, um mithilfe der Web-API eine Verbindung mit Ihrer Microsoft Dataverse-Umgebung herzustellen.

Sie authentifizieren sich und verwenden HttpClient, um eine GET-Anforderung mit der WhoAmI-Funktion zu senden. Die Antwort ist ein WhoAmIResponse ComplexType . Nach Beendigung des Aufrufs werden die WhoAmIResponse-Eigenschaftswerte angezeigt.

Hinweis

Dies ist ein sehr einfaches Beispiel, um zu zeigen, wie man mit einem Minimum an Code verbunden wird.

Anforderungen

Visual Studio 2022 mit der ASP.NET und Webentwicklung Workload.
.NET 7.0 SDK.
Vertrautheit mit dem Microsoft Azure-Portal.
Internetverbindung.
Gültiges Benutzerkonto für eine Dataverse-Instanz.
Administratorzugriff zur Gewährung von Anwendungsregistrierungen.
URL zur Dataverse-Umgebung, mit der Sie eine Verbindung herstellen möchten.
Grundlegendes Verständnis der Visual C#-Sprache.

Hinweis

Zum Authentifizieren müssen Sie eine in Microsoft Entra ID registrierte App haben. Die Registrierung erfolgt automatisch im Rahmen der Vorlagenerstellung, erfordert jedoch zusätzliche Aktualisierungen im Azure-Portal.

Ein Visual Studio-Projekt erstellen

Öffnen Sie Visual Studio 2022 und wählen Sie Neues Projekt erstellen aus.
Suchen Sie im Dialogfeld Neues Projekt erstellen nach Blazor Server App. Wählen Sie die Vorlage und dann Weiter aus.
Im Dialog Konfigurieren Sie Ihr neues Projekt legen Sie den Projektnamen und den Standort fest. Wählen Sie dann Weiter.

In diesem Beispiel verwenden wir DataverseWebApiBlazorServerQuickStart als Projektname.
Legen Sie im Dialogfeld Zusätzliche Informationen Framework und Authentifizierungstyp fest.

In diesem Beispiel ist das Framework .NET 7.0 (Standard Term Support).

Wichtig

Legen Sie den Authentifizierungstyp auf Microsoft Identity Platform fest.
Wählen Sie Erstellen, um das Projekt zu erstellen.
Die Projektvorlage öffnet einen Dialog Erforderliche Komponenten . Wählen Sie Weiter aus.
Stellen Sie im Dialogfeld Microsoft-Identitätsplattform sicher, dass das ausgewählte Azure-Konto Berechtigungen hat, um Anwendungen in Microsoft Entra ID zu verwalten, und der ausgewählte Mandant Ihrer Power Platform-Umgebung zugeordnet ist.
Wählen Sie Neu erstellen aus.
Legen Sie im Dialog Eine Anwendung registrieren den Anzeigename fest und wählen Sie Registrieren aus, um den Dialog zu schließen.

In diesem Beispiel verwenden wir den Namen Dataverse Web Api Blazor Server Quick Start. Wir werden in einem späteren Schritt nach der Anwendung suchen, die diesen Namen verwendet.
Wählen Sie Weiter aus.

Hinweis

Dazu müssen Sie in diesem Schritt nichts tun.

Dieser Schritt bietet Funktionen zum Herstellen einer Verbindung mit Microsoft Graph oder einer anderen API, für diesen Schnellstart ist jedoch keine Verbindung mit einer anderen API erforderlich.
Wählen Sie Weiter aus. In diesem Schritt werden die am Projekt vorgenommenen Änderungen zusammengefasst.
Klicken Sie auf Fertig stellen.

Das Dialogfeld Abhängigkeitskonfigurationsfortschritt zeigt die automatisierten Schritte, die von der Vorlage ausgeführt werden, um die Anwendung zu registrieren.
Wählen Sie Schließen aus, um das Dialogfeld zu schließen.

Die Anwendung in Microsoft Entra ID konfigurieren

Die Visual Studio Vorlage hat eine registrierte Anwendung mit den von Ihnen bereitgestellten Informationen erstellt. Für die Verbindung mit Dataverse sind mehr Berechtigungen erforderlich.

Im Power Platform Admin Center wählen Sie Admin Center > Microsoft Entra ID aus.
Suchen Sie im Microsoft Entra Admin Center nach der Anwendung, die namentlich in App-Registrierungen erstellt wurde.
Öffnen Sie die Anwendung und wählen Sie API-Berechtigungen aus. Wählen Sie Berechtigung hinzufügen aus.
Wählen Sie im Bereich API-Berechtigungen anfordern die Registerkarte APIs, die meine Organisation verwendet aus und suchen Sie nach Dataverse.
Wählen Sie Dataverse aus, und die Dynamics CRM-API öffnet sich.
Wählen Sie die delegierte Berechtigung user_impersonation und dann Berechtigungen hinzufügen aus.
Wählen Sie Zertifikate und Geheimnisse und dann Neuer geheimer Clientschlüssel aus.
Geben Sie im Flyout Geheimer Clientschlüssel hinzufügen eine Beschreibung und eine Ablauf-Dauer ein, und wählen Sie dann Hinzufügen aus.

Wichtig

Kopieren Sie jetzt das Geheimnis. Sie können nicht darauf zugreifen, nachdem Sie diese Seite verlassen haben.

Öffnen Sie in in Ihrem Blazor Server-App-Projekt Visual Studio, öffnen Sie appsettings.json und fügen Sie einen ClientSecret Eintrag für den geheimen Wert hinzu. Die Inhalte der appsettings.json Datei sollten so aussehen:

{
"AzureAd": {
    "Instance": "https://login.microsoftonline.com/",
    "Domain": "<your org>.onmicrosoft.com",
    "TenantId": "<your tenantid>",
    "ClientId": "<your clientid>",
    "CallbackPath": "/signin-oidc",
    "ClientSecret": "<your secret>"
},
"Logging": {
    "LogLevel": {
    "Default": "Information",
    "Microsoft.AspNetCore": "Warning"
    }
},
"AllowedHosts": "*"
}

App bearbeiten

Um Aufrufe an Dataverse zu ermöglichen, müssen Sie drei Dateien in der Anwendung bearbeiten:

appsettings.json
Program.cs
Pages/FetchData.razor

appsettings.json

An mehreren Stellen in den anderen Dateien ist ein Verweis auf den Basis-URI erforderlich, der für den Zugriff auf die Dataverse Web-API verwendet wird. Durch das Hinzufügen dieser Daten zu appsettings.json können Sie diese Daten an einem Ort festlegen.

Fügen Sie unten "AllowedHosts": "*" hinzu, wenn <your org> die Basis-URL für den Zugriff auf Dataverse darstellt. Wenn Sie nicht sicher sind, was das ist, sehen Sie sich Web-API-URL und -Versionen an.

  "AllowedHosts": "*",
  "DataverseConfig": {
    "BaseUri": "https://<your org>.api.crm.dynamics.com/"
  }

Hinweis

Stellen Sie Folgendes sicher:

Fügen Sie das Komma nach "AllowedHosts": "*" hinzu, damit JSON gültig ist.
Beenden Sie den BaseUri Wert mit /,

Program.cs

Um auf den Wert der Web-API-Basis-URI in den Einstellungen zuzugreifen, fügen Sie die folgende Zeile kommentiert mit // Get BaseUri from appsettings.json in der Main-Methode unterhalb der Zeile hinzu:
var builder = WebApplication.CreateBuilder(args);
```
public static void Main(string[] args)
{
  var builder = WebApplication.CreateBuilder(args);

  // Get BaseUri from appsettings.json
  string dataverseBaseUri = builder.Configuration.GetSection("DataverseConfig").GetValue<string>("BaseUri");
```
Fügen Sie die folgenden zwei Zeilen unter der Zeile hinzu:
.AddMicrosoftIdentityWebApp(builder.Configuration.GetSection("AzureAd"))
```
// Add services to the container.
builder.Services.AddAuthentication(OpenIdConnectDefaults.AuthenticationScheme)
  .AddMicrosoftIdentityWebApp(builder.Configuration.GetSection("AzureAd"))
    .EnableTokenAcquisitionToCallDownstreamApi(new string[] { $"{dataverseBaseUri}user_impersonation" })
    .AddInMemoryTokenCaches();
```
- Die MicrosoftIdentityWebApiAuthenticationBuilder.EnableTokenAcquisitionToCallDownstreamApi Methode fügt Support für die Web-App hinzu, um Token für den Aufruf einer API zu erwerben. Durch Übergabe des user_impersonation-Bereichs kann der Benutzer der Fähigkeit zur Nutzung der Dataverse-Web-API zustimmen.
- AddInMemoryTokenCaches-Methode Aktiviert das Zwischenspeichern des für Anforderungen ausgestellten Tokens.

Pages/FetchData.razor

Die Standardkomponente Pages/FetchData.razor ruft einige Wettervorhersagedaten ab. Wir werden das komplett ersetzen.

Kopieren Sie den folgenden Code und ersetzen Sie den gesamten Code in Pages/FetchData.razor ein :

@page "/fetchdata"
@using Microsoft.Identity.Client;
@using Microsoft.Identity.Web
@using System.Text.Json;
@inject MicrosoftIdentityConsentAndConditionalAccessHandler ConsentHandler
@inject IHttpClientFactory HttpClientFactory
@inject Microsoft.Identity.Web.ITokenAcquisition TokenAcquisitionService
@inject IConfiguration configuration;

<PageTitle>WhoAmI</PageTitle>

<h1>WhoAmI</h1>

<p>This component demonstrates fetching data from Dataverse.</p>

@if (WhoIAm == null)
{
    <p><em>Loading...</em></p>
}
else
{
    <table class="table">
        <thead>
            <tr>
                <th>Property</th>
                <th>Value</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>BusinessUnitId</td>
                <td>@WhoIAm.BusinessUnitId</td>
            </tr>
            <tr>
                <td>OrganizationId</td>
                <td>@WhoIAm.OrganizationId</td>
            </tr>
            <tr>
                <td>UserId</td>
                <td>@WhoIAm.UserId</td>
            </tr>
        </tbody>
    </table>
}

@code {
    private WhoAmIResponse WhoIAm;
    private HttpClient _httpClient;

    protected override async Task OnInitializedAsync()
    {
        string baseUrl = configuration["DataverseConfig:BaseUri"];

        // Get the HttpClient
        _httpClient = HttpClientFactory.CreateClient();
        
        // Get the token
        var token = string.Empty;
        try
        {
            token = await TokenAcquisitionService.GetAccessTokenForUserAsync(new string[] { $"{baseUrl}user_impersonation" });
        }
        // Microsoft Identity Web specific exception class for use in Blazor or Razor pages to process the user challenge. 
        // Handles the MsalUiRequiredException.
        catch (MicrosoftIdentityWebChallengeUserException ex)
        {
            ConsentHandler.HandleException(ex);
        }
        catch (Exception)
        {
            throw new Exception("Error getting access token.");
        }

        // Set the auth token
        _httpClient.DefaultRequestHeaders.Authorization = new System.Net.Http.Headers.AuthenticationHeaderValue("Bearer", token);

        // Send the request
        var dataRequest = await _httpClient.GetAsync($"{baseUrl}api/data/v9.2/WhoAmI");

        if (dataRequest.IsSuccessStatusCode)
        {
            var jsonString = System.Text.Json.JsonDocument.Parse(await dataRequest.Content.ReadAsStreamAsync());
            WhoIAm = JsonSerializer.Deserialize<WhoAmIResponse>(jsonString);
        }
        else
        {
            throw new Exception("Error sending request.");
        }
    }

    // Used with System.Text.Json.JsonSerializer.Deserialize to deserialize response body
    public class WhoAmIResponse
    {
        public Guid BusinessUnitId { get; set; }
        public Guid OrganizationId { get; set; }
        public Guid UserId { get; set; }
    }

}

Ausführen des Programms

Die Anwendung ist jetzt bereit.

Drücken Sie F5, um das Programm auszuführen. Wenn das Programm zum ersten Mal ausgeführt wird, sollten Sie diesen Zustimmungsdialog sehen:
Wählen Sie Akzeptieren aus.
Wählen Sie Daten abrufen.

Die Ausgabe sollte wie folgt aussehen:

Herzlichen Glückwunsch! Sie haben erfolgreich eine Verbindung mit der Web-API hergestellt.

Dieser Schnellstart zeigt einen einfachen Ansatz zum Erstellen einer Blazor Server-Webanwendung, die eine Verbindung zu Daten in Dataverse herstellt.

Erfahren Sie mehr über Dataverse-Web-API-Funktionen durch Verständnis der Servicedokumente.

Internet API-Typen und -Vorgänge

Siehe auch

Tutorial: Eine ASP.NET Core Blazor WebAssembly-App mit Dataverse erstellen
Lernprogramm: Erstellen Sie eine Blazor Server-App, die die Microsoft Identity Platform für die Authentifizierung verwendet

Hinweis

Können Sie uns Ihre Präferenzen für die Dokumentationssprache mitteilen? Nehmen Sie an einer kurzen Umfrage teil. (Beachten Sie, dass diese Umfrage auf Englisch ist.)

Die Umfrage dauert etwa sieben Minuten. Es werden keine personenbezogenen Daten erhoben. (Datenschutzbestimmungen).

Schnellstart: Blazor Server-Web-API-Beispiel (C #)

Anforderungen

Ein Visual Studio-Projekt erstellen

Die Anwendung in Microsoft Entra ID konfigurieren

App bearbeiten

appsettings.json

Program.cs

Pages/FetchData.razor

Ausführen des Programms

Siehe auch

Feedback

Zusätzliche Ressourcen