search

dotnet / aspnetcore

ASP.NET Core is a cross-platform .NET framework for building modern cloud-based web applications on Windows, Mac, or Linux.
https://asp.net
MIT License
35.57k stars 10.05k forks source link

AuthenticationService.js 404 not found in Blazor Multi Application #39922

Closed latala43 closed 2 years ago

latala43 commented 2 years ago

Is there an existing issue for this?

Describe the bug

When I try to use Authentication in my multi-WebAssembly Blazor applications, I receive the error that AuthenticationService.js is 404 not found.

The Blazor applications is working fine as the instructions here or here.

Also each Blazor application working fine if they are working from the root https://localhost even with authentication to my IdentityServer4.

Once I port them to https://localhost/FirstApp the following script is not working:

I receive the 404 not found.

I think that StaticWebAssetBasePath does not load the _cocntents as it should be.

My Question is: How to load the AuthenticationService.js when working with multiple Blazor WebAssembly application without receiving the 404 not found?

I try the answer in this link but with no luck:

Expected Behavior

_content should be loaded as expected from dotnet assembly even ported to side applications.

Steps To Reproduce

Add to any of the clients in this project this project

Exceptions (if any)

AuthenticationService.js:1 

   Failed to load resource: the server responded with a status of 404 ()

Failed to load resource: the server responded with a status of 404 () blazor.webassembly.js:1 Debugging hotkey: Shift+Alt+D (when application has focus) blazor.webassembly.js:1 blazor Loaded 10.41 MB resourcesThis application was built with linking (tree shaking) disabled. Published applications will be significantly smaller. blazor.webassembly.js:1 

   crit: Microsoft.AspNetCore.Components.WebAssembly.Rendering.WebAssemblyRenderer[100]
  Unhandled exception rendering component: Could not find 'AuthenticationService.init' ('AuthenticationService' was undefined).
  Error: Could not find 'AuthenticationService.init' ('AuthenticationService' was undefined).
      at https://192.168.1.101:7000/FirstApp/_framework/blazor.webassembly.js:1:328
      at Array.forEach (<anonymous>)
      at a.findFunction (https://192.168.1.101:7000/FirstApp/_framework/blazor.webassembly.js:1:296)
      at _ (https://192.168.1.101:7000/FirstApp/_framework/blazor.webassembly.js:1:2437)
      at https://192.168.1.101:7000/FirstApp/_framework/blazor.webassembly.js:1:3325
      at new Promise (<anonymous>)
      at Object.beginInvokeJSFromDotNet (https://192.168.1.101:7000/FirstApp/_framework/blazor.webassembly.js:1:3306)
      at Object.Rt [as invokeJSFromDotNet] (https://192.168.1.101:7000/FirstApp/_framework/blazor.webassembly.js:1:59738)
      at _mono_wasm_invoke_js_blazor (https://192.168.1.101:7000/FirstApp/_framework/dotnet.6.0.1.wpmoizgmhd.js:1:194546)
      at wasm://wasm/009705ea:wasm-function[219]:0x1a129

Microsoft.JSInterop.JSException: Could not find 'AuthenticationService.init' ('AuthenticationService' was undefined). Error: Could not find 'AuthenticationService.init' ('AuthenticationService' was undefined). at https://192.168.1.101:7000/FirstApp/_framework/blazor.webassembly.js:1:328 at Array.forEach () at a.findFunction (https://192.168.1.101:7000/FirstApp/_framework/blazor.webassembly.js:1:296) at _ (https://192.168.1.101:7000/FirstApp/_framework/blazor.webassembly.js:1:2437) at https://192.168.1.101:7000/FirstApp/_framework/blazor.webassembly.js:1:3325 at new Promise () at Object.beginInvokeJSFromDotNet (https://192.168.1.101:7000/FirstApp/_framework/blazor.webassembly.js:1:3306) at Object.Rt [as invokeJSFromDotNet] (https://192.168.1.101:7000/FirstApp/_framework/blazor.webassembly.js:1:59738) at _mono_wasm_invoke_js_blazor (https://192.168.1.101:7000/FirstApp/_framework/dotnet.6.0.1.wpmoizgmhd.js:1:194546) at wasm://wasm/009705ea:wasm-function[219]:0x1a129 at Microsoft.JSInterop.JSRuntime.d161[[Microsoft.JSInterop.Infrastructure.IJSVoidResult, Microsoft.JSInterop, Version=6.0.0.0, Culture=neutral, PublicKeyToken=adb9793829ddae60]].MoveNext() at Microsoft.JSInterop.JSRuntimeExtensions.InvokeVoidAsync(IJSRuntime jsRuntime, String identifier, Object[] args) at Microsoft.AspNetCore.Components.WebAssembly.Authentication.RemoteAuthenticationService3.d27[[Microsoft.AspNetCore.Components.WebAssembly.Authentication.RemoteAuthenticationState, Microsoft.AspNetCore.Components.WebAssembly.Authentication, Version=6.0.1.0, Culture=neutral, PublicKeyToken=adb9793829ddae60],[Microsoft.AspNetCore.Components.WebAssembly.Authentication.RemoteUserAccount, Microsoft.AspNetCore.Components.WebAssembly.Authentication, Version=6.0.1.0, Culture=neutral, PublicKeyToken=adb9793829ddae60],[Microsoft.AspNetCore.Components.WebAssembly.Authentication.ApiAuthorizationProviderOptions, Microsoft.AspNetCore.Components.WebAssembly.Authentication, Version=6.0.1.0, Culture=neutral, PublicKeyToken=adb9793829ddae60]].MoveNext() at Microsoft.AspNetCore.Components.WebAssembly.Authentication.RemoteAuthenticationService3.<GetAuthenticatedUser>d__26[[Microsoft.AspNetCore.Components.WebAssembly.Authentication.RemoteAuthenticationState, Microsoft.AspNetCore.Components.WebAssembly.Authentication, Version=6.0.1.0, Culture=neutral, PublicKeyToken=adb9793829ddae60],[Microsoft.AspNetCore.Components.WebAssembly.Authentication.RemoteUserAccount, Microsoft.AspNetCore.Components.WebAssembly.Authentication, Version=6.0.1.0, Culture=neutral, PublicKeyToken=adb9793829ddae60],[Microsoft.AspNetCore.Components.WebAssembly.Authentication.ApiAuthorizationProviderOptions, Microsoft.AspNetCore.Components.WebAssembly.Authentication, Version=6.0.1.0, Culture=neutral, PublicKeyToken=adb9793829ddae60]].MoveNext() at Microsoft.AspNetCore.Components.WebAssembly.Authentication.RemoteAuthenticationService3.d25[[Microsoft.AspNetCore.Components.WebAssembly.Authentication.RemoteAuthenticationState, Microsoft.AspNetCore.Components.WebAssembly.Authentication, Version=6.0.1.0, Culture=neutral, PublicKeyToken=adb9793829ddae60],[Microsoft.AspNetCore.Components.WebAssembly.Authentication.RemoteUserAccount, Microsoft.AspNetCore.Components.WebAssembly.Authentication, Version=6.0.1.0, Culture=neutral, PublicKeyToken=adb9793829ddae60],[Microsoft.AspNetCore.Components.WebAssembly.Authentication.ApiAuthorizationProviderOptions, Microsoft.AspNetCore.Components.WebAssembly.Authentication, Version=6.0.1.0, Culture=neutral, PublicKeyToken=adb9793829ddae60]].MoveNext() at Microsoft.AspNetCore.Components.WebAssembly.Authentication.RemoteAuthenticationService`3.d17[[Microsoft.AspNetCore.Components.WebAssembly.Authentication.RemoteAuthenticationState, Microsoft.AspNetCore.Components.WebAssembly.Authentication, Version=6.0.1.0, Culture=neutral, PublicKeyToken=adb9793829ddae60],[Microsoft.AspNetCore.Components.WebAssembly.Authentication.RemoteUserAccount, Microsoft.AspNetCore.Components.WebAssembly.Authentication, Version=6.0.1.0, Culture=neutral, PublicKeyToken=adb9793829ddae60],[Microsoft.AspNetCore.Components.WebAssembly.Authentication.ApiAuthorizationProviderOptions, Microsoft.AspNetCore.Components.WebAssembly.Authentication, Version=6.0.1.0, Culture=neutral, PublicKeyToken=adb9793829ddae60]].MoveNext() at Microsoft.AspNetCore.Components.Authorization.AuthorizeViewCore.OnParametersSetAsync() at Microsoft.AspNetCore.Components.ComponentBase.CallStateHasChangedOnAsyncCompletion(Task task) at Microsoft.AspNetCore.Components.ComponentBase.RunInitAndSetParametersAsync() at Microsoft.AspNetCore.Components.RenderTree.Renderer.GetErrorHandledTask(Task taskToHandle, ComponentState owningComponentState)

.NET Version

6.0.1

Anything else?

No response

javiercn commented 2 years ago

@latala43 thanks for contacting us.

You need to look at your output folder to determine where the script is located and adjust the path in your script tags accordingly.

latala43 commented 2 years ago

image

The AuthenticationService.js is not loaded at if it is loaded from https://localhost/FirstApp

But the same code is working fine if it is from https://localhost

To reproduce the problem, just create a new Blaozr WebAssembly Project with hosted service AND Individual Authentication

`app.MapWhen(ctx => { var startsWithSegments = ctx.Request.Path.StartsWithSegments("/FirstApp"); return startsWithSegments; }, first => { first.UseBlazorFrameworkFiles("/FirstApp"); first.UseStaticFiles();

     first.UseRouting();
     first.UseEndpoints(endpoints =>
     {
         endpoints.MapControllers();
         endpoints.MapFallbackToFile("FirstApp/{*path:nonfile}", "FirstApp/index.html");
     });

});`

The line in this index.html that loads the AuthenticationService.js is not loaded from the dotnet assembly <script src="_content/Microsoft.AspNetCore.Components.WebAssembly.Authentication/AuthenticationService.js"></script>

The refenced Microsoft.AspNetCore.Components.WebAssembly.Authentication does not load the js file anywhere. The problem is in Dotnet.

I also traced the error and got the following log:

[08:18:21 VRB] Connection id "0HMF64I6QI61L" received HEADERS frame for stream ID 39 with length 52 and flags END_STREAM, END_HEADERS, PRIORITY. [08:18:21 INF] Request starting HTTP/2 GET https://192.168.1.101:7000/FirstApp/_content/Microsoft.AspNetCore.Components.WebAssembly.Authentication/AuthenticationService.js - - [08:18:21 VRB] All hosts are allowed. [08:18:21 INF] Request starting HTTP/2 GET https://192.168.1.101:7000/FirstApp/_framework/blazor.webassembly.js - - [08:18:21 VRB] All hosts are allowed. [08:18:21 DBG] The request path /FirstApp/_content/Microsoft.AspNetCore.Components.WebAssembly.Authentication/AuthenticationService.js does not match an existing file [08:18:21 VRB] Range header's value is empty. [08:18:21 VRB] Connection id "0HMF64I6QI61L" sending HEADERS frame for stream ID 33 with length 43 and flags END_HEADERS. [08:18:21 VRB] Connection id "0HMF64I6QI61L" sending DATA frame for stream ID 33 with length 911 and flags NONE. [08:18:21 DBG] 1 candidate(s) found for the request path '/FirstApp/_content/Microsoft.AspNetCore.Components.WebAssembly.Authentication/AuthenticationService.js' [08:18:21 VRB] Connection id "0HMF64I6QI61L" sending HEADERS frame for stream ID 31 with length 16 and flags END_HEADERS. [08:18:21 INF] Sending file. Request path: '/FirstApp/css/app.css'. Physical path: '/src/SbBlazor/Client/wwwroot/css/app.css' [08:18:21 VRB] Connection id "0HMF64I6QI61L" sending DATA frame for stream ID 31 with length 16384 and flags NONE. [08:18:21 VRB] Range header's value is empty. [08:18:21 DBG] Endpoint 'Fallback FirstApp/{*path:nonfile}' with route pattern 'FirstApp/{*path:nonfile}' was rejected by constraint 'path':'Microsoft.AspNetCore.Routing.Constraints.NonFileNameRouteConstraint' with value '_content/Microsoft.AspNetCore.Components.WebAssembly.Authentication/AuthenticationService.js' for the request path '/FirstApp/_content/Microsoft.AspNetCore.Components.WebAssembly.Authentication/AuthenticationService.js' [08:18:21 DBG] Endpoint 'Fallback FirstApp/{*path:nonfile}' with route pattern 'FirstApp/{*path:nonfile}' is not valid for the request path '/FirstApp/_content/Microsoft.AspNetCore.Components.WebAssembly.Authentication/AuthenticationService.js' [08:18:21 DBG] Request did not match any endpoints [08:18:21 VRB] Connection id "0HMF64I6QI61L" sending HEADERS frame for stream ID 37 with length 7 and flags END_STREAM, END_HEADERS. [08:18:21 VRB] Connection id "0HMF64I6QI61L" sending DATA frame for stream ID 31 with length 16384 and flags NONE. [08:18:21 VRB] Connection id "0HMF64I6QI61L" sending HEADERS frame for stream ID 35 with length 14 and flags END_HEADERS. [08:18:21 VRB] Connection id "0HMF64I6QI61L" sending DATA frame for stream ID 33 with length 0 and flags END_STREAM. [08:18:21 INF] Request finished HTTP/2 GET https://192.168.1.101:7000/FirstApp/_content/Microsoft.AspNetCore.Components.WebAssembly.Authentication/AuthenticationService.js - - - 404 0 - 97.1643ms

Do you want me to create a sample project for this problem. It is very easy to reproduce.

javiercn commented 2 years ago

@latala43 thanks for the additional details.

I understand what you mean and what I'm pointing out is that it is your app that it is loading the script, so you need to update the src tag accordingly.

If the script is located at "/_content/..." and your app is being loaded on FirstApp, then you need to change the script to load from the root (prefix /).

latala43 commented 2 years ago

Thank you for your support. But your last answer indicates that it is not possible to use multiple Blazor WebAssemblies with _content loaded from DotNet such as Microsoft.AspNetCore.Components.WebAssembly.Authentication/AuthenticationService.js?

I wish Blazor should support Multi Blazor WebAssembly created in the host!. I think it should be!

latala43 commented 2 years ago

I try the following: <script src="/_content/Microsoft.AspNetCore.Components.WebAssembly.Authentication/AuthenticationService.js"></script> and <script src="/FirstApp/_content/Microsoft.AspNetCore.Components.WebAssembly.Authentication/AuthenticationService.js"></script> but still not working. DotNet Assembly does not load the AuthenticationService.js anywhere

latala43 commented 2 years ago

@latala43 thanks for the additional details.

I understand what you mean and what I'm pointing out is that it is your app that it is loading the script, so you need to update the src tag accordingly.

If the script is located at "/_content/..." and your app is being loaded on FirstApp, then you need to change the script to load from the root (prefix /).

Thank you very much for your support. I'm sorry it was my mistake. I just follow the links shown in my first post and did not notice as reference to this documentation that I have to add first.UseStaticFiles("/FirstApp"); in MapWhen

first.UseBlazorFrameworkFiles("/FirstApp");
    first.UseStaticFiles();
    **first.UseStaticFiles("/FirstApp");**
    first.UseRouting();

Like this the static files are loaded from DotNet components without any issue. Without first.UseStaticFiles("/FirstApp"); I will receive the 404 not found for AuthenticationService.js

javiercn commented 2 years ago

No worries, this is a complicated thing to get right because there are three moving pieces involved.