Delen via

ASP.NET Core Blazor WebAssembly systeemeigen afhankelijkheden

  • Artikel

Notitie

Dit is niet de nieuwste versie van dit artikel. Zie de .NET 9-versie van dit artikelvoor de huidige release.

Waarschuwing

Deze versie van ASP.NET Core wordt niet meer ondersteund. Zie de .NET- en .NET Core-ondersteuningsbeleidvoor meer informatie. Zie de .NET 9-versie van dit artikelvoor de huidige release.

Belangrijk

Deze informatie heeft betrekking op een pre-releaseproduct dat aanzienlijk kan worden gewijzigd voordat het commercieel wordt uitgebracht. Microsoft geeft geen garanties, uitdrukkelijk of impliciet, met betrekking tot de informatie die hier wordt verstrekt.

Zie de .NET 9-versie van dit artikelvoor de huidige release.

Blazor WebAssembly-apps kunnen systeemeigen afhankelijkheden gebruiken die zijn gebouwd om te worden uitgevoerd op WebAssembly. U kunt systeemeigen afhankelijkheden statisch koppelen aan de .NET WebAssembly-runtime met behulp van de .NET WebAssembly-hulpprogramma's, dezelfde hulpprogramma's die worden gebruikt om vooraf (AOT) te compileren een Blazor-app te compileren naar WebAssembly en om de runtime opnieuw te koppelen om ongebruikte functieste verwijderen.

Dit artikel is alleen van toepassing op Blazor WebAssembly.

.NET WebAssembly-buildhulpprogramma's

De .NET WebAssembly-buildhulpprogramma's zijn gebaseerd op Emscripten, een compilerhulpprogrammaketen voor het webplatform. Zie ASP.NET Core Blazor WebAssembly buildhulpprogramma's en ahead-of-time (AOT) compilatievoor meer informatie over de buildhulpprogramma's, waaronder de installatie.

Voeg systeemeigen afhankelijkheden toe aan een Blazor WebAssembly-app door NativeFileReference items toe te voegen in het projectbestand van de app. Wanneer het project wordt gebouwd, wordt elke NativeFileReference door de .NET WebAssembly-buildhulpprogramma's aan Emscripten doorgegeven, zodat het wordt gecompileerd en gekoppeld aan de runtime. Vervolgens p/invoke in de native code vanuit de .NET-code van de app.

Over het algemeen kan elke draagbare systeemeigen code worden gebruikt als een systeemeigen afhankelijkheid met Blazor WebAssembly. U kunt systeemeigen afhankelijkheden toevoegen aan C/C++-code of code die eerder is gecompileerd met emscripten:

  • Objectbestanden (.o)
  • Bestanden archiveren (.a)
  • Bitcode (.bc)
  • Zelfstandige WebAssembly-modules (.wasm)

Vooraf gemaakte afhankelijkheden moeten doorgaans worden gebouwd met dezelfde versie van Emscripten die wordt gebruikt voor het bouwen van de .NET WebAssembly-runtime.

Notitie

Zie WasmApp.targets (dotnet/runtime GitHub-opslagplaats) voor Mono/WebAssembly MSBuild-eigenschappen en -doelen. Officiële documentatie voor algemene MSBuild-eigenschappen is gepland per Document Blazor MSBuild-configuratieopties (dotnet/docs #27395).

Systeemeigen code gebruiken

Voeg een eenvoudige systeemeigen C-functie toe aan een Blazor WebAssembly-app:

  1. Maak een nieuw Blazor WebAssembly-project.

  2. Voeg een Test.c-bestand toe aan het project.

  3. Voeg een C-functie toe voor computingfactorialen.

    Test.c:

    int fact(int n)
{
    if (n == 0) return 1;
    return n * fact(n - 1);
}

  4. Voeg een NativeFileReference toe voor Test.c in het projectbestand van de app:

    <ItemGroup>
  <NativeFileReference Include="Test.c" />
</ItemGroup>

  5. Voeg in een Razor-onderdeel een DllImportAttribute toe voor de fact functie in de gegenereerde Test-bibliotheek en roep de fact methode aan vanuit .NET-code in het onderdeel.

    Pages/NativeCTest.razor:

    @page "/native-c-test"
@using System.Runtime.InteropServices

<PageTitle>Native C</PageTitle>

<h1>Native C Test</h1>

<p>
    @@fact(3) result: @fact(3)
</p>

@code {
    [DllImport("Test")]
    static extern int fact(int n);
}

Wanneer u de app bouwt met de .NET WebAssembly-buildhulpprogramma's geïnstalleerd, wordt de systeemeigen C-code gecompileerd en gekoppeld aan de .NET WebAssembly-runtime (dotnet.wasm). Nadat de app is gemaakt, voert u de app uit om de weergegeven factoriële waarde te zien.

Callbacks voor beheerde C++-methoden

Label beheerde methoden die aan C++ worden doorgegeven met het kenmerk [UnmanagedCallersOnly].

De methode die is gemarkeerd met het kenmerk [UnmanagedCallersOnly] moet staticzijn. Als u een instantiemethode in een Razor-onderdeel wilt aanroepen, geeft u een GCHandle voor de instantie door aan C++ en geeft u deze vervolgens weer terug aan het native systeem. U kunt ook een andere methode gebruiken om het exemplaar van het onderdeel te identificeren.

De methode die is gemarkeerd met [DllImport] moet een C# 9.0-functieaanwijzer gebruiken in plaats van een gemachtigdentype voor het callback-argument.

Notitie

Gebruik voor C#-functieaanwijzertypen in [DllImport] methoden IntPtr in de methodehandtekening aan de beheerde zijde in plaats van delegate *unmanaged<int, void>. Voor meer informatie, zie [WASM] callback van native code naar .NET: Het parseren van functie-aanwijzer typen in handtekeningen wordt niet ondersteund (dotnet/runtime #56145).

Systeemeigen afhankelijkheden in een NuGet-pakket verpakken

NuGet-pakketten kunnen systeemeigen afhankelijkheden bevatten voor gebruik op WebAssembly. Deze bibliotheken en hun systeemeigen functionaliteit zijn vervolgens beschikbaar voor elke Blazor WebAssembly app. De bestanden voor de systeemeigen afhankelijkheden moeten worden gebouwd voor WebAssembly en verpakt in de browser-wasmarchitectuurspecifieke map. WebAssembly-specifieke afhankelijkheden worden niet automatisch verwezen en moeten handmatig worden verwezen als NativeFileReferences. Auteurs van pakketten kunnen ervoor kiezen om de systeemeigen verwijzingen toe te voegen door een .props-bestand in het pakket met de verwijzingen op te geven.

Gebruik van skiaSharp-voorbeeldbibliotheek

SkiaSharp is een platformoverschrijdende 2D-grafische bibliotheek voor .NET op basis van de systeemeigen Skia-grafische bibliotheek met ondersteuning voor Blazor WebAssembly.

SkiaSharp gebruiken in een Blazor WebAssembly-app:

  1. Voeg een pakketreferentie toe aan het SkiaSharp.Views.Blazor-pakket in een Blazor WebAssembly project. Gebruik het proces van Visual Studio voor het toevoegen van pakketten aan een app (NuGet-pakketten beheren met Prerelease toevoegen geselecteerd) of voer de opdracht dotnet add package uit in een opdrachtprompt.

    dotnet add package –-prerelease SkiaSharp.Views.Blazor

    Notitie

    Raadpleeg de artikelen onder Pakketten installeren en beheren in de Pakket consumptieworkflow (NuGet-documentatie)voor hulp bij het toevoegen van pakketten aan .NET-apps. Bevestig de juiste pakketversies op NuGet.org.

  2. Voeg een SKCanvasView-onderdeel toe aan de app met het volgende:

    • SkiaSharp en SkiaSharp.Views.Blazor naamruimten.
    • Logica om te tekenen in het onderdeel SkiaSharp Canvas View (SKCanvasView).

    Pages/NativeDependencyExample.razor:

    @page "/native-dependency-example"
@using SkiaSharp
@using SkiaSharp.Views.Blazor

<PageTitle>Native dependency</PageTitle>

<h1>Native dependency example with SkiaSharp</h1>

<SKCanvasView OnPaintSurface="OnPaintSurface" />

@code {
    private void OnPaintSurface(SKPaintSurfaceEventArgs e)
    {
        var canvas = e.Surface.Canvas;

        canvas.Clear(SKColors.White);

        using var paint = new SKPaint
        {
            Color = SKColors.Black,
            IsAntialias = true,
            TextSize = 24
        };

        canvas.DrawText("SkiaSharp", 0, 24, paint);
    }
}

  3. Bouw de app, wat enkele minuten kan duren. Voer de app uit en navigeer naar het NativeDependencyExample-onderdeel op /native-dependency-example.

Aanvullende informatiebronnen

.NET WebAssembly-hulpprogramma's bouwen