Adding Sigin and Signout button in ViewComponent

KK
KK
Vote:
 

Hi guys,

I was integrating Azure B2C to a site. The B2C setup is ready. I am trying to add a sign in and out buttons.

So I created a ViewComponent with two buttons and get it involved in the start page.

The ViewComponent is like below. It is not working and the attributes (asp-controller, asp-action) are not recognized as well. How can I make it work?

@if (@Model.IsAuthenticated)
{
        <div class="d-flex flex-row-reverse">
            <div class="p-1"><h4 class="mt-1">@Model.Name</h4></div>
            <div class="p-1">
                 <form method="get" asp-controller="Account" asp-action="SignOut">
                     <button type="submit" class="btn btn-primary">Sign Out</button>
                 </form>
            </div>
        </div>
}
else
{
    <div class="d-flex flex-row-reverse">
        <div class="p-1">
            <form method="get" asp-controller="Account" asp-action="SignIn">
                <button type="submit" class="btn btn-primary">Sign Up/In</button>
            </form>
        </div>
    </div>
}

Any ideas and suggestions would be highly appreciated.

#298575
Mar 19, 2023 1:51
Vote:
 

Hi KK

Usually for OpenID authentication, I would just use button-styled links for this:

  • I would add mapping of an "/logout" URL to the authentication middleware, which calls the logout flow and returns to the start page.
  • For the login button, I would make it link to the "My Profile" page, which happens to require the "Authenticated" virtual role. So this would automatically initiate the authentication flow (redirect to the Azure AD B2C platform).

Hopes this helps.

#298578
Mar 19, 2023 18:09
KK
Vote:
 

Thanks @Stefan. I am trying to do the similiar thing.

But looks like the tag helpers does not get recognized.

asp-controller="Account" asp-action="SignIn"
#298757
Mar 22, 2023 0:51
* You are NOT allowed to include any hyperlinks in the post because your account hasn't associated to your company. User profile should be updated.