Tek başına ASP.NET Core Blazor WebAssembly uygulamanın güvenliğini Azure Active Directory

Makale
11/09/2021
Okumak için 16 dakika

Bu makalede, kimlik doğrulaması için Azure Active Directory Blazor WebAssembly (AAD) kullanan tek başına bir uygulama oluşturma işlemi yer alanmıştır.

Not

Visual Studio'da oluşturulan ve Microsoft Platformu ile AAD kuruluş dizininde hesapları destekleyecek şekilde yapılandırılmış uygulamalar için, uygulamayı doğru Azure yapılandırmasıyla oluşturmak için Visual Studio sürüm Blazor WebAssembly 16.10 veya sonraki bir sürümünü Identity kullanın. Visual Studio 16.10'dan önceki bir sürümünü kullanıyorsanız, uygulamayı oluşturmanın ardından bu **** makalenin her bölümü için uygulamanın yapılandırmasını el ile güncelleştirmeniz gerekir.

Bir AAD kaydetme:

Uygulamanın Azure Active Directory'a Azure portal. Kenar Uygulama kayıtları'yi seçin. Yeni kayıt düğmesini seçin.
Uygulama için bir Ad girin (örneğin, Blazor Tek başına AAD).
Desteklenen hesap türlerini seçin. Bu deneyim için bu kuruluş dizininde hesaplar'ı seçin.
Yeniden Yönlendirme URI'sini açılan listesinde Tek sayfalı uygulama (SPA) olarak ayarlayın ve şu yeniden yönlendirme URI'sini ekleyin: https://localhost:{PORT}/authentication/login-callback . üzerinde çalışan bir uygulamanın varsayılan bağlantı noktası Kestrel 5001'tir. Uygulama farklı bir bağlantı noktası üzerinde Kestrel çalıştır bağlı ise, uygulamanın bağlantı noktasını kullanın. Daha IIS Express için uygulama için rastgele oluşturulan bağlantı noktası, Hata Ayıklama panelinde uygulamanın özelliklerinde bulunabilir. Uygulama bu noktada mevcut değil ve IIS Express bağlantı noktası bilinmediği için, uygulama oluşturulduktan sonra bu adıma geri dönüp yeniden yönlendirme URI'sini güncelleştirin. Kullanıcılara yeniden yönlendirme URI'sini IIS Express anımsatma için bu konunun devamlarında bir açıklama görüntülenir.
Doğrulanmamış bir yayımcı etki alanı kullanıyorsanız,İzinler Yönetici izni ver openid ve offline_access > onay kutusunu temizleyin. Yayımcı etki alanı doğrulanmışsa bu onay kutusu mevcut değildir.
Kaydet’i seçin.

Aşağıdaki bilgileri kaydedin:

Uygulama (istemci) kimliği (örneğin, 41451fa7-82d9-4673-8fa5-69eff5a761fd )
Dizin (kiracı) kimliği (örneğin, e86c78e2-8bb4-4c41-aefd-918e0565a45e )

Kimlik Doğrulama Platformu > yapılandırmalarında Tek > sayfalı uygulama (SPA):

yeniden yönlendirme URI'sinin https://localhost:{PORT}/authentication/login-callback mevcut olduğunu onaylayın.
Örtülü onay için Erişim belirteçleri ve kimlik belirteçleri onay kutularının seçili olduğundan emin olun.
Uygulama için kalan varsayılan değerler bu deneyim için kabul edilebilir.
Kaydet düğmesini seçin.

Uygulamayı boş bir klasörde oluşturun. Aşağıdaki komutta yer alan yer tutucuları daha önce kaydedilen bilgilerle değiştirin ve komutu bir komut kabuğunda yürütün:

dotnet new blazorwasm -au SingleOrg --client-id "{CLIENT ID}" -o {APP NAME} --tenant-id "{TENANT ID}"

Yer tutucu	Azure portal adı	Örnek
`{APP NAME}`	—	`BlazorSample`
`{CLIENT ID}`	Uygulama (istemci) kimliği	`41451fa7-82d9-4673-8fa5-69eff5a761fd`
`{TENANT ID}`	Dizin (kiracı) kimliği	`e86c78e2-8bb4-4c41-aefd-918e0565a45e`

seçeneğiyle belirtilen çıkış konumu, yoksa bir proje klasörü oluşturur ve -o|--output uygulamanın adının bir parçası olur.

Not

Bu Azure portal, uygulamanın platform yapılandırması Yeniden Yönlendirme URI'si, sunucuda varsayılan ayarlarla çalıştırılan uygulamalar için bağlantı noktası 5001 Kestrel için yapılandırılır.

Uygulama rastgele bir IIS Express bağlantı noktası üzerinde çalıştırılırsa, uygulamanın bağlantı noktası Hata Ayıklama panelinde uygulamanın özelliklerinde bulunabilir.

Bağlantı noktası daha önce uygulamanın bilinen bağlantı noktasıyla yapılandırılmamışsa, uygulamanın Azure portal kaydına geri dönüp yeniden yönlendirme URI'sini doğru bağlantı noktasıyla güncelleştirin.

İçin bir MsalProviderOptions User.Read izin ekleyin DefaultAccessTokenScopes :

builder.Services.AddMsalAuthentication(options =>
{
    ...
    options.ProviderOptions.DefaultAccessTokenScopes
        .Add("https://graph.microsoft.com/User.Read");
});

Uygulamayı oluşturduk sonra şunları mümkün olması gerekir:

Bir kullanıcı hesabı kullanarak AAD oturum açın.
Microsoft API'leri için erişim belirteçleri isteği. Daha fazla bilgi için bkz.

Kimlik doğrulama paketi

İş veya Okul Hesaplarını kullanmak için bir uygulama oluşturulduğunda, uygulama otomatik olarak Microsoft Kimlik Doğrulama Kitaplığı ( ) SingleOrg için bir paket başvurusu Microsoft.Authentication.WebAssembly.Msal alır. Paket, uygulamanın kullanıcıların kimliğini doğrulamasını ve korumalı API'leri çağıracak belirteçleri almasını sağlayan bir temel öğeler kümesi sağlar.

Uygulamaya kimlik doğrulaması ekliyorsanız paketi uygulamanın proje dosyasına el ile ekleyin:

<PackageReference Include="Microsoft.Authentication.WebAssembly.Msal" 
  Version="{VERSION}" />

yer tutucusu için, uygulamanın paylaşılan çerçeve sürümüyle eşleşen paketin en son kararlı sürümü NuGet.org adresinde paketin Sürüm Geçmişi {VERSION} içinde bulunabilir.

Paket Microsoft.Authentication.WebAssembly.Msal geçişli olarak Microsoft.AspNetCore.Components.WebAssembly.Authentication paketi uygulamaya ekler.

Kimlik doğrulama hizmeti desteği

Kullanıcıların kimliklerini doğrulama desteği, paket tarafından sağlanan uzantı AddMsalAuthentication yöntemiyle hizmet kapsayıcısı içinde Microsoft.Authentication.WebAssembly.Msal kaydedilir. Bu yöntem, uygulamanın Sağlayıcı (IP) ile etkileşim kurması için Identity gereken hizmetleri ayarlar.

Program.cs:

builder.Services.AddMsalAuthentication(options =>
{
    builder.Configuration.Bind("AzureAd", options.ProviderOptions.Authentication);
});

yöntemi, AddMsalAuthentication bir uygulamanın kimliğini doğrulamak için gereken parametreleri yapılandırmak için bir geri çağırma kabul eder. Uygulamayı yapılandırmak için gereken değerler, uygulamayı AAD yapılandırmadan edinebilirsiniz.

Yapılandırma dosyası tarafından wwwroot/appsettings.json sağlanır:

{
  "AzureAd": {
    "Authority": "https://login.microsoftonline.com/{TENANT ID}",
    "ClientId": "{CLIENT ID}",
    "ValidateAuthority": true
  }
}

Örnek:

{
  "AzureAd": {
    "Authority": "https://login.microsoftonline.com/e86c78e2-...-918e0565a45e",
    "ClientId": "41451fa7-82d9-4673-8fa5-69eff5a761fd",
    "ValidateAuthority": true
  }
}

Erişim belirteci kapsamları

Şablon, Blazor WebAssembly uygulamayı güvenli bir API için erişim belirteci talep etmek üzere otomatik olarak yapılandırmaz. Oturum açma akışının bir parçası olarak erişim belirteci sağlama, kapsamı varsayılan erişim belirteci kapsamlarına MsalProviderOptions ekleyin:

builder.Services.AddMsalAuthentication(options =>
{
    ...
    options.ProviderOptions.DefaultAccessTokenScopes.Add("{SCOPE URI}");
});

ile ek kapsamlar AdditionalScopesToConsent belirtin:

options.ProviderOptions.AdditionalScopesToConsent.Add("{ADDITIONAL SCOPE URI}");

Daha fazla bilgi için Ek senaryolar makalesinde aşağıdaki bölümlere bakın:

Çerçeve, açılır oturum açma modunu varsayılan olarak alır ve bir açılır pencere açılamadıklarında oturum açma moduna geri döner. ' İ özelliğini olarak ayarlayarak MSAL 'i yeniden yönlendirme modunu kullanacak şekilde yapılandırın LoginMode MsalProviderOptions redirect :

builder.Services.AddMsalAuthentication(options =>
{
    ...
    options.ProviderOptions.LoginMode = "redirect";
});

Varsayılan ayar popup ve dize değeri büyük/küçük harfe duyarlı değildir.

İçeri aktarma dosyası

Ad Microsoft.AspNetCore.Components.Authorization alanı, dosya aracılığıyla uygulamanın her yerinde kullanılabilir _Imports.razor yapılır:

@using System.Net.Http
@using System.Net.Http.Json
@using Microsoft.AspNetCore.Components.Authorization
@using Microsoft.AspNetCore.Components.Forms
@using Microsoft.AspNetCore.Components.Routing
@using Microsoft.AspNetCore.Components.Web
@using Microsoft.AspNetCore.Components.Web.Virtualization
@using Microsoft.AspNetCore.Components.WebAssembly.Http
@using Microsoft.JSInterop
@using {APPLICATION ASSEMBLY}
@using {APPLICATION ASSEMBLY}.Shared

Dizin sayfası

Dizin sayfası ( wwwroot/index.html ) sayfası, JavaScript'te tanımlayan bir AuthenticationService betik içerir. AuthenticationService OIDC protokolünün alt düzey ayrıntılarını işleme. Uygulama, kimlik doğrulama işlemlerini gerçekleştirmek için betikte tanımlanan yöntemleri dahili olarak çağırıyor.

<script src="_content/Microsoft.Authentication.WebAssembly.Msal/
    AuthenticationService.js"></script>

Uygulama bileşeni

Bileşeni App ( ) uygulamalarda bulunan App.razor App bileşene Blazor Server benzer:

Bileşeni, CascadingAuthenticationState uygulamanın geri AuthenticationState kalanına ifşayı yönetir.
Bileşen, AuthorizeRouteView geçerli kullanıcının belirli bir sayfaya erişme yetkisine sahip olduğundan veya başka bir şekilde bileşeni işlemeye yetkili olduğundan emin RedirectToLogin olur.
Bileşen, RedirectToLogin yetkisiz kullanıcıları oturum açma sayfasına yeniden yönlendirmeyi yönetir.

ASP.NET Core'nin yayınlarında çerçevede yapılan değişikliklerden dolayı, bu bölümde Razor App bileşenin ( App.razor ) işaretlemesi gösterilmez. Bileşenin verilen bir sürüme yönelik işaretlemelerini incelemek için aşağıdaki yaklaşımlardan birini kullanın:

Kullanmak istediğiniz uygulamanın sürümü için varsayılan proje şablonundan kimlik Blazor WebAssembly doğrulaması için ASP.NET Core bir uygulama oluşturun. Oluşturulan App uygulamada bileşeni App.razor ( ) inceleme.
Başvuru App kaynağında App.razor bileşeni ( ) inceleme.

Not

Belge, ASP.NET Core kaynağı yüklemesi için ürün biriminin bir sonraki sürümü için geçerli geliştirmeyi temsil eden deponun dal main ASP.NET Core. Farklı bir sürümün dallarını seçmek için Dalları veya etiketleri değiştir açılan listesini kullanarak dalı seçin. Örneğin, ASP.NET Core release/5.0 5.0 sürümü için dalı seçin.

RedirectToLogin bileşeni

RedirectToLoginBileşen ( Shared/RedirectToLogin.razor ):

Yetkisiz kullanıcıların oturum açma sayfasına yeniden yönlendirildiğini yönetir.
Kimlik doğrulaması başarılı olursa bu sayfaya döndürülmeleri için kullanıcının erişmeye çalışan geçerli URL 'YI korur.

@inject NavigationManager Navigation
@using Microsoft.AspNetCore.Components.WebAssembly.Authentication
@code {
    protected override void OnInitialized()
    {
        Navigation.NavigateTo(
            $"authentication/login?returnUrl={Uri.EscapeDataString(Navigation.Uri)}");
    }
}

LoginDisplay bileşeni

Bileşeni LoginDisplay ( Shared/LoginDisplay.razor ) bileşeninde işlenir ( ) ve aşağıdaki MainLayout davranışları Shared/MainLayout.razor yönetir:

Kimliği doğrulanmış kullanıcılar için:
- Geçerli kullanıcı adını görüntüler.
- Uygulamada oturumun açık olduğu bir düğme sunar.
Anonim kullanıcılar için oturum açma seçeneği sunar.

@using Microsoft.AspNetCore.Components.Authorization
@using Microsoft.AspNetCore.Components.WebAssembly.Authentication
@inject NavigationManager Navigation
@inject SignOutSessionStateManager SignOutManager

<AuthorizeView>
    <Authorized>
        Hello, @context.User.Identity.Name!
        <button class="nav-link btn btn-link" @onclick="BeginLogout">
            Log out
        </button>
    </Authorized>
    <NotAuthorized>
        <a href="authentication/login">Log in</a>
    </NotAuthorized>
</AuthorizeView>

@code {
    private async Task BeginLogout(MouseEventArgs args)
    {
        await SignOutManager.SetSignOutState();
        Navigation.NavigateTo("authentication/logout");
    }
}

Kimlik doğrulama bileşeni

Bileşeni ( ) tarafından Authentication üretilen Pages/Authentication.razor sayfa, farklı kimlik doğrulama aşamalarını işleme için gereken yolları tanımlar.

RemoteAuthenticatorViewBileşen:

Paketi tarafından Microsoft.AspNetCore.Components.WebAssembly.Authentication sağlanır.
Kimlik doğrulamasının her aşamasında uygun eylemleri gerçekleştirmeyi yönetir.

@page "/authentication/{action}"
@using Microsoft.AspNetCore.Components.WebAssembly.Authentication

<RemoteAuthenticatorView Action="@Action" />

@code {
    [Parameter]
    public string Action { get; set; }
}

Sorun giderme

Sık karşılaşılan hatalar

Uygulamanın veya Identity sağlayıcının (IP) yanlış yapılandırılması

En yaygın hatalar yanlış yapılandırma nedeniyle oluşur. Aşağıda birkaç örnek verilmiştir:
- Senaryonun gereksinimlerine bağlı olarak, eksik veya yanlış bir yetkili, örnek, kiracı KIMLIĞI, kiracı etki alanı, Istemci KIMLIĞI veya yeniden yönlendirme URI 'SI, bir uygulamanın istemcilerin kimliğini doğrulamasını önler.
- Yanlış bir erişim belirteci kapsamı, istemcilerin sunucu Web API uç noktalarına erişmesini önler.
- Yanlış veya eksik sunucu API izinleri istemcilerin sunucu Web API uç noktalarına erişmesini önler.
- Uygulamayı, sağlayıcının uygulama kaydının yeniden yönlendirme URI 'sinde yapılandırılmış olandan farklı bir bağlantı noktasında çalıştırmak Identity .
Bu makalenin kılavuzunun yapılandırma bölümlerinde doğru yapılandırma örnekleri gösterilmektedir. Uygulama ve IP yanlış yapılandırmayla ilgili makalenin her bölümüne dikkatle göz atın.

Yapılandırma doğru görünüyorsa:
- Uygulama günlüklerini analiz edin.
- Tarayıcı geliştirici araçlarıyla istemci uygulaması ile IP veya sunucu uygulaması arasındaki ağ trafiğini inceleyin. Genellikle, bir istek yapıldıktan sonra, hataya neden olan bir hata iletisi veya bir sorun olduğunu bir ileti, IP veya sunucu uygulaması tarafından istemciye döndürülür. Geliştirici araçları Kılavuzu aşağıdaki makalelerde bulunur:
  - Google Chrome (Google belgeleri)
  - Microsoft Edge
  - Mozilla Firefox (Mozilla belgeleri)
- Bir istemcinin kimliğini doğrulamak için kullanılan bir JSON Web Token (JWT) içeriğinin kodunu çözün veya sorunun nerede oluştuğunu bağlı olarak bir sunucu Web API 'sine erişim. Daha fazla bilgi için bkz. bir JSON Web token (JWT) Içeriğini İnceleme.
Belgeler, makalelerdeki belge geri bildirimlerine ve hatalara yanıt veriyor ( Bu sayfa geri bildirimi bölümünden bir sorun açar), ancak ürün desteği sağlayamadı. Bir uygulamanın sorunlarını gidermeye yardımcı olmak için çeşitli genel destek forumları vardır. Şunları öneririz:
Önceki Forumlar Microsoft tarafından sahip değil veya denetlenmiyor.

güvenlikle ilgili olmayan, hassas olmayan ve gizli olmayan bir dizi framework hata raporu için ASP.NET Core ürün birimiyle bir sorun açın. Bir sorunun nedenini iyice araştırmadan ve bir genel destek forumundaki topluluk yardımıyla, ürün birimiyle ilgili bir sorun açmayın. Ürün birimi, basit yanlış yapılandırma veya üçüncü taraf hizmetleri içeren durumlar nedeniyle bozuk olan ayrı uygulamalarla ilgili sorunları gideremez. bir rapor hassas veya gizli ise ve saldırganların yararlanabilecek potansiyel bir güvenlik kusurunu kullanıyorsa, bkz. raporlama güvenlik sorunları ve hataları (dotnet/aspnetcore GitHub repository).
AAD için yetkisiz istemci

bilgi: Microsoft. AspNetCore. Authorization. DefaultAuthorizationService [2] yetkilendirmesi başarısız oldu. Bu gereksinimler karşılanmadı: DenyAnonymousAuthorizationRequirement: kimliği doğrulanmış bir kullanıcı gerektirir.

AAD oturum açma geri çağırma hatası:
- Hata: unauthorized_client
- Açıklaması AADB2C90058: The provided application is not configured to allow public clients.
Hatayı gidermek için:
1. Azure portal, uygulamanın bildirimineerişin.
2. allowPublicClient Özniteliğini veya olarak ayarlayın null true .

Cookies ve site verileri

Cookies ve site verileri, uygulama güncelleştirmelerinde devam edebilir ve test ve sorun giderme işlemlerini etkileyebilir. Uygulama kodu değişiklikleri yaparken, sağlayıcı ile Kullanıcı hesabı değişiklikleri veya sağlayıcı uygulama yapılandırma değişiklikleri yaparken aşağıdakileri temizleyin:

Kullanıcı oturum açma cookie öğeleri
Uygulama cookie s
Önbelleğe alınmış ve depolanan site verileri

Kalan cookie s ve site verilerinin test ve sorun giderme konusunda kesintiye uğramasını önleyen bir yaklaşım:

Tarayıcı yapılandırma
- cookieTarayıcı her kapatıldığında tüm ve site verilerini silmek üzere yapılandırabileceğiniz test için bir tarayıcı kullanın.
- Uygulamanın, test kullanıcısının veya sağlayıcı yapılandırmasının herhangi bir değişikliği için tarayıcının el ile veya IDE tarafından kapatıldığından emin olun.
Visual Studio ' deki bir tarayıcıyı veya özel modda açmak için özel bir komut kullanın:
- Visual Studio çalıştır düğmesinden , iletişim kutusunu açın.
- Ekle düğmesini seçin.
- Program alanında tarayıcınızın yolunu belirtin. Aşağıdaki yürütülebilir yollar Windows 10 için tipik yükleme konumlarıdır. tarayıcınız farklı bir konuma yüklenirse veya Windows 10 kullanmıyorsanız, tarayıcının yürütülebilir dosyasının yolunu belirtin.
  - Microsoft Edge:C:\Program Files (x86)\Microsoft\Edge\Application\msedge.exe
  - Google Chrome: C:\Program Files (x86)\Google\Chrome\Application\chrome.exe
  - Mozilla Firefox: C:\Program Files\Mozilla Firefox\firefox.exe
- Bağımsız değişkenler alanında, tarayıcının ınbilito veya Private modunda açmak için kullandığı komut satırı seçeneğini belirtin. Bazı tarayıcılar uygulamanın URL 'sini gerektirir.
  - Microsoft Edge: kullanın -inprivate .
  - Google Chrome: Use --incognito --new-window {URL} , yer tutucunun {URL} açılacağı URL (örneğin, https://localhost:5001 ).
  - Mozilla Firefox: Use -private -url {URL} , yer tutucunun {URL} açılacağı URL (örneğin, https://localhost:5001 ).
- Kolay ad alanına bir ad girin. Örneğin, Firefox Auth Testing.
- Tamam düğmesini seçin.
- Her bir uygulamayla test yinelemesi için tarayıcı profilini seçmek zorunda kalmamak için, profili varsayılan olarak Ayarla düğmesi ile varsayılan olarak ayarlayın.
- Uygulamanın, test kullanıcısının veya sağlayıcı yapılandırmasındaki herhangi bir değişiklik için, tarayıcının IDE tarafından kapatıldığından emin olun.

Uygulama yükseltmeleri

Çalışan bir uygulama, geliştirme makinesindeki .NET Core SDK yükseltmeden veya uygulama içindeki paket sürümlerini değiştirirken hemen başarısız olabilir. Bazı durumlarda, önemli paketler ana yükseltmeler gerçekleştirirken bir uygulamayı bozabilir. Bu sorunların çoğu aşağıdaki yönergeleri izleyerek düzeltilebilir:

bir komut kabuğundan yürüterek yerel sistemin NuGet paketi önbelleklerini temizleyin dotnet nuget locals all --clear .
Proje bin ve obj klasörlerini silin.
Projeyi geri yükleyin ve yeniden derleyin.
Uygulamayı yeniden dağıtmadan önce sunucusundaki dağıtım klasöründeki tüm dosyaları silin.

Not

Uygulamanın hedef çerçevesiyle uyumsuz paket sürümlerinin kullanımı desteklenmez. bir paket hakkında daha fazla bilgi için NuGet galerisi veya fuget paket gezgininikullanın.

Sunucu uygulamasını çalıştırma

Barındırılan bir çözümü test etmek ve sorunlarını giderirken Blazor , uygulamayı projeden çalıştırdığınızdan emin olun Server . örneğin Visual Studio ' de, aşağıdaki yaklaşımlardan biriyle uygulamaya başlamadan önce sunucu projesinin Çözüm Gezgini vurgulandığını doğrulayın:

Çalıştır düğmesini seçin.
Menüden hata > ayıklamayı Başlat komutunu kullanın.
F5tuşuna basın.

JSON Web Token (JWT) içeriğini İnceleme

Bir JSON Web Token (JWT) kodunu çözmek için Microsoft 'un JWT.MS aracını kullanın. Kullanıcı arabirimindeki değerler hiçbir şekilde tarayıcınızdan bırakmayın.

Örnek kodlanmış JWT (görüntülenmek üzere kısaltıldı):

eyJ0eXAiOiJKV1QiLCJhbGciOiJSUzI1NiIsImtpZCI6Ilg1ZVhrNHh5b2pORnVtMWtsMll0djhkbE5QNC1j ... bQdHBHGcQQRbW7Wmo6SWYG4V_bU55Ug_PW4pLPr20tTS8Ct7_uwy9DWrzCMzpD-EiwT5IjXwlGX3IXVjHIlX50IVIydBoPQtadvT7saKo1G5Jmutgq41o-dmz6-yBMKV2_nXA25Q

Azure AAD B2C 'da kimlik doğrulayan bir uygulama için araç tarafından kodu çözülen örnek JWT:

{
  "typ": "JWT",
  "alg": "RS256",
  "kid": "X5eXk4xyojNFum1kl2Ytv8dlNP4-c57dO6QGTVBwaNk"
}.{
  "exp": 1610059429,
  "nbf": 1610055829,
  "ver": "1.0",
  "iss": "https://mysiteb2c.b2clogin.com/5cc15ea8-a296-4aa3-97e4-226dcc9ad298/v2.0/",
  "sub": "5ee963fb-24d6-4d72-a1b6-889c6e2c7438",
  "aud": "70bde375-fce3-4b82-984a-b247d823a03f",
  "nonce": "b2641f54-8dc4-42ca-97ea-7f12ff4af871",
  "iat": 1610055829,
  "auth_time": 1610055822,
  "idp": "idp.com",
  "tfp": "B2C_1_signupsignin"
}.[Signature]

Ek kaynaklar

Bu makalede, kimlik doğrulaması için Azure Active Directory Blazor WebAssembly (AAD) kullanan tek başına bir uygulama oluşturma işlemi yer alanmıştır.

Not

Bir AAD kaydetme:

Uygulamanın Azure Active Directory'a Azure portal. Kenar Uygulama kayıtları'yi seçin. Yeni kayıt düğmesini seçin.
Uygulama için bir Ad girin (örneğin, Blazor Tek başına AAD).
Desteklenen hesap türlerini seçin. Bu deneyim için bu kuruluş dizininde hesaplar'ı seçin.
Yeniden Yönlendirme URI'sini açılan listesinde Tek sayfalı uygulama (SPA) olarak ayarlayın ve şu yeniden yönlendirme URI'sini ekleyin: https://localhost:{PORT}/authentication/login-callback . üzerinde çalışan bir uygulamanın varsayılan bağlantı noktası Kestrel 5001'tir. Uygulama farklı bir bağlantı noktası üzerinde Kestrel çalıştır bağlı ise, uygulamanın bağlantı noktasını kullanın. Daha IIS Express için uygulama için rastgele oluşturulan bağlantı noktası, Hata Ayıklama panelinde uygulamanın özelliklerinde bulunabilir. Uygulama bu noktada mevcut değil ve IIS Express bağlantı noktası bilinmediği için, uygulama oluşturulduktan sonra bu adıma geri dönüp yeniden yönlendirme URI'sini güncelleştirin. Kullanıcılara yeniden yönlendirme URI'sini IIS Express anımsatma için bu konunun devamlarında bir açıklama görüntülenir.
Doğrulanmamış bir yayımcı etki alanı kullanıyorsanız,İzinler Yönetici izni ver openid ve offline_access > onay kutusunu temizleyin. Yayımcı etki alanı doğrulanmışsa bu onay kutusu mevcut değildir.
Kaydet’i seçin.

Aşağıdaki bilgileri kaydedin:

Uygulama (istemci) kimliği (örneğin, 41451fa7-82d9-4673-8fa5-69eff5a761fd )
Dizin (kiracı) kimliği (örneğin, e86c78e2-8bb4-4c41-aefd-918e0565a45e )

Kimlik Doğrulama Platformu > yapılandırmalarında Tek > sayfalı uygulama (SPA):

yeniden yönlendirme URI'sinin https://localhost:{PORT}/authentication/login-callback mevcut olduğunu onaylayın.
Örtülü onay için Erişim belirteçleri ve kimlik belirteçleri onay kutularının seçili olduğundan emin olun.
Uygulama için kalan varsayılan değerler bu deneyim için kabul edilebilir.
Kaydet düğmesini seçin.

Uygulamayı boş bir klasörde oluşturun. Aşağıdaki komutta yer alan yer tutucuları daha önce kaydedilen bilgilerle değiştirin ve komutu bir komut kabuğunda yürütün:

dotnet new blazorwasm -au SingleOrg --client-id "{CLIENT ID}" -o {APP NAME} --tenant-id "{TENANT ID}"

Yer tutucu	Azure portal adı	Örnek
`{APP NAME}`	—	`BlazorSample`
`{CLIENT ID}`	Uygulama (istemci) kimliği	`41451fa7-82d9-4673-8fa5-69eff5a761fd`
`{TENANT ID}`	Dizin (kiracı) kimliği	`e86c78e2-8bb4-4c41-aefd-918e0565a45e`

seçeneğiyle belirtilen çıkış konumu, yoksa bir proje klasörü oluşturur ve -o|--output uygulamanın adının bir parçası olur.

Not

Uygulama rastgele bir IIS Express bağlantı noktası üzerinde çalıştırılırsa, uygulamanın bağlantı noktası Hata Ayıklama panelinde uygulamanın özelliklerinde bulunabilir.

İçin bir MsalProviderOptions User.Read izin ekleyin DefaultAccessTokenScopes :

builder.Services.AddMsalAuthentication(options =>
{
    ...
    options.ProviderOptions.DefaultAccessTokenScopes
        .Add("https://graph.microsoft.com/User.Read");
});

Uygulamayı oluşturduk sonra şunları mümkün olması gerekir:

Bir kullanıcı hesabı kullanarak AAD oturum açın.
Microsoft API'leri için erişim belirteçleri isteği. Daha fazla bilgi için bkz.

Kimlik doğrulama paketi

Uygulamaya kimlik doğrulaması ekliyorsanız paketi uygulamanın proje dosyasına el ile ekleyin:

<PackageReference Include="Microsoft.Authentication.WebAssembly.Msal" 
  Version="{VERSION}" />

yer tutucusu için, uygulamanın paylaşılan çerçeve sürümüyle eşleşen paketin en son kararlı sürümü NuGet.org adresinde paketin Sürüm Geçmişi {VERSION} içinde bulunabilir.

Paket Microsoft.Authentication.WebAssembly.Msal geçişli olarak Microsoft.AspNetCore.Components.WebAssembly.Authentication paketi uygulamaya ekler.

Kimlik doğrulama hizmeti desteği

Program.cs:

builder.Services.AddMsalAuthentication(options =>
{
    builder.Configuration.Bind("AzureAd", options.ProviderOptions.Authentication);
});

Yapılandırma dosyası tarafından wwwroot/appsettings.json sağlanır:

{
  "AzureAd": {
    "Authority": "https://login.microsoftonline.com/{TENANT ID}",
    "ClientId": "{CLIENT ID}",
    "ValidateAuthority": true
  }
}

Örnek:

{
  "AzureAd": {
    "Authority": "https://login.microsoftonline.com/e86c78e2-...-918e0565a45e",
    "ClientId": "41451fa7-82d9-4673-8fa5-69eff5a761fd",
    "ValidateAuthority": true
  }
}

Erişim belirteci kapsamları

builder.Services.AddMsalAuthentication(options =>
{
    ...
    options.ProviderOptions.DefaultAccessTokenScopes.Add("{SCOPE URI}");
});

ile ek kapsamlar AdditionalScopesToConsent belirtin:

options.ProviderOptions.AdditionalScopesToConsent.Add("{ADDITIONAL SCOPE URI}");

Daha fazla bilgi için Ek senaryolar makalesinde aşağıdaki bölümlere bakın:

builder.Services.AddMsalAuthentication(options =>
{
    ...
    options.ProviderOptions.LoginMode = "redirect";
});

Varsayılan ayar popup ve dize değeri büyük/küçük harfe duyarlı değildir.

İçeri aktarma dosyası

Ad Microsoft.AspNetCore.Components.Authorization alanı, dosya aracılığıyla uygulamanın her yerinde kullanılabilir _Imports.razor yapılır:

@using System.Net.Http
@using System.Net.Http.Json
@using Microsoft.AspNetCore.Components.Authorization
@using Microsoft.AspNetCore.Components.Forms
@using Microsoft.AspNetCore.Components.Routing
@using Microsoft.AspNetCore.Components.Web
@using Microsoft.AspNetCore.Components.Web.Virtualization
@using Microsoft.AspNetCore.Components.WebAssembly.Http
@using Microsoft.JSInterop
@using {APPLICATION ASSEMBLY}
@using {APPLICATION ASSEMBLY}.Shared

Dizin sayfası

<script src="_content/Microsoft.Authentication.WebAssembly.Msal/
    AuthenticationService.js"></script>

Uygulama bileşeni

Bileşeni App ( ) uygulamalarda bulunan App.razor App bileşene Blazor Server benzer:

Bileşeni, CascadingAuthenticationState uygulamanın geri AuthenticationState kalanına ifşayı yönetir.
Bileşen, AuthorizeRouteView geçerli kullanıcının belirli bir sayfaya erişme yetkisine sahip olduğundan veya başka bir şekilde bileşeni işlemeye yetkili olduğundan emin RedirectToLogin olur.
Bileşen, RedirectToLogin yetkisiz kullanıcıları oturum açma sayfasına yeniden yönlendirmeyi yönetir.

Kullanmak istediğiniz uygulamanın sürümü için varsayılan proje şablonundan kimlik Blazor WebAssembly doğrulaması için ASP.NET Core bir uygulama oluşturun. Oluşturulan App uygulamada bileşeni App.razor ( ) inceleme.
Başvuru App kaynağında App.razor bileşeni ( ) inceleme.

Not

Belge, ASP.NET Core kaynağı yüklemesi için ürün biriminin bir sonraki sürümü için geçerli geliştirmeyi temsil eden deponun dal main ASP.NET Core. Farklı bir sürümün dallarını seçmek için Dalları veya etiketleri değiştir açılan listesini kullanarak dalı seçin. Örneğin, ASP.NET Core release/5.0 5.0 sürümü için dalı seçin.

RedirectToLogin bileşeni

RedirectToLoginBileşen ( Shared/RedirectToLogin.razor ):

Yetkisiz kullanıcıların oturum açma sayfasına yeniden yönlendirildiğini yönetir.
Kimlik doğrulaması başarılı olursa bu sayfaya döndürülmeleri için kullanıcının erişmeye çalışan geçerli URL 'YI korur.

@inject NavigationManager Navigation
@using Microsoft.AspNetCore.Components.WebAssembly.Authentication
@code {
    protected override void OnInitialized()
    {
        Navigation.NavigateTo(
            $"authentication/login?returnUrl={Uri.EscapeDataString(Navigation.Uri)}");
    }
}

LoginDisplay bileşeni

Bileşeni LoginDisplay ( Shared/LoginDisplay.razor ) bileşeninde işlenir ( ) ve aşağıdaki MainLayout davranışları Shared/MainLayout.razor yönetir:

Kimliği doğrulanmış kullanıcılar için:
- Geçerli kullanıcı adını görüntüler.
- Uygulamada oturumun açık olduğu bir düğme sunar.
Anonim kullanıcılar için oturum açma seçeneği sunar.

@using Microsoft.AspNetCore.Components.Authorization
@using Microsoft.AspNetCore.Components.WebAssembly.Authentication
@inject NavigationManager Navigation
@inject SignOutSessionStateManager SignOutManager

<AuthorizeView>
    <Authorized>
        Hello, @context.User.Identity.Name!
        <button class="nav-link btn btn-link" @onclick="BeginLogout">
            Log out
        </button>
    </Authorized>
    <NotAuthorized>
        <a href="authentication/login">Log in</a>
    </NotAuthorized>
</AuthorizeView>

@code {
    private async Task BeginLogout(MouseEventArgs args)
    {
        await SignOutManager.SetSignOutState();
        Navigation.NavigateTo("authentication/logout");
    }
}

Kimlik doğrulama bileşeni

Bileşeni ( ) tarafından Authentication üretilen Pages/Authentication.razor sayfa, farklı kimlik doğrulama aşamalarını işleme için gereken yolları tanımlar.

RemoteAuthenticatorViewBileşen:

Paketi tarafından Microsoft.AspNetCore.Components.WebAssembly.Authentication sağlanır.
Kimlik doğrulamasının her aşamasında uygun eylemleri gerçekleştirmeyi yönetir.

@page "/authentication/{action}"
@using Microsoft.AspNetCore.Components.WebAssembly.Authentication

<RemoteAuthenticatorView Action="@Action" />

@code {
    [Parameter]
    public string Action { get; set; }
}

Sorun giderme

Sık karşılaşılan hatalar

Uygulamanın veya Identity sağlayıcının (IP) yanlış yapılandırılması

En yaygın hatalar yanlış yapılandırma nedeniyle oluşur. Aşağıda birkaç örnek verilmiştir:
- Senaryonun gereksinimlerine bağlı olarak, eksik veya yanlış bir yetkili, örnek, kiracı KIMLIĞI, kiracı etki alanı, Istemci KIMLIĞI veya yeniden yönlendirme URI 'SI, bir uygulamanın istemcilerin kimliğini doğrulamasını önler.
- Yanlış bir erişim belirteci kapsamı, istemcilerin sunucu Web API uç noktalarına erişmesini önler.
- Yanlış veya eksik sunucu API izinleri istemcilerin sunucu Web API uç noktalarına erişmesini önler.
- Uygulamayı, sağlayıcının uygulama kaydının yeniden yönlendirme URI 'sinde yapılandırılmış olandan farklı bir bağlantı noktasında çalıştırmak Identity .
Bu makalenin kılavuzunun yapılandırma bölümlerinde doğru yapılandırma örnekleri gösterilmektedir. Uygulama ve IP yanlış yapılandırmayla ilgili makalenin her bölümüne dikkatle göz atın.

Yapılandırma doğru görünüyorsa:
- Uygulama günlüklerini analiz edin.
- Tarayıcı geliştirici araçlarıyla istemci uygulaması ile IP veya sunucu uygulaması arasındaki ağ trafiğini inceleyin. Genellikle, bir istek yapıldıktan sonra, hataya neden olan bir hata iletisi veya bir sorun olduğunu bir ileti, IP veya sunucu uygulaması tarafından istemciye döndürülür. Geliştirici araçları Kılavuzu aşağıdaki makalelerde bulunur:
  - Google Chrome (Google belgeleri)
  - Microsoft Edge
  - Mozilla Firefox (Mozilla belgeleri)
- Bir istemcinin kimliğini doğrulamak için kullanılan bir JSON Web Token (JWT) içeriğinin kodunu çözün veya sorunun nerede oluştuğunu bağlı olarak bir sunucu Web API 'sine erişim. Daha fazla bilgi için bkz. bir JSON Web token (JWT) Içeriğini İnceleme.
Belgeler, makalelerdeki belge geri bildirimlerine ve hatalara yanıt veriyor ( Bu sayfa geri bildirimi bölümünden bir sorun açar), ancak ürün desteği sağlayamadı. Bir uygulamanın sorunlarını gidermeye yardımcı olmak için çeşitli genel destek forumları vardır. Şunları öneririz:
Önceki Forumlar Microsoft tarafından sahip değil veya denetlenmiyor.

güvenlikle ilgili olmayan, hassas olmayan ve gizli olmayan bir dizi framework hata raporu için ASP.NET Core ürün birimiyle bir sorun açın. Bir sorunun nedenini iyice araştırmadan ve bir genel destek forumundaki topluluk yardımıyla, ürün birimiyle ilgili bir sorun açmayın. Ürün birimi, basit yanlış yapılandırma veya üçüncü taraf hizmetleri içeren durumlar nedeniyle bozuk olan ayrı uygulamalarla ilgili sorunları gideremez. bir rapor hassas veya gizli ise ve saldırganların yararlanabilecek potansiyel bir güvenlik kusurunu kullanıyorsa, bkz. raporlama güvenlik sorunları ve hataları (dotnet/aspnetcore GitHub repository).
AAD için yetkisiz istemci

bilgi: Microsoft. AspNetCore. Authorization. DefaultAuthorizationService [2] yetkilendirmesi başarısız oldu. Bu gereksinimler karşılanmadı: DenyAnonymousAuthorizationRequirement: kimliği doğrulanmış bir kullanıcı gerektirir.

AAD oturum açma geri çağırma hatası:
- Hata: unauthorized_client
- Açıklaması AADB2C90058: The provided application is not configured to allow public clients.
Hatayı gidermek için:
1. Azure portal, uygulamanın bildirimineerişin.
2. allowPublicClient Özniteliğini veya olarak ayarlayın null true .

Cookies ve site verileri

Kullanıcı oturum açma cookie öğeleri
Uygulama cookie s
Önbelleğe alınmış ve depolanan site verileri

Kalan cookie s ve site verilerinin test ve sorun giderme konusunda kesintiye uğramasını önleyen bir yaklaşım:

Tarayıcı yapılandırma
- cookieTarayıcı her kapatıldığında tüm ve site verilerini silmek üzere yapılandırabileceğiniz test için bir tarayıcı kullanın.
- Uygulamanın, test kullanıcısının veya sağlayıcı yapılandırmasının herhangi bir değişikliği için tarayıcının el ile veya IDE tarafından kapatıldığından emin olun.
Visual Studio ' deki bir tarayıcıyı veya özel modda açmak için özel bir komut kullanın:
- Visual Studio çalıştır düğmesinden , iletişim kutusunu açın.
- Ekle düğmesini seçin.
- Program alanında tarayıcınızın yolunu belirtin. Aşağıdaki yürütülebilir yollar Windows 10 için tipik yükleme konumlarıdır. tarayıcınız farklı bir konuma yüklenirse veya Windows 10 kullanmıyorsanız, tarayıcının yürütülebilir dosyasının yolunu belirtin.
  - Microsoft Edge:C:\Program Files (x86)\Microsoft\Edge\Application\msedge.exe
  - Google Chrome: C:\Program Files (x86)\Google\Chrome\Application\chrome.exe
  - Mozilla Firefox: C:\Program Files\Mozilla Firefox\firefox.exe
- Bağımsız değişkenler alanında, tarayıcının ınbilito veya Private modunda açmak için kullandığı komut satırı seçeneğini belirtin. Bazı tarayıcılar uygulamanın URL 'sini gerektirir.
  - Microsoft Edge: kullanın -inprivate .
  - Google Chrome: Use --incognito --new-window {URL} , yer tutucunun {URL} açılacağı URL (örneğin, https://localhost:5001 ).
  - Mozilla Firefox: Use -private -url {URL} , yer tutucunun {URL} açılacağı URL (örneğin, https://localhost:5001 ).
- Kolay ad alanına bir ad girin. Örneğin, Firefox Auth Testing.
- Tamam düğmesini seçin.
- Her bir uygulamayla test yinelemesi için tarayıcı profilini seçmek zorunda kalmamak için, profili varsayılan olarak Ayarla düğmesi ile varsayılan olarak ayarlayın.
- Uygulamanın, test kullanıcısının veya sağlayıcı yapılandırmasındaki herhangi bir değişiklik için, tarayıcının IDE tarafından kapatıldığından emin olun.

Uygulama yükseltmeleri

bir komut kabuğundan yürüterek yerel sistemin NuGet paketi önbelleklerini temizleyin dotnet nuget locals all --clear .
Proje bin ve obj klasörlerini silin.
Projeyi geri yükleyin ve yeniden derleyin.
Uygulamayı yeniden dağıtmadan önce sunucusundaki dağıtım klasöründeki tüm dosyaları silin.

Not

Uygulamanın hedef çerçevesiyle uyumsuz paket sürümlerinin kullanımı desteklenmez. bir paket hakkında daha fazla bilgi için NuGet galerisi veya fuget paket gezgininikullanın.

Sunucu uygulamasını çalıştırma

Çalıştır düğmesini seçin.
Menüden hata > ayıklamayı Başlat komutunu kullanın.
F5tuşuna basın.

JSON Web Token (JWT) içeriğini İnceleme

Bir JSON Web Token (JWT) kodunu çözmek için Microsoft 'un JWT.MS aracını kullanın. Kullanıcı arabirimindeki değerler hiçbir şekilde tarayıcınızdan bırakmayın.

Örnek kodlanmış JWT (görüntülenmek üzere kısaltıldı):

eyJ0eXAiOiJKV1QiLCJhbGciOiJSUzI1NiIsImtpZCI6Ilg1ZVhrNHh5b2pORnVtMWtsMll0djhkbE5QNC1j ... bQdHBHGcQQRbW7Wmo6SWYG4V_bU55Ug_PW4pLPr20tTS8Ct7_uwy9DWrzCMzpD-EiwT5IjXwlGX3IXVjHIlX50IVIydBoPQtadvT7saKo1G5Jmutgq41o-dmz6-yBMKV2_nXA25Q

Azure AAD B2C 'da kimlik doğrulayan bir uygulama için araç tarafından kodu çözülen örnek JWT:

{
  "typ": "JWT",
  "alg": "RS256",
  "kid": "X5eXk4xyojNFum1kl2Ytv8dlNP4-c57dO6QGTVBwaNk"
}.{
  "exp": 1610059429,
  "nbf": 1610055829,
  "ver": "1.0",
  "iss": "https://mysiteb2c.b2clogin.com/5cc15ea8-a296-4aa3-97e4-226dcc9ad298/v2.0/",
  "sub": "5ee963fb-24d6-4d72-a1b6-889c6e2c7438",
  "aud": "70bde375-fce3-4b82-984a-b247d823a03f",
  "nonce": "b2641f54-8dc4-42ca-97ea-7f12ff4af871",
  "iat": 1610055829,
  "auth_time": 1610055822,
  "idp": "idp.com",
  "tfp": "B2C_1_signupsignin"
}.[Signature]

Ek kaynaklar

Bu makalede, kimlik doğrulaması için Azure Active Directory Blazor WebAssembly (AAD) kullanan tek başına bir uygulama oluşturma işlemi yer aleladedir.

Bir AAD kaydetme:

Uygulamanın Azure Active Directory'a Azure portal. Kenar Uygulama kayıtları Seç'i seçin. Yeni kayıt düğmesini seçin.
Uygulama için bir Ad girin (örneğin, Blazor Tek başına AAD).
Desteklenen hesap türlerini seçin. Bu deneyim için bu kuruluş dizininde hesaplar'ı seçin.
Yeniden Yönlendirme URI'si açılan listesinde Web olarak bırakın ve şu yeniden yönlendirme URI'sini sağlar: https://localhost:{PORT}/authentication/login-callback . üzerinde çalışan bir uygulamanın varsayılan bağlantı noktası Kestrel 5001'tir. Uygulama farklı bir bağlantı noktası üzerinde Kestrel çalıştır bağlı ise, uygulamanın bağlantı noktasını kullanın. Daha IIS Express için uygulama için rastgele oluşturulan bağlantı noktası, Hata Ayıklama panelinde uygulamanın özelliklerinde bulunabilir. Uygulama bu noktada mevcut değil ve IIS Express bağlantı noktası bilinmediği için, uygulama oluşturulduktan sonra bu adıma geri dönüp yeniden yönlendirme URI'sini güncelleştirin. Kullanıcılara yeniden yönlendirme URI'sini IIS Express anımsatma için bu konunun devamlarında bir açıklama görüntülenir.
Doğrulanmamış bir yayımcı etki alanı kullanıyorsanız,İzinler Yönetici izni ver openid ve offline_access > onay kutusunu temizleyin. Yayımcı etki alanı doğrulanmışsa bu onay kutusu mevcut değildir.
Kaydet’i seçin.

Aşağıdaki bilgileri kaydedin:

Uygulama (istemci) kimliği (örneğin, 41451fa7-82d9-4673-8fa5-69eff5a761fd )
Dizin (kiracı) kimliği (örneğin, e86c78e2-8bb4-4c41-aefd-918e0565a45e )

Kimlik Doğrulama Platformu > yapılandırmaları > Web'de:

yeniden yönlendirme URI'sinin https://localhost:{PORT}/authentication/login-callback mevcut olduğunu onaylayın.
Örtülü onay için Erişim belirteçleri ve kimlik belirteçleri onay kutularını seçin.
Uygulama için kalan varsayılan değerler bu deneyim için kabul edilebilir.
Kaydet düğmesini seçin.

Uygulamayı boş bir klasörde oluşturun. Aşağıdaki komutta yer alan yer tutucuları daha önce kaydedilen bilgilerle değiştirin ve komutu bir komut kabuğunda yürütün:

dotnet new blazorwasm -au SingleOrg --client-id "{CLIENT ID}" -o {APP NAME} --tenant-id "{TENANT ID}"

Yer tutucu	Azure portal adı	Örnek
`{APP NAME}`	—	`BlazorSample`
`{CLIENT ID}`	Uygulama (istemci) kimliği	`41451fa7-82d9-4673-8fa5-69eff5a761fd`
`{TENANT ID}`	Dizin (kiracı) kimliği	`e86c78e2-8bb4-4c41-aefd-918e0565a45e`

seçeneğiyle belirtilen çıkış konumu, yoksa bir proje klasörü oluşturur ve -o|--output uygulamanın adının bir parçası olur.

Not

Uygulama rastgele bir IIS Express bağlantı noktası üzerinde çalıştırılırsa, uygulamanın bağlantı noktası Hata Ayıklama panelinde uygulamanın özelliklerinde bulunabilir.

Uygulamayı oluşturduk sonra şunları mümkün olması gerekir:

Bir kullanıcı hesabı kullanarak AAD oturum açın.
Microsoft API'leri için erişim belirteçleri isteği. Daha fazla bilgi için bkz.

Kimlik doğrulama paketi

Iş veya okul hesaplarını () kullanmak üzere bir uygulama oluşturulduğunda SingleOrg , uygulama Microsoft kimlik doğrulama kitaplığı () için bir paket başvurusu otomatik olarak alır Microsoft.Authentication.WebAssembly.Msal . Paket, uygulamanın kullanıcıların kimliğini doğrulamasına ve korunan API 'Leri çağırmak için belirteçleri almasına yardımcı olan bir dizi temel sunar.

Bir uygulamaya kimlik doğrulaması ekliyorsanız, paketi uygulamanın proje dosyasına el ile ekleyin:

<PackageReference Include="Microsoft.Authentication.WebAssembly.Msal" 
  Version="{VERSION}" />

yer tutucu için {VERSION} , paketin, uygulamanın paylaşılan framework sürümüyle eşleşen en son kararlı sürümü, NuGet. orgkonumundaki paketin sürüm geçmişinde bulunabilir.

Microsoft.Authentication.WebAssembly.MsalPaket geçişli Microsoft.AspNetCore.Components.WebAssembly.Authentication olarak uygulamayı uygulamaya ekler.

Kimlik doğrulama hizmeti desteği

Kullanıcıları kimlik doğrulama desteği, hizmet kapsayıcısında AddMsalAuthentication paket tarafından sağlanmış uzantı yöntemiyle kaydedilir Microsoft.Authentication.WebAssembly.Msal . Bu yöntem, uygulamanın Identity sağlayıcı (IP) ile etkileşim kurması için gereken hizmetleri ayarlar.

Program.cs:

builder.Services.AddMsalAuthentication(options =>
{
    builder.Configuration.Bind("AzureAd", options.ProviderOptions.Authentication);
});

AddMsalAuthenticationYöntemi, bir uygulamanın kimliğini doğrulamak için gereken parametreleri yapılandırmak için bir geri çağırma işlemini kabul eder. uygulamayı kaydettiğinizde, uygulamayı yapılandırmak için gereken değerler AAD yapılandırmadan elde edilebilir.

Yapılandırma dosya tarafından sağlanır wwwroot/appsettings.json :

{
  "AzureAd": {
    "Authority": "https://login.microsoftonline.com/{TENANT ID}",
    "ClientId": "{CLIENT ID}",
    "ValidateAuthority": true
  }
}

Örnek:

{
  "AzureAd": {
    "Authority": "https://login.microsoftonline.com/e86c78e2-...-918e0565a45e",
    "ClientId": "41451fa7-82d9-4673-8fa5-69eff5a761fd",
    "ValidateAuthority": true
  }
}

Erişim belirteci kapsamları

Blazor WebAssemblyŞablon, uygulamayı güvenli BIR API için erişim belirteci isteyecek şekilde otomatik olarak yapılandırmaz. Oturum açma akışının bir parçası olarak bir erişim belirteci sağlamak için, kapsamı varsayılan erişim belirteci kapsamlarına ekleyin MsalProviderOptions :

builder.Services.AddMsalAuthentication(options =>
{
    ...
    options.ProviderOptions.DefaultAccessTokenScopes.Add("{SCOPE URI}");
});

İle ek kapsamlar belirtin AdditionalScopesToConsent :

options.ProviderOptions.AdditionalScopesToConsent.Add("{ADDITIONAL SCOPE URI}");

AAD'ye kayıtlı bir sunucu API'si ile çalışırken ve uygulamanın AAD kaydı doğrulanmamış yayımcı etki alanını kullanan bir kiracıda olduğunda,sunucu API'si uygulamanın Uygulama Kimliği URI'si biçiminde api://{SERVER API APP CLIENT ID OR CUSTOM VALUE} https://{TENANT}.onmicrosoft.com/{SERVER API APP CLIENT ID OR CUSTOM VALUE} değildir. Bu durumda, uygulamanın içinde varsayılan erişim Program.cs belirteci Client kapsamı aşağıdakine benzer görünür:

options.ProviderOptions.DefaultAccessTokenScopes
    .Add("https://{TENANT}.onmicrosoft.com/{SERVER API APP CLIENT ID OR CUSTOM VALUE}/{DEFAULT SCOPE}");

Sunucu API uygulamasını eşleşen bir hedef kitle için yapılandırmak üzere API uygulaması ayarları dosyasındaki ( ) uygulamasını uygulamanın hedef kitlesi tarafından sağlanan hedef Audience Server appsettings.json kitleyle eş Azure portal:

{
  "AzureAd": {
    "Authority": "https://login.microsoftonline.com/{TENANT ID}",
    "ClientId": "{SERVER API APP CLIENT ID}",
    "ValidateAuthority": true,
    "Audience": "https://{TENANT}.onmicrosoft.com/{SERVER API APP CLIENT ID OR CUSTOM VALUE}"
  }
}

Yukarıdaki yapılandırmada, değerin Audience sonu varsayılan kapsamı dahil /{DEFAULT SCOPE} değildir.

Örnek:

Program.csUygulamanın Client içinde:

options.ProviderOptions.DefaultAccessTokenScopes
    .Add("https://contoso.onmicrosoft.com/41451fa7-82d9-4673-8fa5-69eff5a761fd/API.Access");

API uygulaması Server ayarları dosyasını ( ) eşleşen bir hedef appsettings.json kitleyle ( ) Audience yapılandırma:

{
  "AzureAd": {
    "Authority": "https://login.microsoftonline.com/e86c78e2-...-918e0565a45e",
    "ClientId": "41451fa7-82d9-4673-8fa5-69eff5a761fd",
    "ValidateAuthority": true,
    "Audience": "https://contoso.onmicrosoft.com/41451fa7-82d9-4673-8fa5-69eff5a761fd"
  }
}

Yukarıdaki örnekte, değerin sonu Audience varsayılan kapsamı /API.Access içermez.

Daha fazla bilgi için ek senaryolar makalesinin aşağıdaki bölümlerine bakın:

Dosya içeri aktarmalar

Ad Microsoft.AspNetCore.Components.Authorization alanı, dosya aracılığıyla uygulamanın her yerinde kullanılabilir _Imports.razor yapılır:

@using System.Net.Http
@using System.Net.Http.Json
@using Microsoft.AspNetCore.Components.Authorization
@using Microsoft.AspNetCore.Components.Forms
@using Microsoft.AspNetCore.Components.Routing
@using Microsoft.AspNetCore.Components.Web
@using Microsoft.AspNetCore.Components.Web.Virtualization
@using Microsoft.AspNetCore.Components.WebAssembly.Http
@using Microsoft.JSInterop
@using {APPLICATION ASSEMBLY}
@using {APPLICATION ASSEMBLY}.Shared

Dizin sayfası

<script src="_content/Microsoft.Authentication.WebAssembly.Msal/
    AuthenticationService.js"></script>

Uygulama bileşeni

Bileşeni App ( ) uygulamalarda bulunan App.razor App bileşene Blazor Server benzer:

Bileşeni, CascadingAuthenticationState uygulamanın geri AuthenticationState kalanına ifşayı yönetir.
Bileşen, AuthorizeRouteView geçerli kullanıcının belirli bir sayfaya erişme yetkisine sahip olduğundan veya başka bir şekilde bileşeni işlemeye yetkili olduğundan emin RedirectToLogin olur.
Bileşen, RedirectToLogin yetkisiz kullanıcıları oturum açma sayfasına yeniden yönlendirmeyi yönetir.

Kullanmak istediğiniz uygulamanın sürümü için varsayılan proje şablonundan kimlik Blazor WebAssembly doğrulaması için ASP.NET Core bir uygulama oluşturun. Oluşturulan App uygulamada bileşeni App.razor ( ) inceleme.
Başvuru App kaynağında App.razor bileşeni ( ) inceleme.

Not

Belge, ASP.NET Core kaynağı yüklemesi için ürün biriminin bir sonraki sürümü için geçerli geliştirmeyi temsil eden deponun dal main ASP.NET Core. Farklı bir sürümün dallarını seçmek için Dalları veya etiketleri değiştir açılan listesini kullanarak dalı seçin. Örneğin, ASP.NET Core release/5.0 5.0 sürümü için dalı seçin.

RedirectToLogin bileşeni

RedirectToLoginBileşen ( Shared/RedirectToLogin.razor ):

Yetkisiz kullanıcıların oturum açma sayfasına yeniden yönlendirildiğini yönetir.
Kimlik doğrulaması başarılı olursa bu sayfaya döndürülmeleri için kullanıcının erişmeye çalışan geçerli URL 'YI korur.

@inject NavigationManager Navigation
@using Microsoft.AspNetCore.Components.WebAssembly.Authentication
@code {
    protected override void OnInitialized()
    {
        Navigation.NavigateTo(
            $"authentication/login?returnUrl={Uri.EscapeDataString(Navigation.Uri)}");
    }
}

LoginDisplay bileşeni

Bileşeni LoginDisplay ( Shared/LoginDisplay.razor ) bileşeninde işlenir ( ) ve aşağıdaki MainLayout davranışları Shared/MainLayout.razor yönetir:

Kimliği doğrulanmış kullanıcılar için:
- Geçerli kullanıcı adını görüntüler.
- Uygulamada oturumun açık olduğu bir düğme sunar.
Anonim kullanıcılar için oturum açma seçeneği sunar.

@using Microsoft.AspNetCore.Components.Authorization
@using Microsoft.AspNetCore.Components.WebAssembly.Authentication
@inject NavigationManager Navigation
@inject SignOutSessionStateManager SignOutManager

<AuthorizeView>
    <Authorized>
        Hello, @context.User.Identity.Name!
        <button class="nav-link btn btn-link" @onclick="BeginLogout">
            Log out
        </button>
    </Authorized>
    <NotAuthorized>
        <a href="authentication/login">Log in</a>
    </NotAuthorized>
</AuthorizeView>

@code {
    private async Task BeginLogout(MouseEventArgs args)
    {
        await SignOutManager.SetSignOutState();
        Navigation.NavigateTo("authentication/logout");
    }
}

Kimlik doğrulama bileşeni

Bileşeni ( ) tarafından Authentication üretilen Pages/Authentication.razor sayfa, farklı kimlik doğrulama aşamalarını işleme için gereken yolları tanımlar.

RemoteAuthenticatorViewBileşen:

Paketi tarafından Microsoft.AspNetCore.Components.WebAssembly.Authentication sağlanır.
Kimlik doğrulamasının her aşamasında uygun eylemleri gerçekleştirmeyi yönetir.

@page "/authentication/{action}"
@using Microsoft.AspNetCore.Components.WebAssembly.Authentication

<RemoteAuthenticatorView Action="@Action" />

@code {
    [Parameter]
    public string Action { get; set; }
}

Sorun giderme

Sık karşılaşılan hatalar

Uygulamanın veya Identity sağlayıcının (IP) yanlış yapılandırılması

En yaygın hatalar yanlış yapılandırma nedeniyle oluşur. Aşağıda birkaç örnek verilmiştir:
- Senaryonun gereksinimlerine bağlı olarak, eksik veya yanlış bir yetkili, örnek, kiracı KIMLIĞI, kiracı etki alanı, Istemci KIMLIĞI veya yeniden yönlendirme URI 'SI, bir uygulamanın istemcilerin kimliğini doğrulamasını önler.
- Yanlış bir erişim belirteci kapsamı, istemcilerin sunucu Web API uç noktalarına erişmesini önler.
- Yanlış veya eksik sunucu API izinleri istemcilerin sunucu Web API uç noktalarına erişmesini önler.
- Uygulamayı, sağlayıcının uygulama kaydının yeniden yönlendirme URI 'sinde yapılandırılmış olandan farklı bir bağlantı noktasında çalıştırmak Identity .
Bu makalenin kılavuzunun yapılandırma bölümlerinde doğru yapılandırma örnekleri gösterilmektedir. Uygulama ve IP yanlış yapılandırmayla ilgili makalenin her bölümüne dikkatle göz atın.

Yapılandırma doğru görünüyorsa:
- Uygulama günlüklerini analiz edin.
- Tarayıcı geliştirici araçlarıyla istemci uygulaması ile IP veya sunucu uygulaması arasındaki ağ trafiğini inceleyin. Genellikle, bir istek yapıldıktan sonra, hataya neden olan bir hata iletisi veya bir sorun olduğunu bir ileti, IP veya sunucu uygulaması tarafından istemciye döndürülür. Geliştirici araçları Kılavuzu aşağıdaki makalelerde bulunur:
  - Google Chrome (Google belgeleri)
  - Microsoft Edge
  - Mozilla Firefox (Mozilla belgeleri)
- Bir istemcinin kimliğini doğrulamak için kullanılan bir JSON Web Token (JWT) içeriğinin kodunu çözün veya sorunun nerede oluştuğunu bağlı olarak bir sunucu Web API 'sine erişim. Daha fazla bilgi için bkz. bir JSON Web token (JWT) Içeriğini İnceleme.
Belgeler, makalelerdeki belge geri bildirimlerine ve hatalara yanıt veriyor ( Bu sayfa geri bildirimi bölümünden bir sorun açar), ancak ürün desteği sağlayamadı. Bir uygulamanın sorunlarını gidermeye yardımcı olmak için çeşitli genel destek forumları vardır. Şunları öneririz:
Önceki Forumlar Microsoft tarafından sahip değil veya denetlenmiyor.

güvenlikle ilgili olmayan, hassas olmayan ve gizli olmayan bir dizi framework hata raporu için ASP.NET Core ürün birimiyle bir sorun açın. Bir sorunun nedenini iyice araştırmadan ve bir genel destek forumundaki topluluk yardımıyla, ürün birimiyle ilgili bir sorun açmayın. Ürün birimi, basit yanlış yapılandırma veya üçüncü taraf hizmetleri içeren durumlar nedeniyle bozuk olan ayrı uygulamalarla ilgili sorunları gideremez. bir rapor hassas veya gizli ise ve saldırganların yararlanabilecek potansiyel bir güvenlik kusurunu kullanıyorsa, bkz. raporlama güvenlik sorunları ve hataları (dotnet/aspnetcore GitHub repository).
AAD için yetkisiz istemci

bilgi: Microsoft. AspNetCore. Authorization. DefaultAuthorizationService [2] yetkilendirmesi başarısız oldu. Bu gereksinimler karşılanmadı: DenyAnonymousAuthorizationRequirement: kimliği doğrulanmış bir kullanıcı gerektirir.

AAD oturum açma geri çağırma hatası:
- Hata: unauthorized_client
- Açıklaması AADB2C90058: The provided application is not configured to allow public clients.
Hatayı gidermek için:
1. Azure portal, uygulamanın bildirimineerişin.
2. allowPublicClient Özniteliğini veya olarak ayarlayın null true .

Cookies ve site verileri

Kullanıcı oturum açma cookie öğeleri
Uygulama cookie s
Önbelleğe alınmış ve depolanan site verileri

Kalan cookie s ve site verilerinin test ve sorun giderme konusunda kesintiye uğramasını önleyen bir yaklaşım:

Tarayıcı yapılandırma
- cookieTarayıcı her kapatıldığında tüm ve site verilerini silmek üzere yapılandırabileceğiniz test için bir tarayıcı kullanın.
- Uygulamanın, test kullanıcısının veya sağlayıcı yapılandırmasının herhangi bir değişikliği için tarayıcının el ile veya IDE tarafından kapatıldığından emin olun.
Visual Studio ' deki bir tarayıcıyı veya özel modda açmak için özel bir komut kullanın:
- Visual Studio çalıştır düğmesinden , iletişim kutusunu açın.
- Ekle düğmesini seçin.
- Program alanında tarayıcınızın yolunu belirtin. Aşağıdaki yürütülebilir yollar Windows 10 için tipik yükleme konumlarıdır. tarayıcınız farklı bir konuma yüklenirse veya Windows 10 kullanmıyorsanız, tarayıcının yürütülebilir dosyasının yolunu belirtin.
  - Microsoft Edge:C:\Program Files (x86)\Microsoft\Edge\Application\msedge.exe
  - Google Chrome: C:\Program Files (x86)\Google\Chrome\Application\chrome.exe
  - Mozilla Firefox: C:\Program Files\Mozilla Firefox\firefox.exe
- Bağımsız değişkenler alanında, tarayıcının ınbilito veya Private modunda açmak için kullandığı komut satırı seçeneğini belirtin. Bazı tarayıcılar uygulamanın URL 'sini gerektirir.
  - Microsoft Edge: kullanın -inprivate .
  - Google Chrome: Use --incognito --new-window {URL} , yer tutucunun {URL} açılacağı URL (örneğin, https://localhost:5001 ).
  - Mozilla Firefox: Use -private -url {URL} , yer tutucunun {URL} açılacağı URL (örneğin, https://localhost:5001 ).
- Kolay ad alanına bir ad girin. Örneğin, Firefox Auth Testing.
- Tamam düğmesini seçin.
- Her bir uygulamayla test yinelemesi için tarayıcı profilini seçmek zorunda kalmamak için, profili varsayılan olarak Ayarla düğmesi ile varsayılan olarak ayarlayın.
- Uygulamanın, test kullanıcısının veya sağlayıcı yapılandırmasındaki herhangi bir değişiklik için, tarayıcının IDE tarafından kapatıldığından emin olun.

Uygulama yükseltmeleri

bir komut kabuğundan yürüterek yerel sistemin NuGet paketi önbelleklerini temizleyin dotnet nuget locals all --clear .
Proje bin ve obj klasörlerini silin.
Projeyi geri yükleyin ve yeniden derleyin.
Uygulamayı yeniden dağıtmadan önce sunucusundaki dağıtım klasöründeki tüm dosyaları silin.

Not

Uygulamanın hedef çerçevesiyle uyumsuz paket sürümlerinin kullanımı desteklenmez. bir paket hakkında daha fazla bilgi için NuGet galerisi veya fuget paket gezgininikullanın.

Sunucu uygulamasını çalıştırma

Çalıştır düğmesini seçin.
Menüden hata > ayıklamayı Başlat komutunu kullanın.
F5tuşuna basın.

JSON Web Token (JWT) içeriğini İnceleme

Bir JSON Web Token (JWT) kodunu çözmek için Microsoft 'un JWT.MS aracını kullanın. Kullanıcı arabirimindeki değerler hiçbir şekilde tarayıcınızdan bırakmayın.

Örnek kodlanmış JWT (görüntülenmek üzere kısaltıldı):

eyJ0eXAiOiJKV1QiLCJhbGciOiJSUzI1NiIsImtpZCI6Ilg1ZVhrNHh5b2pORnVtMWtsMll0djhkbE5QNC1j ... bQdHBHGcQQRbW7Wmo6SWYG4V_bU55Ug_PW4pLPr20tTS8Ct7_uwy9DWrzCMzpD-EiwT5IjXwlGX3IXVjHIlX50IVIydBoPQtadvT7saKo1G5Jmutgq41o-dmz6-yBMKV2_nXA25Q

Azure AAD B2C 'da kimlik doğrulayan bir uygulama için araç tarafından kodu çözülen örnek JWT:

{
  "typ": "JWT",
  "alg": "RS256",
  "kid": "X5eXk4xyojNFum1kl2Ytv8dlNP4-c57dO6QGTVBwaNk"
}.{
  "exp": 1610059429,
  "nbf": 1610055829,
  "ver": "1.0",
  "iss": "https://mysiteb2c.b2clogin.com/5cc15ea8-a296-4aa3-97e4-226dcc9ad298/v2.0/",
  "sub": "5ee963fb-24d6-4d72-a1b6-889c6e2c7438",
  "aud": "70bde375-fce3-4b82-984a-b247d823a03f",
  "nonce": "b2641f54-8dc4-42ca-97ea-7f12ff4af871",
  "iat": 1610055829,
  "auth_time": 1610055822,
  "idp": "idp.com",
  "tfp": "B2C_1_signupsignin"
}.[Signature]

Tek başına ASP.NET Core Blazor WebAssembly uygulamanın güvenliğini Azure Active Directory

Lütfen deneyiminizi değerlendirin

Kimlik doğrulama paketi

Kimlik doğrulama hizmeti desteği

Erişim belirteci kapsamları

Oturum açma modu

İçeri aktarma dosyası

Dizin sayfası

Uygulama bileşeni

RedirectToLogin bileşeni

LoginDisplay bileşeni

Kimlik doğrulama bileşeni

Sorun giderme

Sık karşılaşılan hatalar

Cookies ve site verileri

Uygulama yükseltmeleri

Sunucu uygulamasını çalıştırma

JSON Web Token (JWT) içeriğini İnceleme

Ek kaynaklar

Kimlik doğrulama paketi

Kimlik doğrulama hizmeti desteği

Erişim belirteci kapsamları

Oturum açma modu

İçeri aktarma dosyası

Dizin sayfası

Uygulama bileşeni

RedirectToLogin bileşeni

LoginDisplay bileşeni

Kimlik doğrulama bileşeni

Sorun giderme

Sık karşılaşılan hatalar

Cookies ve site verileri

Uygulama yükseltmeleri

Sunucu uygulamasını çalıştırma

JSON Web Token (JWT) içeriğini İnceleme

Ek kaynaklar

Kimlik doğrulama paketi

Kimlik doğrulama hizmeti desteği

Erişim belirteci kapsamları

Dosya içeri aktarmalar

Dizin sayfası

Uygulama bileşeni

RedirectToLogin bileşeni

LoginDisplay bileşeni

Kimlik doğrulama bileşeni

Sorun giderme

Sık karşılaşılan hatalar

Cookies ve site verileri

Uygulama yükseltmeleri

Sunucu uygulamasını çalıştırma

JSON Web Token (JWT) içeriğini İnceleme

Ek kaynaklar