Skip to content
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

_content/LeafletForBlazor/LeafletMapFunctionalities.js net::ERR_ABORTED 404 (Not Found) #41

Open
dsx75 opened this issue Jul 24, 2024 · 6 comments

Comments

@dsx75
Copy link

dsx75 commented Jul 24, 2024

Hello,

I'm testing the AddMapToBlazorPage example on Blazor Interactive Server 8.0 and I'm getting the following error:

GET http://localhost:5555/_content/LeafletForBlazor/LeafletMapFunctionalities.js net::ERR_ABORTED 404 (Not Found)
(anonymous) @ blazor.web.js:1
(anonymous) @ blazor.web.js:1
beginInvokeJSFromDotNet @ blazor.web.js:1
_invokeClientMethod @ blazor.web.js:1
_processIncomingData @ blazor.web.js:1
connection.onreceive @ blazor.web.js:1
i.onmessage @ blazor.web.js:1

blazor.web.js:1 [2024-07-24T07:08:14.760Z] Error: Microsoft.JSInterop.JSException: Failed to fetch dynamically imported module: http://localhost:5555/_content/LeafletForBlazor/LeafletMapFunctionalities.js
TypeError: Failed to fetch dynamically imported module: http://localhost:5555/_content/LeafletForBlazor/LeafletMapFunctionalities.js
at Microsoft.JSInterop.JSRuntime.InvokeAsync[TValue](Int64 targetInstanceId, String identifier, Object[] args)
at LeafletForBlazor.CoreJsInterop.LoadMapPartialAsync(ParametersInitialization parameters, ParametersInitialization esri_api_parameters, ParametersInitialization plugins_parameters, ParametersInitialization ui_controls_parameters, ParametersInitialization images_overlay, DotNetObjectReference1 dotNetObject) at System.Threading.Tasks.Task.<>c.<ThrowAsync>b__128_0(Object state) at Microsoft.AspNetCore.Components.Rendering.RendererSynchronizationContext.PostAsync[TState](Task antecedent, Action1 callback, TState state)

Any ideas, please?

@ichim
Copy link
Owner

ichim commented Jul 24, 2024

Hello sir,

The AddMapToBlazorPage project uses the Map control for which we have not updated and will not be supported due to some design mistakes.
The RealTimeMap control is supported and continuously updated.
I checked this control and it works correctly for Blazor Server App project and .NET 8. Do you have more information? For example: how do you run the project? It seems that it cannot find the addresses of the internal files...

@dsx75
Copy link
Author

dsx75 commented Jul 24, 2024

Hmm, I tried to create a clean new project, just to be sure the issue is not related to my existing code or settings and, strangely enough, I am getting a different error now:

Visual Studio 2022 17.10.4

Create new project

Blazor Web App

Framework: .NET 8.0

Authentication type: none

Configure for HTTPS: yes

Interactive render mode: Server

Interactivity location: Per page/component

Create

Add NuGet package LeafletForBlazor 2.0.6.8 to the generated project.

Add @using directive to the _Imports.razor file:

@using LeafletForBlazor

Main page (Home.razor) - add render mode:

@rendermode InteractiveServer

Main page (Home.razor) - add component:

<RealTimeMap Parameters="parameters" height="460px" width="620px"></RealTimeMap>

Main page (Home.razor) - add code:

@code{
     RealTimeMap.LoadParameters parameters = new RealTimeMap.LoadParameters()  //general map settings
         {
             location = new RealTimeMap.Location()
             {
                 latitude = 44.4501715,      
                 longitude = 26.1107672,
             },
             zoom_level = 18
         };
     }

Visual Studio main menu - Debug - Start Debugging (F5)

The default browser opens (Google Chrome in my case) with following error:

Uncaught Error: Found malformed component comment at Blazor:{"type":"server","prerenderId":"447057ca63744c3692c855f6d8a3ac26","key":{"locationHash":"6B2627A70EAFBAC3352224E51A13CBF7BA203EE50B1B9B601D7052414378C527:0","formattedComponentKey":""},"sequence":0,"descriptor":"CfDJ8BfBq\u002BzpI81IifmF8LGvLunmwjC1itq/8edeoEacv3hcF2YXnrMIjSxp3L3im2ldMn\u002BzzmoepWEK5EhR/3BJzLQMrXFK7hT9t7Jv4hVFdNEqXtUoiYQlhZGpyR46xu2WIbYidETzR0wLoSl/SUjiin81ZFLyE3S9WGyyqIc\u002BKFH4RAxFjq6rnJTFkAJX58\u002BqGJJMT76BH3UYuHsTOE1m7q9LteJVbmQ\u002B3XcdmiFqNfCXIN8hZ3c6peZNnGzMh/PzwSs6aFXsm63huP/NqHRKp7W2Ehmlv2AHCJZetMM1cW5rlFF/momzjhceRSfRJ90F3HvTMdZNb1SxJHl0SMMMBIbaYjIrUODIbpi/fHc6pvbKIGAo5EPl0RQr5udFtzAHkHCPkNlevmfqfH/52dJVPw33t4p/S5iMlbKdKa8XzqowM0oeksVjnTH/vzV\u002BtpTJGyu1VNv/m837DGo4G\u002BUtkm4dHcWQOMv\u002BHfH\u002BNLYfySJmO/SVzVPwsLFz58P6B75i\u002BZLh5/BdsVuTNnEb6jo45vAUatoN\u002BITziXLX2z1MoTWn"}
    at Dt (blazor.web.js:1:42764)
    at Rt (blazor.web.js:1:41344)
    at Rt (blazor.web.js:1:41417)
    at Rt (blazor.web.js:1:41417)
    at Rt (blazor.web.js:1:41417)
    at Rt (blazor.web.js:1:41417)
    at Rt (blazor.web.js:1:41417)
    at blazor.web.js:1:40607
    at St (blazor.web.js:1:40659)
    at bi (blazor.web.js:1:171526)
Dt @ blazor.web.js:1
Rt @ blazor.web.js:1
Rt @ blazor.web.js:1
Rt @ blazor.web.js:1
Rt @ blazor.web.js:1
Rt @ blazor.web.js:1
Rt @ blazor.web.js:1
(anonymous) @ blazor.web.js:1
St @ blazor.web.js:1
bi @ blazor.web.js:1
(anonymous) @ blazor.web.js:1
Ki @ blazor.web.js:1

@ichim
Copy link
Owner

ichim commented Jul 24, 2024

Hello sir,

Please archive and send me the project.

@dsx75
Copy link
Author

dsx75 commented Jul 24, 2024

E-mail sent.
Thanks.

@ichim
Copy link
Owner

ichim commented Jul 24, 2024

Thanks a lot!

@RemTheDev
Copy link

Hmm, I tried to create a clean new project, just to be sure the issue is not related to my existing code or settings and, strangely enough, I am getting a different error now:

Visual Studio 2022 17.10.4

Create new project

Blazor Web App

Framework: .NET 8.0

Authentication type: none

Configure for HTTPS: yes

Interactive render mode: Server

Interactivity location: Per page/component

Create

Add NuGet package LeafletForBlazor 2.0.6.8 to the generated project.

Add @using directive to the _Imports.razor file:

@using LeafletForBlazor

Main page (Home.razor) - add render mode:

@rendermode InteractiveServer

Main page (Home.razor) - add component:

<RealTimeMap Parameters="parameters" height="460px" width="620px"></RealTimeMap>

Main page (Home.razor) - add code:

@code{
     RealTimeMap.LoadParameters parameters = new RealTimeMap.LoadParameters()  //general map settings
         {
             location = new RealTimeMap.Location()
             {
                 latitude = 44.4501715,      
                 longitude = 26.1107672,
             },
             zoom_level = 18
         };
     }

Visual Studio main menu - Debug - Start Debugging (F5)

The default browser opens (Google Chrome in my case) with following error:

Uncaught Error: Found malformed component comment at Blazor:{"type":"server","prerenderId":"447057ca63744c3692c855f6d8a3ac26","key":{"locationHash":"6B2627A70EAFBAC3352224E51A13CBF7BA203EE50B1B9B601D7052414378C527:0","formattedComponentKey":""},"sequence":0,"descriptor":"CfDJ8BfBq\u002BzpI81IifmF8LGvLunmwjC1itq/8edeoEacv3hcF2YXnrMIjSxp3L3im2ldMn\u002BzzmoepWEK5EhR/3BJzLQMrXFK7hT9t7Jv4hVFdNEqXtUoiYQlhZGpyR46xu2WIbYidETzR0wLoSl/SUjiin81ZFLyE3S9WGyyqIc\u002BKFH4RAxFjq6rnJTFkAJX58\u002BqGJJMT76BH3UYuHsTOE1m7q9LteJVbmQ\u002B3XcdmiFqNfCXIN8hZ3c6peZNnGzMh/PzwSs6aFXsm63huP/NqHRKp7W2Ehmlv2AHCJZetMM1cW5rlFF/momzjhceRSfRJ90F3HvTMdZNb1SxJHl0SMMMBIbaYjIrUODIbpi/fHc6pvbKIGAo5EPl0RQr5udFtzAHkHCPkNlevmfqfH/52dJVPw33t4p/S5iMlbKdKa8XzqowM0oeksVjnTH/vzV\u002BtpTJGyu1VNv/m837DGo4G\u002BUtkm4dHcWQOMv\u002BHfH\u002BNLYfySJmO/SVzVPwsLFz58P6B75i\u002BZLh5/BdsVuTNnEb6jo45vAUatoN\u002BITziXLX2z1MoTWn"}
    at Dt (blazor.web.js:1:42764)
    at Rt (blazor.web.js:1:41344)
    at Rt (blazor.web.js:1:41417)
    at Rt (blazor.web.js:1:41417)
    at Rt (blazor.web.js:1:41417)
    at Rt (blazor.web.js:1:41417)
    at Rt (blazor.web.js:1:41417)
    at blazor.web.js:1:40607
    at St (blazor.web.js:1:40659)
    at bi (blazor.web.js:1:171526)
Dt @ blazor.web.js:1
Rt @ blazor.web.js:1
Rt @ blazor.web.js:1
Rt @ blazor.web.js:1
Rt @ blazor.web.js:1
Rt @ blazor.web.js:1
Rt @ blazor.web.js:1
(anonymous) @ blazor.web.js:1
St @ blazor.web.js:1
bi @ blazor.web.js:1
(anonymous) @ blazor.web.js:1
Ki @ blazor.web.js:1

Hi! For anyone having this issue, I was having this exact error with the basic setup:

_Imports.razor :

@using LeafletForBlazor

My page component :

<RealTimeMap width="600px"
             height="600px"
             Parameters="@parameters">
</RealTimeMap>

@code {
    //map initialization parameters
    RealTimeMap.LoadParameters parameters = new RealTimeMap.LoadParameters()  //general map settings
        {
            location = new RealTimeMap.Location()
            {
                latitude = 44.4501715,
                longitude = 26.1107672,
            },
            zoomLevel = 18
        };
}

The error went away when I put the RealTimeMap component in a div:

<div>
    <RealTimeMap width="600px"
                 height="600px"
                 Parameters="@parameters"></RealTimeMap>
</div>

@code {
    //map initialization parameters
    RealTimeMap.LoadParameters parameters = new RealTimeMap.LoadParameters()  //general map settings
        {
            location = new RealTimeMap.Location()
            {
                latitude = 44.4501715,
                longitude = 26.1107672,
            },
            zoomLevel = 18
        };
}

This workaround is probably a good hint to figure out what's causing the issue.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants