Quantcast
Channel: Active questions tagged blazor - Stack Overflow
Viewing all articles
Browse latest Browse all 4839

JS injection in blazor component showing error

$
0
0

I tried to inject js file into a component referencing this Microsoft tutorial.

https://learn.microsoft.com/en-us/aspnet/core/blazor/javascript-interoperability/location-of-javascript?view=aspnetcore-8.0

My component is a follows:-

@page "/interop"@rendermode InteractiveServer@inject IJSRuntime JS@implements IAsyncDisposable<h1>JS Collocation Example 2</h1><button @onclick="ShowPrompt">Call showPrompt2</button>@if (!string.IsNullOrEmpty(result)){<p>        Hello @result!</p>}@code {    private IJSObjectReference? module;    private string? result;    protected override async Task OnAfterRenderAsync(bool firstRender)    {        if (firstRender)        {            module = await JS.InvokeAsync<IJSObjectReference>("import", "./Components/Pages/MYFun.js");        }    }    private async Task ShowPrompt()    {        if (module is not null)        {            result = await module.InvokeAsync<string>("showPrompt2", "What's your name?");            StateHasChanged();        }    }    public async ValueTask DisposeAsync()    {        if (module is not null)        {            await module.DisposeAsync();        }    }}

Next my js file is as follows:-

export function showPrompt2(message) {    return prompt(message, 'Type your name here');  }

My js file path is : CSharp\DEMO\Components\Pages\MYFun.js

Now the error i am facing says

\[2024-06-23T05:24:20.559Z\] Information: Normalizing '\_blazor' to 'http://localhost:5245/_blazor'.blazor.web.js:1 \[2024-06-23T05:24:20.592Z\] Information: WebSocket connected to ws://localhost:5245/\_blazor?id=O03_Mc_d_ex3fD7KNrTZuA.blazor.web.js:1        GET http://localhost:5245/Components/Pages/MYFun.js net::ERR_ABORTED 404 (Not Found)(anonymous) @ blazor.web.js:1(anonymous) @ blazor.web.js:1beginInvokeJSFromDotNet @ blazor.web.js:1\_invokeClientMethod @ blazor.web.js:1\_processIncomingData @ blazor.web.js:1connection.onreceive @ blazor.web.js:1i.onmessage @ blazor.web.js:1\[NEW\] Explain Console errors by using Copilot in Edge: click         to explain an error.         Learn more          Don't show againblazor.web.js:1  \[2024-06-23T05:24:20.840Z\] Error: There was an unhandled exception on the current circuit, so this circuit will be terminated. For more details turn on detailed exceptions by setting 'DetailedErrors: true' in 'appSettings.Development.json' or set 'CircuitOptions.DetailedErrors'.log @ blazor.web.js:1unhandledError @ blazor.web.js:1(anonymous) @ blazor.web.js:1\_invokeClientMethod @ blazor.web.js:1\_processIncomingData @ blazor.web.js:1connection.onreceive @ blazor.web.js:1i.onmessage @ blazor.web.js:1blazor.web.js:1 \[2024-06-23T05:24:20.842Z\] Information: Connection disconnected.`your text`

please help regarding the issue


Viewing all articles
Browse latest Browse all 4839

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>