Skip to content

Blazor server DelegatingHandler for http client causing JavaScript error with prerendering disabled #40336

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
1 task done
McVanS opened this issue Feb 21, 2022 · 10 comments
Closed
1 task done
Labels
area-blazor Includes: Blazor, Razor Components feature-blazor-server

Comments

@McVanS
Copy link

McVanS commented Feb 21, 2022

Is there an existing issue for this?

  • I have searched the existing issues

Describe the bug

Converting an application to Blazor server, I was going to use HttpFactory. Initial code worked as expected. While refactoring the Http client was changed and setup to use a DelegatingHandler with the aim of retrieving token information from protected local storage and adding the authentication header to the client instead of manually adding the header per http client session. A javascript error occurs with in the DelegatingHandler when the protected local storage function is executed despite prerendering being disabled and the action being triggered by a button click which is outside the rendering cycle.

Expected Behavior

With server prerendering disabled there should not be no difference between accessing protected local storage directly or using a DelegatingHandler and then accessing protected local storage when needed. Raising a prerendering error when prerendering is disabled is a little confusing.

Steps To Reproduce

https://github.com/McVanS/DelegatingHandler-problem-project

Exceptions (if any)

[2022-02-21T13:00:45.690Z] Error: System.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.
at Microsoft.AspNetCore.Components.Server.Circuits.RemoteJSRuntime.BeginInvokeJS(Int64 asyncHandle, String identifier, String argsJson, JSCallResultType resultType, Int64 targetInstanceId)
at Microsoft.JSInterop.JSRuntime.InvokeAsync[TValue](Int64 targetInstanceId, String identifier, CancellationToken cancellationToken, Object[] args)
at Microsoft.JSInterop.JSRuntime.InvokeAsync[TValue](Int64 targetInstanceId, String identifier, Object[] args)
at Microsoft.AspNetCore.Components.Server.ProtectedBrowserStorage.ProtectedBrowserStorage.GetAsync[TValue](String purpose, String key)
at DelegatingHandlerProblem.AuthenticationHeaderHandler.GetTokenAsync() in C:\Temp\DelegatingHandler problem project\DelegatingHandlerProblem\AuthenticationHeaderHandler.cs:line 39
at DelegatingHandlerProblem.AuthenticationHeaderHandler.SendAsync(HttpRequestMessage request, CancellationToken cancellationToken) in C:\Temp\DelegatingHandler problem project\DelegatingHandlerProblem\AuthenticationHeaderHandler.cs:line 15
at Microsoft.Extensions.Http.Logging.LoggingScopeHttpMessageHandler.SendAsync(HttpRequestMessage request, CancellationToken cancellationToken)
at System.Net.Http.HttpClient.g__Core|83_0(HttpRequestMessage request, HttpCompletionOption completionOption, CancellationTokenSource cts, Boolean disposeCts, CancellationTokenSource pendingRequestsCts, CancellationToken originalCancellationToken)
at DelegatingHandlerProblem.Pages.Index.ErrorHttpClient() in C:\Temp\DelegatingHandler problem project\DelegatingHandlerProblem\Pages\Index.razor:line 90
at Microsoft.AspNetCore.Components.ComponentBase.CallStateHasChangedOnAsyncCompletion(Task task)
at Microsoft.AspNetCore.Components.RenderTree.Renderer.GetErrorHandledTask(Task taskToHandle, ComponentState owningComponentState)

.NET Version

6.0.102

Anything else?

I have seen this issue in the MAUI Blazor section. I have been researching for a few days now with no definitive answer to this problem. If the capability is there to setup a http client like this but Blazor Server for some reason can not utilize such settings surly the documentation would point that out.

Thank you for reading up to here.
Your effort is appreciated.

@javiercn javiercn added area-blazor Includes: Blazor, Razor Components feature-blazor-server labels Feb 21, 2022
@SteveSandersonMS
Copy link
Member

Thanks for contacting us, @McVanS.

The underlying issue here is the same as #25758, which we're planning to come up with a design for in .NET 7.

@SteveSandersonMS
Copy link
Member

I'll put this on backlog, but it will be linked to #25758 and should be resolved at the same time.

@SteveSandersonMS SteveSandersonMS added this to the Backlog milestone Feb 21, 2022
@ghost
Copy link

ghost commented Feb 21, 2022

We've moved this issue to the Backlog milestone. This means that it is not going to be worked on for the coming release. We will reassess the backlog following the current release and consider this item at that time. To learn more about our issue management process and to have better expectation regarding different types of issues you can read our Triage Process.

@McVanS McVanS closed this as completed Feb 22, 2022
@SimonCropp
Copy link
Contributor

@SteveSandersonMS should this have been closed?

@SteveSandersonMS
Copy link
Member

@SimonCropp, no - reopening. Thanks for pointing this out!

@SimonCropp
Copy link
Contributor

@SteveSandersonMS thanks

@mreyeros
Copy link

Is there a known work around for this available? I am running into this scenario as well when attempting to add a user token in a delegating handler

@mreyeros
Copy link

I was actually able to get around this in my case by moving the code to append the headers into a service class that utilized the HttpClient implementation that called my api. Once the code was moved, I was able to successfully attach the headers to the api requests that I needed to make.

@MackinnonBuck
Copy link
Member

MackinnonBuck commented Dec 5, 2023

Closing this out since the feature described by #30287 should have implemented everything necessary to support this scenario.

@Alan-Steadman
Copy link

Alan-Steadman commented Dec 29, 2023

Should this be closed? I'm still getting the issue described by the OP in Blazor .Net 8.

A delegating handler that tries to access protected storage, either from a button click or OnAfterRenderAsync, from a page with @rendermode InteractiveServer, gives 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.

The error message actually contradicts the scenario, insofar as it is performed during the OnAfterRenderAsync.

Should a DelegatingHandler not be used for that scenario? Can you give advice on what should be used instead?

Thanks for your efforts

@ghost ghost locked as resolved and limited conversation to collaborators Feb 7, 2024
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
area-blazor Includes: Blazor, Razor Components feature-blazor-server
Projects
None yet
Development

No branches or pull requests

8 participants