web-dev-qa-db-ja.com

Blazor ServerアプリケーションのログインページにreturnUrlを渡すにはどうすればよいですか？

私は、個人認証を使用するIDを使用した単純なBlazorサーバーアプリケーションがあります。私はVS 2019標準からアプリを作成しましたdotnet new テンプレート。

アプリの一部で、returnUrlパラメーターを渡しながら、ユーザーをログインページに誘導したいと思います。このパラメーターを渡すために、次のコードのバリエーションを試しました（counterは戻りたいページです）：

NavigationManager.NavigateTo("Identity/Account/Login?returnUrl=counter", forceLoad: true);

NavigationManager.NavigateTo("Identity/Account/Login?returnUrl='/counter'", forceLoad: true);

NavigationManager.NavigateTo("Identity/Account/Login?returnUrl='./counter'", forceLoad: true);

NavigationManager.NavigateTo("Identity/Account/Login?returnUrl='~/counter'", forceLoad: true);

ただし、これらすべての場合、「URIはローカルではありません」というエラーメッセージが表示されます。エラーメッセージは次のとおりです。

"InvalidOperationException：指定されたURLはローカルではありません。絶対パスを持つURLは、ホスト/権限部分がない場合、ローカルと見なされます。仮想パス（ '〜/'）を使用するURLもローカルです。"

この状況でreturnUrlパラメータの適切なフォーマットを提案できますか？さらに詳しい背景については、Blazorアプリのログインページへのリダイレクトについて、@ iambacon（Colinに感謝します）の提案 ブログ投稿 を参照しています。これはすばらしい記事であり、ユーザーが認証されていないときにログインにリダイレクトするという、私が望むことの一部を実現します。認証が完了した後、そのURLに戻るという追加機能を追加したいと思います。

c#serveridentityblazor
4
Randy Gamage

「URIはローカルではありません」。

これを解決するには...

以下をせよ：

  1. 次のコードを使用して、RedirectToLoginという名前のコンポーネントをPagesフォルダーに作成します。

RedirectToLogin.razor

@inject NavigationManager NavigationManager

@code{
  [Parameter]
  public string ReturnUrl {get; set;}
  protected override  void OnInitialized()
  {
        ReturnUrl = "~/" + ReturnUrl;
        NavigationManager.NavigateTo($"Identity/Account/Login?returnUrl= 
       {ReturnUrl}", forceLoad:true);
  }
}

App.razorを開き、次のコードをAuthorizeRouteView.NotAuthorizedに追加します。

<NotAuthorized>
@{
    var returnUrl = 
    NavigationManager.ToBaseRelativePath(NavigationManager.Uri);
    <RedirectToLogin ReturnUrl="@returnUrl"/>

 }
</NotAuthorized>

また、次のように、Appコンポーネントの上部にNavigationManagerを挿入します。

@inject NavigationManager NavigationManager

これをテストするには、Fetchdata（または、必要に応じてCounter）コンポーネントページの上部に、次のようにAuthorize属性の@attributeディレクティブを追加します。@attribute [Authorize]認証されていないユーザーがFetchdataページにアクセスしようとすると、AuthorizeRouteView.NotAuthorizedデリゲートプロパティが実行され、RedirectToLoginコンポーネントのパラメーター属性が現在のURLに設定されてレンダリングされます。

更新

次の追加は、アプリにログインおよびログアウトボタンを追加することです...

  1. SharedDisplay.razorという名前のコンポーネントをSharedフォルダーに作成し、次のコードを追加します。
     <AuthorizeView>
      <Authorized>
        <a href="Identity/Account/Manage">Hello, 
        @context.User.Identity.Name!</a>
        <form method="post" action="Identity/Account/LogOut">
            <button type="submit" class="nav-link btn btn-link">Log 
        out</button>
        </form>
      </Authorized>
         <NotAuthorized>
            <a href="Identity/Account/Register">Register</a>
            <a href="Identity/Account/Login">Log in</a>
         </NotAuthorized>
      </AuthorizeView>

MainLayoutコンポーネントで、次のようにLoginDisplay要素を追加します。

<div class="top-row px-4 auth">
    <LoginDisplay />
    <a href="https://docs.Microsoft.com/aspnet/" 
         target="_blank">About</a>
</div>

アプリを実行し、ログインおよびログアウトボタンをテストします...

5
enet