如何在 Blazor 服务器中设置同意 cookie

Question

我有一个带有标识的 Blazor 3.1 应用程序，我想在其中实施 cookie 同意横幅。

在经典 ASP .NET Core 中，有一个不错的 cookie 同意横幅模板。

    @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>
    }

如果您将此部分放在布局中，您将拥有一个完美的工作 cookie 同意横幅。如果配置得当，用户在同意之前甚至无法登录身份框架。

因为 Blazor 不知道 HttpContext，所以这个模板不起作用。有样板方式还是我必须自己创建此功能？

Answer 1

要在客户端设置 cookie，您仍然需要 Javascript Interop。

看到这个答案：

或者，您可以使用此库将所需信息存储在本地存储中，而无需编写任何 Javascript:

https://github.com/Blazored/LocalStorage

Answer 2

我昨天刚刚在 Blazor 3.1 应用程序中解决了这个问题！我选择使用 JS Interop，它非常简单。

我的网络应用程序有多个前端，包括 MVC、Razor Pages 和 Blazor，因此您可以打开主要解决方案文件，然后查看 Blazor 项目：

https://github.com/shahedc/NetLearnerApp

Blazor项目中的注意事项；

我将部分视图实现为剃须刀组件
在共享文件夹中查找/_CookieConsentPartial.razor
MainLayout.razor 使用此剃须刀组件
_Host.cshtml 文件包含我的 js 互操作文件
在 wwwroot
中寻找 netLearnerJsInterop.js
js Interop 文件包含 document.cookie 用法
razor组件使用JSRuntime.InvokeVoidAsync调用JS方法接受GDPR同意消息并存储cookie

Answer 3

您可以使用 Nuget 中的这个 GDPR 同意组件。

然而，它只是帮助您节省 UI 方面的工作。用户选择的 Cookie 设置存储在本地存储中，可以随时读取。 但它不会自动限制任何 Cookie 或跟踪脚本。这必须由应用程序开发人员完成！

在 demo page 上查看实际效果。

如何在 Blazor 服务器中设置同意 cookie

How to set consent cookie in Blazor Server

c#

cookies

asp.net-identity

blazor

blazor-server-side