Blazor server JSRuntime call error function undefined

Question

.net 8

Hello!

We have a common error, but cant reproduce it in the browser.
This is our code:

protected override async Task OnAfterRenderAsync(bool firstRender)
{
    if (firstRender)
    {
        try
        {
            //so it do not scroll up on state change
            await JsRuntime.InvokeVoidAsync("preventBlazorScroll");
        }
        catch (Exception ex)
        {
            Logger.LogWarning(ex, "Javascript couldnt run");
        }

ERROR ex:

Could not find 'preventBlazorScroll' ('preventBlazorScroll' was undefined).

Error: Could not find 'preventBlazorScroll' ('preventBlazorScroll' was undefined).

    at https://www.mysite.se/_blazorfiles/_framework/blazor.server.js:1:537

    at Array.forEach (<anonymous>)

    at l.findFunction (https://www.mysite.se/_blazorfiles/_framework/blazor.server.js:1:505)

It works in all browsers we can test. Scripts are loaded before blazor initializes, im thinking it is a bot or something when this happens, not a real browser... or if javascript is not enabled, but then, it do not execute blazor.server.js, so no error then.

Anyone else having this issues in logs? we have this error ONLY three times every hour in the logs, on a site with thousands of visitors every day.

Any more ideas what could trigger this error? No user has reported the site malfunctioning.

Answer 1

Hi @Luc Gosso

we have this error ONLY three times every hour in the logs, on a site with thousands of visitors every day.

It may be tied to specific conditions like network latency, bot traffic, or other intermittent factors. You can implement additional logging or monitoring to capture the specific circumstances when this error occurs, such as IP address, user-agent string, and timing information. This will help you identify patterns that could explain the error.

try
{
    // Log user-agent and other context information.
    var userAgent = HttpContext.Request.Headers["User-Agent"].ToString();
    Logger.LogInformation($"User-Agent: {userAgent}");
    await JsRuntime.InvokeVoidAsync("preventBlazorScroll");
}
catch (Exception ex)
{
    Logger.LogWarning(ex, "JavaScript couldn't run");
}

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

Best regards,
Rena

Answer 2

It is unlikely a bot could run the Blazor client script required to open the signal/r connection. More likely the script that defines the function is getting a syntax error so the function is undefined. The other case is the definition script is loaded async, and your code is calling before it’s defined.