How to set consent cookie in Blazor Server

问题

I have a Blazor 3.1 App with Identity where I want to implement a cookie consent banner.

In classic ASP .NET Core, there is a nice template for a cookie consent banner.

@using Microsoft.AspNetCore.Http.Features

@{
    var consentFeature = Context.Features.Get<ITrackingConsentFeature>();
    var showBanner = !consentFeature?.CanTrack ?? false;
    var cookieString = consentFeature?.CreateConsentCookie();
}

@if (showBanner)
{
    <div class="container">
        <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 class="alert-link" asp-area="" asp-controller="Home" asp-action="Privacy">Learn More</a>.
            <button type="button" class="accept-policy close" data-dismiss="alert" aria-label="Close" data-cookie-string="@cookieString">
                <span aria-hidden="true">Accept</span>
            </button>
        </div>
    </div>
    <script>
        (function () {
            var button = document.querySelector("#cookieConsent button[data-cookie-string]");
            button.addEventListener("click", function (event) {
                document.cookie = button.dataset.cookieString;
            }, false);
        })();
    </script>
}

If you are placing this partial in the layout, you have a perfect working cookie consent banner. If configured appropriately, users cant even login to the Identity Framework until they consent.

Because Blazor does not know a HttpContext, this template is not working. Is there a boilerplate way or do I have to create this feature this by myself?

回答1:

I just solved this in a Blazor 3.1 app yesterday! I opted to use JS Interop and it was super easy.

My web app has multiple front ends, including MVC, Razor Pages and Blazor, so you can open the main solution file and then check out the Blazor project:

https://github.com/shahedc/NetLearnerApp

Things to note in the Blazor project;

I implemented the partial view as a razor component
look for /_CookieConsentPartial.razor in the Shared folder
MainLayout.razor uses this razor component
The _Host.cshtml file includes my js interop file
Look for netLearnerJsInterop.js in wwwroot
the js Interop file contains the document.cookie usage
the razor component uses JSRuntime.InvokeVoidAsync to call the JS method to accept the GDPR consent message and store the cookie

Hope that helps!

回答2:

To set cookies on the client, you still need Javascript Interop.

See this answer: How do I create a cookie client side using blazor

Alternatively, you could store the information you need in the Local Storage using this library, without having to write any Javascript:

https://github.com/Blazored/LocalStorage

来源：https://stackoverflow.com/questions/59529950/how-to-set-consent-cookie-in-blazor-server

标签

asp.net-identity

blazor

blazor-server-side