search

Nethereum / Nethereum.Templates.Metamask.Blazor

Metamask + Nethereum + Blazor interop
Apache License 2.0
87 stars 31 forks source link

NethereumMetamask.js not found #17

Open davidchavezgrant opened 1 year ago

davidchavezgrant commented 1 year ago

It appears as though running the Blazor server template fails with dotnet run on macos Ventura (13.1) due to a Javascript dependency not being included at runtime. It seems like the file in question is NethereumMetamask.js from Nethereum.Metamask.Blazor

I'm using the version defined in this template, which at the time of writing is 4.8.0

The error disappears when I manually add that file and update the references in _Layout.razor. I assume the error has something to do with how Nethereum.Metamask.Blazor is being bundled and published to NuGet.

The full stack trace upon loading the home page is below.

      Unhandled exception rendering component: Could not find 'NethereumMetamaskInterop.IsMetamaskAvailable' ('NethereumMetamaskInterop' was undefined).
      Error: Could not find 'NethereumMetamaskInterop.IsMetamaskAvailable' ('NethereumMetamaskInterop' was undefined).
          at https://localhost:5001/_framework/blazor.server.js:1:497
          at Array.forEach (<anonymous>)
          at i.findFunction (https://localhost:5001/_framework/blazor.server.js:1:465)
          at E (https://localhost:5001/_framework/blazor.server.js:1:2606)
          at https://localhost:5001/_framework/blazor.server.js:1:3494
          at new Promise (<anonymous>)
          at kt.beginInvokeJSFromDotNet (https://localhost:5001/_framework/blazor.server.js:1:3475)
          at https://localhost:5001/_framework/blazor.server.js:1:72061
          at Array.forEach (<anonymous>)
          at kt._invokeClientMethod (https://localhost:5001/_framework/blazor.server.js:1:72047)
      Microsoft.JSInterop.JSException: Could not find 'NethereumMetamaskInterop.IsMetamaskAvailable' ('NethereumMetamaskInterop' was undefined).
      Error: Could not find 'NethereumMetamaskInterop.IsMetamaskAvailable' ('NethereumMetamaskInterop' was undefined).
          at https://localhost:5001/_framework/blazor.server.js:1:497
          at Array.forEach (<anonymous>)
          at i.findFunction (https://localhost:5001/_framework/blazor.server.js:1:465)
          at E (https://localhost:5001/_framework/blazor.server.js:1:2606)
          at https://localhost:5001/_framework/blazor.server.js:1:3494
          at new Promise (<anonymous>)
          at kt.beginInvokeJSFromDotNet (https://localhost:5001/_framework/blazor.server.js:1:3475)
          at https://localhost:5001/_framework/blazor.server.js:1:72061
          at Array.forEach (<anonymous>)
          at kt._invokeClientMethod (https://localhost:5001/_framework/blazor.server.js:1:72047)
         at Microsoft.JSInterop.JSRuntime.InvokeAsync[TValue](Int64 targetInstanceId, String identifier, Object[] args)
         at Nethereum.Metamask.Blazor.MetamaskBlazorInterop.CheckMetamaskAvailability()
         at Nethereum.Metamask.MetamaskHostProvider.CheckProviderAvailabilityAsync()
         at ExampleProject.Server.Pages.Index.OnAfterRenderAsync(Boolean firstTime) in /Users/davidgrant/Code/Clones/Nethereum.Templates.Metamask.Blazor/ExampleProject.Server/Pages/Index.razor:line 107
         at Microsoft.AspNetCore.Components.RenderTree.Renderer.GetErrorHandledTask(Task taskToHandle, ComponentState owningComponentState)
fail: Microsoft.AspNetCore.Components.Server.Circuits.CircuitHost[111]
      Unhandled exception in circuit 'wBUl9BSEZO8FC_Nm3jDZhTf754kWP2yaE-xVwT-pHkA'.
      Microsoft.JSInterop.JSException: Could not find 'NethereumMetamaskInterop.IsMetamaskAvailable' ('NethereumMetamaskInterop' was undefined).
      Error: Could not find 'NethereumMetamaskInterop.IsMetamaskAvailable' ('NethereumMetamaskInterop' was undefined).
          at https://localhost:5001/_framework/blazor.server.js:1:497
          at Array.forEach (<anonymous>)
          at i.findFunction (https://localhost:5001/_framework/blazor.server.js:1:465)
          at E (https://localhost:5001/_framework/blazor.server.js:1:2606)
          at https://localhost:5001/_framework/blazor.server.js:1:3494
          at new Promise (<anonymous>)
          at kt.beginInvokeJSFromDotNet (https://localhost:5001/_framework/blazor.server.js:1:3475)
          at https://localhost:5001/_framework/blazor.server.js:1:72061
          at Array.forEach (<anonymous>)
          at kt._invokeClientMethod (https://localhost:5001/_framework/blazor.server.js:1:72047)
         at Microsoft.JSInterop.JSRuntime.InvokeAsync[TValue](Int64 targetInstanceId, String identifier, Object[] args)
         at Nethereum.Metamask.Blazor.MetamaskBlazorInterop.CheckMetamaskAvailability()
         at Nethereum.Metamask.MetamaskHostProvider.CheckProviderAvailabilityAsync()
         at ExampleProject.Server.Pages.Index.OnAfterRenderAsync(Boolean firstTime) in /Users/davidgrant/Code/Clones/Nethereum.Templates.Metamask.Blazor/ExampleProject.Server/Pages/Index.razor:line 107
         at Microsoft.AspNetCore.Components.RenderTree.Renderer.GetErrorHandledTask(Task taskToHandle, ComponentState owningComponentState)
warn: Microsoft.AspNetCore.Components.Server.Circuits.RemoteRenderer[100]
      Unhandled exception rendering component: Could not find 'NethereumMetamaskInterop.IsMetamaskAvailable' ('NethereumMetamaskInterop' was undefined).
      Error: Could not find 'NethereumMetamaskInterop.IsMetamaskAvailable' ('NethereumMetamaskInterop' was undefined).
          at https://localhost:5001/_framework/blazor.server.js:1:497
          at Array.forEach (<anonymous>)
          at i.findFunction (https://localhost:5001/_framework/blazor.server.js:1:465)
          at E (https://localhost:5001/_framework/blazor.server.js:1:2606)
          at https://localhost:5001/_framework/blazor.server.js:1:3494
          at new Promise (<anonymous>)
          at kt.beginInvokeJSFromDotNet (https://localhost:5001/_framework/blazor.server.js:1:3475)
          at https://localhost:5001/_framework/blazor.server.js:1:72061
          at Array.forEach (<anonymous>)
          at kt._invokeClientMethod (https://localhost:5001/_framework/blazor.server.js:1:72047)
      Microsoft.JSInterop.JSException: Could not find 'NethereumMetamaskInterop.IsMetamaskAvailable' ('NethereumMetamaskInterop' was undefined).
      Error: Could not find 'NethereumMetamaskInterop.IsMetamaskAvailable' ('NethereumMetamaskInterop' was undefined).
          at https://localhost:5001/_framework/blazor.server.js:1:497
          at Array.forEach (<anonymous>)
          at i.findFunction (https://localhost:5001/_framework/blazor.server.js:1:465)
          at E (https://localhost:5001/_framework/blazor.server.js:1:2606)
          at https://localhost:5001/_framework/blazor.server.js:1:3494
          at new Promise (<anonymous>)
          at kt.beginInvokeJSFromDotNet (https://localhost:5001/_framework/blazor.server.js:1:3475)
          at https://localhost:5001/_framework/blazor.server.js:1:72061
          at Array.forEach (<anonymous>)
          at kt._invokeClientMethod (https://localhost:5001/_framework/blazor.server.js:1:72047)
         at Microsoft.JSInterop.JSRuntime.InvokeAsync[TValue](Int64 targetInstanceId, String identifier, Object[] args)
         at Nethereum.Metamask.Blazor.MetamaskBlazorInterop.CheckMetamaskAvailability()
         at Nethereum.Metamask.MetamaskHostProvider.CheckProviderAvailabilityAsync()
         at Nethereum.Metamask.Blazor.Metamask.OnAfterRenderAsync(Boolean firstRender)
         at Microsoft.AspNetCore.Components.RenderTree.Renderer.GetErrorHandledTask(Task taskToHandle, ComponentState owningComponentState)
fail: Microsoft.AspNetCore.Components.Server.Circuits.CircuitHost[111]
      Unhandled exception in circuit 'wBUl9BSEZO8FC_Nm3jDZhTf754kWP2yaE-xVwT-pHkA'.
      Microsoft.JSInterop.JSException: Could not find 'NethereumMetamaskInterop.IsMetamaskAvailable' ('NethereumMetamaskInterop' was undefined).
      Error: Could not find 'NethereumMetamaskInterop.IsMetamaskAvailable' ('NethereumMetamaskInterop' was undefined).
          at https://localhost:5001/_framework/blazor.server.js:1:497
          at Array.forEach (<anonymous>)
          at i.findFunction (https://localhost:5001/_framework/blazor.server.js:1:465)
          at E (https://localhost:5001/_framework/blazor.server.js:1:2606)
          at https://localhost:5001/_framework/blazor.server.js:1:3494
          at new Promise (<anonymous>)
          at kt.beginInvokeJSFromDotNet (https://localhost:5001/_framework/blazor.server.js:1:3475)
          at https://localhost:5001/_framework/blazor.server.js:1:72061
          at Array.forEach (<anonymous>)
          at kt._invokeClientMethod (https://localhost:5001/_framework/blazor.server.js:1:72047)
         at Microsoft.JSInterop.JSRuntime.InvokeAsync[TValue](Int64 targetInstanceId, String identifier, Object[] args)
         at Nethereum.Metamask.Blazor.MetamaskBlazorInterop.CheckMetamaskAvailability()
         at Nethereum.Metamask.MetamaskHostProvider.CheckProviderAvailabilityAsync()
         at Nethereum.Metamask.Blazor.Metamask.OnAfterRenderAsync(Boolean firstRender)
         at Microsoft.AspNetCore.Components.RenderTree.Renderer.GetErrorHandledTask(Task taskToHandle, ComponentState owningComponentState)
^Cinfo: Microsoft.Hosting.Lifetime[0]
      Application is shutting down...
xcaptain commented 11 months ago

Same here, did you solve it?

xcaptain commented 11 months ago

Sorry, I forgot to add

    <script src="_content/Nethereum.Metamask.Blazor/NethereumMetamask.js"></script>

at the index.html

after that

Call window.NethereumMetamaskInterop.IsMetamaskAvailable() at the console, should return true now.

Call window.NethereumMetamaskInterop.EnableEthereum() at the console, should popup metamask to connect to this website.