Javascript not working when using Blazor WASM prerendering

Question

I wanted to implement Prerendering with my Blazor WASM hosted application, but the application doesn't leave the "prerendering" mode. At least the method "onafterrender" doesn't get called in any component. In addition none of my javascript functions / scripts are working.

Ive followed the instructions on

Ive tried to play around with the order and removing of script in the cshtml file as well as in the programm.cs but nothing worked

Answer 1

I followed the Prerendering Configuration . I don't see any issue. I'm able to call the javascript method on Index.razor -> OnAfterRenderAsync()

_Host.cshtml:

@page "/"
@using BlazorApp7HostedPrerenderingTest.Client
@using Microsoft.AspNetCore.Components.Web
@namespace BlazorApp7HostedPrerenderingTest.Server.Pages
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <base href="~/" />
    <link rel="stylesheet" href="css/bootstrap/bootstrap.min.css" />
    <link href="css/app.css" rel="stylesheet" />
    <link href="BlazorApp7HostedPrerenderingTest.Client.styles.css" rel="stylesheet" />
    <link rel="icon" type="image/png" href="favicon.png"/>
    <component type="typeof(HeadOutlet)" render-mode="WebAssemblyPrerendered" />
</head>
<body>
    <component type="typeof(App)" render-mode="WebAssemblyPrerendered" />

    <div id="blazor-error-ui">
        <environment include="Staging,Production">
            An error has occurred. This application may no longer respond until reloaded.
        </environment>
        <environment include="Development">
            An unhandled exception has occurred. See browser dev tools for details.
        </environment>
        <a href="" class="reload">Reload</a>
        <a class="dismiss">🗙</a>
    </div>

    <script src="_framework/blazor.webassembly.js"></script>
    <script src="js/app.js"></script>
</body>
</html>

Index.razor:

@page "/"

<PageTitle>Index</PageTitle>

<h1>Hello, world!</h1>

Welcome to your new app.

<SurveyPrompt Title="How is Blazor working for you?" />

@code{
    [Inject] public IJSRuntime JS { get; set; }

    protected override async Task OnAfterRenderAsync(bool firstRender)
    {
        await base.OnAfterRenderAsync(firstRender);

        await JS.InvokeVoidAsync("hello", "Vikram Reddy");
    }
}

Screenshot:

Sample GitHUb project created. Please check the link .

Javascript not working when using Blazor WASM prerendering

Question

1 answers

solution1
0 2022-11-25 13:13:31

Javascript not working when using Blazor WASM prerendering

Question

1 answers

solution1 0 2022-11-25 13:13:31

solution1
0 2022-11-25 13:13:31