web-dev-qa-db-ja.com

Blazor Serverで同意Cookieを設定する方法

私は、Cookie同意バナーを実装したいIDのBlazor 3.1アプリを持っています。

従来の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同意バナーがあります。適切に構成されている場合、ユーザーは同意するまでIdentity Frameworkにログインすることもできません。

BlazorはHttpContextを認識しないため、このテンプレートは機能しません。定型的な方法はありますか、またはこの機能を自分で作成する必要がありますか?

3
Ned Flanders

私は昨日、これをBlazor 3.1アプリで解決しました!私はJS Interopの使用を選択しましたが、それは非常に簡単でした。

私のWebアプリには、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の使用法が含まれています

  • かみそりコンポーネントはJSRuntime.InvokeVoidAsyncを使用してJSメソッドを呼び出し、GDPR同意メッセージを受け入れ、Cookieを保存します

お役に立てば幸いです。

4
Shahed C - MSFT

クライアントにCookieを設定するには、JavaScriptの相互運用が必要です。

この回答を参照してください: blazorを使用してcookieクライアント側を作成するにはどうすればよいですか

または、Javascriptを記述せずに、このライブラリを使用して必要な情報をローカルストレージに保存することもできます。

https://github.com/Blazored/LocalStorage

1
tocqueville