Blazor access to ProtectedLocalStorage on Identity pages UI - c#

I'm struggling with ProtectedLocalStorage on my Blazor Server App using ASP.NET Core Identity scaffolded UI for authentication.
What I'm trying to do is to have access to the ProtectedLocalStorage right after the login submission, but every time I try to do that, i get this error:
InvalidOperationException: JavaScript interop calls cannot be issued at this time. This is because the component is being statically rendered. When prerendering is enabled, JavaScript interop calls can only be performed during the OnAfterRenderAsync lifecycle method.
Obviously the first thing I've done is change the prerendering setting render-mode (on both Pages/_Host.cshtml and Pages/_Layout.cshtml) to Server, as written on the Microsoft official documentation, and that's ok for all the Razor Component inside the Pages directory: from these I'm able to use the ProtectedLocalStorage.
But when it comes to scaffolded Identity pages (like Areas/Identity/Pages/Account/Login.cshtml), I can't have access to it because of the prerendering (the error above).
Basically I want to write some variables right after the user has logged-in .
How can I disable the prerendering on those pages? If prerendering is not the issue, is there a way to have access to the ProtectedLocalStorage on the scaffolded Identity pages?

Related

Empty Identity in Blazor component hostet in an existing ASP.NET MVC application with .net6

In an exsisting ASP.NET MVC application, I will use Blazor Components to "migrate" in small steps to a Serverside Blazor app. At the moment, Serverside Blazor Pages are delivered by the ASP.NET MVC app. But I can't secure the Blazor parts, because the AuthorizeView Component and AuthenticationState had only an empty ClaimsPrincipal for a logged in user.
The authentication is against Azure AD B2C with MicrosoftIdentity and OpenID Connect.
There aren't error messages which can help.
Steps of implementation
I have added Blazor support to my existing ASP.NET MVC application.
I followed this guides
Syncfusion: how do you use blazor in an existing asp.net-mvc application
Chris Sanity: using blazor components in an existing mvc application
There are nearly equal.
This works fine. After that I tryed to add Blazor Server authentication, following the Microsoft Documentation.
I've added the CascadingAuthenticationState but the context in the authenticationStateTask and AuthorizeView Component got an empty identity.
At the same time is the user logged in with correct ClaimsPrincipal on the asp.net mvc
side.
It is noticeable that the TokenValidationParameters are not set in the ClaimsPrincipal on Blazor side.
What I've tried
Use a Serverside Blazor App to authenticate, successfully.
Inject a custom ClaimsPrincipal MS Documentation which appears in the AuthorizeView Component.
Use minimal of neccessary services and middleware to reduce disruptive factors and have focused the blazor context.
Injected IHttpContextAccessor -not recommended- and it has the empty ClaimsPrincipal too :(
Is there anybody who has the same problem and maybe solved yet?
Thanks in advance

What's the difference between RenderMode.Server and RenderMode.ServerPrerendered in blazor?

What's the difference between
#(await Html.RenderComponentAsync<Todo>(RenderMode.ServerPrerendered))
and
#(await Html.RenderComponentAsync<Todo>(RenderMode.Server))
I was looking into the documentation but couldn't really find something that explains the difference. and also don't really understand the code comments over the enum stating:
// Summary:
// Renders a marker for a Blazor server-side application. This doesn't include any
// output from the component. When the user-agent starts, it uses this marker to
// bootstrap a blazor application.
Server = 2,
//
// Summary:
// Renders the component into static HTML and includes a marker for a Blazor server-side
// application. When the user-agent starts, it uses this marker to bootstrap a blazor
// application.
ServerPrerendered = 3
What is happening behind the scenes?
And what are the Scenarios for using Server vs ServerPrerendered?
Explained at ASP.NET Core and Blazor updates in .NET Core 3.0 Preview 9:
Static Statically render the component with the specified parameters.
Server Render a marker where the component should be rendered interactively by the Blazor Server app.
ServerPrerendered Statically prerender the component along with a marker to indicate the component should later be rendered interactively by the Blazor Server app.
This concept is related to performance. The fastest way to serve a page is to render page statically then send, and, the slowest way to serve a page is to serve an "interactive Blazor" server page (with a live virtual DOM synchronized via SignalR websockets).
ServerPrerendered is a trade-off: Blazor pre-renders page and sends it as a static page, then later the page becomes an interactive Blazor server app. This behavior is intended to serve pages quickly to search engines with time-based positioning.
The main problem with ServerPrerendered is that it loads twice ,so your data layer code is also executed twice. Server mode is just ok, may be a bit slower.

Can we set server-side session by making http call?

I am migrating old ASP.NET WEB Form project to Angular app with ASP.NET web API.
The requirement is to merge the newly designed angular module (say login section) with old asp.net application. The new application should be functional and work together with the old ASP.NET web form project.
Now the problem I am facing is, when I log in and try to navigate to other .aspx pages, they need some session values (which old login page used to set) to work without breaking the application.
I tried to achieve this by making HTTP call to a dummy .aspx page. I passed all the session values as query parameters and set in on the server side. It's working fine.
Is it a right approach for achieving this or is there any better way? Will there be any complication later as the application grows?

How do I register an account on my MVC 5 Web App without using the form or webpage?

I have made a new project using the ASP.NET Web Application template in Visual Studio 2015. Then I selected MVC and Individual User Accounts to specify the template further. The solution I got is complete in that it offers me all the web pages you need for account management such as registering and logging in.
However, now I want to hook in a Xamarin.Forms mobile client to this account management scheme. I am making a native UI to register users, instead of redirecting them to a webpage or webview. I want to send user registration data, such as username and password, from this UI to the server so it will create an account. This means that I don't want to use the webpages offered by my MVC app, but rather send the registration data to the server and have it create an account, notfifying me of succes or failure.
I am anticipating that I would need to either use HTTP POSTs to login and registration endpoints in the AccountController or implement a public API. However, doing a post will return a webpage, and my client is not interested in a webpage.
I think one of the above should be possible to implement quite easily, but I am having a hard time searching for answers or methods, since I don't know how to phrase my problem properly, and with the abundance of guides on MVC, all my results are muddied.
Is my idea of this being possible flawed or have I missed a fundamental concept of MVC? What are the steps I should take in order to make this possible?
One misconception is that doing a POST will return a webpage. You can return any type of content from an MVC controller. But your account registration endpoints should be Web API controllers that return JSON. That JSON can be as simple as containing a boolean that indicates if the action was successful or not.
You do not need to use MVC at all. You can completely do away with the account controllers and views that the template created for you. Just copy the code that you need from the MVC controllers into your Web API methods.
You're right, this is quite easy to do.
I think, You can use ASP.NET Web API for doing this task. On server, you host your API for registering the users as well as logging into some client application.
Now, You need to consume this API in a client application. The client application could be a Console application, Windows application or a Web application. There are lots of tutorials about making an Web API on official ASP.NET site.

People picker control implementation in asp.net mvc application

I want to include the Sharepoint people picker control type in my application, My app is developed in asp.net MVC. is there a way so that i can include the GAL feature in my asp.net application. This should work even if the outlook is not installed in user pc.
Taken from this page dated March 1 2013
"SP controls can only be used on SP hosted pages. Currently the only control designed from the ground up to be consumed on all page types (provider-hosted, auto-hosted or sp hosted) is the chrome control."
and another post from an MSFT
"I've consulted with several colleagues and the consensus seems to be that SharePoint's client side people picker, which is JavaScript, cannot be used in a provider-hosted app. The reason is that there's no way to get a client context on a remote web page. You mention the TokenHelper.cs which is managed code, not JavaScript. I have a question pending with the product team to see if there's anyway to get the context with managed code and pass it to JavaScript. I didn't want you to have to wait any longer for an answer."
I would suggest writing a plugin. (Although I have never had the requirement to implement it YET)
How :
you write a controller that loads users from AD, and then send a JSON object of these to your client via AJAX and then use jquery auto complete to filter names as the user types.
Or
Simulate the "check User " button by making AJAX calls to that controller and check if name exist on click of that button. then write appropriate error messages if false.
I would still be on the lookout for other solutions though

Categories

Resources