The assembly does not contain a public invokable method with [JSInvokableAttribute]

Question

We use Blazor WebAssembly and I want to call an non-static method in my Index.razor-File by JavaScript.

JavaScript:

(function () {

    // keydown event
    window.addEventListener("keydown", function (e) {
        DotNet.invokeMethodAsync('MyBlazorWebAssemblyApp.Client', 'MyMethod');
    });
})();

Index.razor:

@page "/"
@inject HttpClient Http

@code {
    
    // [...]
    
    [JSInvokable]
    public async Task MyMethod()
    {
        var lResponse = await Http.GetFromJsonAsync<object>("Controller/Action");
    }
}

When I execute the code by an keydown, then the developer tools in Microsoft Edge shows me the following error:

blazor.webassembly.js:1 System.ArgumentException: The assembly 'MyBlazorWebAssemblyApp.Client' does not contain a public invokable method with [JSInvokableAttribute("MyMethod")].

When I replace the attribute [JSInvokable] by [JSInvokableAttribute("MyMethod")] then the same error appears.

How can I fix this problem?

https://learn.microsoft.com/en-us/aspnet/core/blazor/call-dotnet-from-javascript?view=aspnetcore-3.1#instance-method-call — agua from mars, Jul 17 '20 at 13:35
What happens if you just use MyBlazorWebAssemblyApp i.e. remove the .Client from the app assembly argument? — Mark3308, Jul 17 '20 at 14:55
@Mark3308: System.ArgumentException: There is no loaded assembly with the name 'MyBlazorWebAssemblyApp'. — Simon, Jul 20 '20 at 07:33

score 19 · Accepted Answer · edited Apr 06 '21 at 20:22

19

Got it working now by my self. Here is the code:

JavaScript:

var GLOBAL = {};
GLOBAL.DotNetReference = null;
GLOBAL.SetDotnetReference = function (pDotNetReference) {
    GLOBAL.DotNetReference = pDotNetReference;
};

(function () {

    // keydown event
    window.addEventListener("keydown", function (e) {
        GLOBAL.DotNetReference.invokeMethodAsync('MyMethod');
    });
})();

Index.razor:

@page "/"
@inject HttpClient Http

@code {
    
    protected override async Task OnInitializedAsync()
    {
        var lDotNetReference = DotNetObjectReference.Create(this);
        JSRuntime.InvokeVoidAsync("GLOBAL.SetDotnetReference", lDotNetReference);
    }
    
    // [...]
    
    [JSInvokable("MyMethod")]
    public async Task MyMethod()
    {
        var lResponse = await Http.GetFromJsonAsync<object>("Controller/Action");
    }
}

edited Apr 06 '21 at 20:22

Ogglas

62,132
37
328
418

answered Jul 20 '20 at 09:07

Simon

4,157
2
46
87

One question here, how does GLOBAL.SetDotnetReference get dotnetreference ? – curious_debugger Sep 21 '21 at 16:50
@KshitijAnilRangari it's created in the `OnInitializedAsync` – clamchoda May 06 '22 at 05:43
@Simon but your code has a problem when use in Foreach, already call last item. – Zanyar Jalal Oct 08 '22 at 18:29
Excellent Question and Answer - this also works within OnAfterRenderAsync, and was great for me since I also needed it for a non static method in a simple single page application :). – Joel Youngberg Jul 14 '23 at 22:52

score 2 · Answer 2 · answered Jul 20 '20 at 10:04

If you check out the Microsoft documentation at the following link:

https://learn.microsoft.com/en-gb/aspnet/core/blazor/call-dotnet-from-javascript?view=aspnetcore-3.1#instance-method-call

This differs from your example in the following ways:

Your JavaScript appears to be trying to call a static .NET method.

Your C# code is not a static method.

Zanyar Jalal · Answer 3 · 2022-10-08T19:55:15.273

2

You must mention <<Namespace>>.<<TypeName>>.<<MethodName>>

Important: C# Method must static

window.addEventListener("keydown", async function (e) {
        await DotNet.invokeMethodAsync('MyBlazorWebAssemblyApp.Client', 'MyMethod');
});

#40110 issue

edited Oct 08 '22 at 19:55

answered Oct 08 '22 at 18:31

Zanyar Jalal

1,407
12
29

The assembly does not contain a public invokable method with [JSInvokableAttribute]

3 Answers3