ASP.NET Core'da AB Genel Veri Koruma Yönetmeliği (GDPR) desteği Blazor

Bu makalede, AB Genel Veri Koruma Yönetmeliği (GDPR) gereksinimleri için nasıl destek sağlanacağı açıklanmaktadır.

Program dosyasında:

• Temel olmayan tanımlama bilgileri için kullanıcı onayı istemek üzere CookiePolicyOptions yapılandırmasını ekleyin ve aynı site ilkesini hiçbiri olarak ayarlayın. Daha fazla bilgi için bkz. ASP.NET Core'da SameSite tanımlama bilgileriyle çalışma.
• IHttpContextAccessorçağırarak AddHttpContextAccessor hizmeti için varsayılan uygulamayı ekleyin.

builder.Services.Configure<CookiePolicyOptions>(options =>
{
    options.CheckConsentNeeded = context => true;

    options.MinimumSameSitePolicy = SameSiteMode.None;
});

builder.Services.AddHttpContextAccessor();

Programçağrısından önceki MapRazorComponents dosyasında, Cookieçağrıldığında UseCookiePolicy Politika Ara Yazılımını ekleyin.

app.UseCookiePolicy();

CookieConsent ilke onayını işlemek için aşağıdaki cookie bileşenini ekleyin.

Bileşen, modülü yüklemek için adlı CookieConsent.razor.jskullanır. OnAfterRenderAsync yönteminde birlikte bulunan dosyanın yolunu onaylayın veya ayarlayın. Aşağıdaki bileşen, bileşenin ve yardımcı JavaScript dosyasının uygulamanın Components klasöründe olduğunu varsayar.

CookieConsent.razor:

@using Microsoft.AspNetCore.Http.Features
@using Microsoft.AspNetCore.Http
@implements IAsyncDisposable
@inject IHttpContextAccessor Http
@inject IJSRuntime JS

@if (showBanner)
{
    <div id="cookieConsent" class="alert alert-info alert-dismissible fade show" 
        role="alert">
        Use this space to summarize your privacy and cookie use policy.
        <a href="/privacy">Privacy Policy</a>
        <button type="button" @onclick="AcceptPolicy" class="accept-policy close" 
            data-bs-dismiss="alert" aria-label="Close" 
            data-cookie-string="@cookieString">
            Accept
        </button>
    </div>
}
@code {
    private IJSObjectReference? module;
    private ITrackingConsentFeature? consentFeature;
    private bool showBanner;
    private string? cookieString;

    protected override void OnInitialized()
    {
        consentFeature = Http.HttpContext?.Features.Get<ITrackingConsentFeature>();
        showBanner = !consentFeature?.CanTrack ?? false;
        cookieString = consentFeature?.CreateConsentCookie();
    }

    protected override async Task OnAfterRenderAsync(bool firstRender)
    {
        if (firstRender)
        {
            module = await JS.InvokeAsync<IJSObjectReference>("import",
                "./Components/CookieConsent.razor.js");
        }
    }

    private async Task AcceptPolicy()
    {
        if (module is not null)
        {
            await module.InvokeVoidAsync("acceptPolicy", cookieString);
            showBanner = false;
        }
    }

    async ValueTask IAsyncDisposable.DisposeAsync()
    {
        if (module is not null)
        {
            try
            {
                await module.DisposeAsync();
            }
            catch (JSDisconnectedException)
            {
            }
        }
    }
}

JavaScript modülünde işlevini korumak için aşağıdaki acceptPolicy'i ekleyin.

CookieConsent.razor.js:

export function acceptPolicy(cookieString) {
  document.cookie = cookieString;
}

<main> bileşeninin (Razor) MainLayoutMainLayout.razor işaretlemesi içinde CookieConsent bileşenini ekleyin:

<CookieConsent />

cookie onay değerini özelleştirme

cookie onay değerini belirtmek için CookiePolicyOptions.ConsentCookieValue'e özel bir dize atayın. Aşağıdaki örnek, "yes" varsayılan değerini "true" olarak değiştirir.

options.ConsentCookieValue = "true";

Blazor WebAssembly uygulamalarda yerel depolama, kullanıcının bir sitenin cookie politikasını kabul edişini muhafaza etmek için kullanışlı bir yaklaşımdır. Aşağıdaki yöntem bu yaklaşımı gösterir.

Uygulamanın paylaşılan bileşenler için bir Shared klasörü yoksa, uygulamaya bir Shared klasörü ekleyin.

Paylaşılan bileşenler için ad alanını _Imports.razor dosyasına ekleyin. Aşağıdaki örnekte uygulamanın ad alanı BlazorSampleve paylaşılan klasörün ad alanı BlazorSample.Shared:

@using BlazorSample.Shared

CookieConsent ilke onayını işlemek için aşağıdaki cookie bileşenini ekleyin.

Shared/CookieConsent.razor:

@implements IAsyncDisposable
@inject IJSRuntime JS

@if (showBanner)
{
    <div id="cookieConsent" class="alert alert-info alert-dismissible fade show"
        role="alert">
        Use this space to summarize your privacy and cookie use policy.
        <a href="/privacy">Privacy Policy</a>
        <button type="button" @onclick="AcceptPolicy" class="accept-policy close"
            data-bs-dismiss="alert" aria-label="Close">
            <span aria-hidden="true">Accept</span>
        </button>
    </div>
}
@code {
    private IJSObjectReference? module;
    private bool showBanner = false;

    protected override async Task OnAfterRenderAsync(bool firstRender)
    {
        if (firstRender)
        {
            module = await JS.InvokeAsync<IJSObjectReference>("import",
                "./Shared/CookieConsent.razor.js");
            showBanner = !await module.InvokeAsync<bool>("getCookiePolicyAccepted");
            StateHasChanged();
        }
    }

    private async Task AcceptPolicy()
    {
        if (module is not null)
        {
            await module.InvokeVoidAsync("setCookiePolicyAccepted");
            showBanner = false;
        }
    }

    async ValueTask IAsyncDisposable.DisposeAsync()
    {
        if (module is not null)
        {
            try
            {
                await module.DisposeAsync();
            }
            catch (JSDisconnectedException)
            {
            }
        }
    }
}

JavaScript modülünde ve setCookiePolicyAccepted işlevlerini korumak için aşağıdaki getCookiePolicyAccepted ekleyin.

Shared/CookieConsent.razor.js:

export function getCookiePolicyAccepted() {
  const cookiePolicy = localStorage.getItem('CookiePolicyAccepted');
  return cookiePolicy === 'yes' ? true : false;
}

export function setCookiePolicyAccepted() {
  localStorage.setItem('CookiePolicyAccepted', 'yes');
}

Yukarıdaki örnekte, "CookiePolicyAccepted" ve "yes" olan yerel depolama öğesinin adını ve değerini tercih edilen değerlerle değiştirebilirsiniz. Bir veya iki değeri de değiştirirseniz, her iki işlevi de güncelleştirin.

<main> bileşeninin (Razor) MainLayoutLayout/MainLayout.razor işaretlemesi içinde CookieConsent bileşenini ekleyin:

<CookieConsent />

Ek kaynaklar

• Microsoft Güven Merkezi: Microsoft'un bulut hizmetleriyle bireysel gizliliği koruma: GDPR
• Avrupa Komisyonu: Veri koruma açıklandı