Aracılığıyla paylaş

ASP.NET Core Blazor WebAssembly yerel bağımlılıkları

  • Makale

Not

Bu, bu makalenin en son sürümü değildir. Geçerli sürüm için bu makalenin .NET 8 sürümüne bakın.

Önemli

Bu bilgiler, ticari olarak piyasaya sürülmeden önce önemli ölçüde değiştirilebilen bir yayın öncesi ürünle ilgilidir. Burada verilen bilgilerle ilgili olarak Microsoft açık veya zımni hiçbir garanti vermez.

Geçerli sürüm için bu makalenin .NET 8 sürümüne bakın.

Blazor WebAssembly uygulamalar, WebAssembly üzerinde çalışacak şekilde oluşturulmuş yerel bağımlılıkları kullanabilir. Yerel bağımlılıkları statik olarak .NET WebAssembly çalışma zamanına bağlayabilirsiniz. .NET WebAssembly derleme araçları, önceden (AOT) WebAssembly'ye uygulama Blazor derlemek ve kullanılmayan özellikleri kaldırmak için çalışma zamanını yeniden bağlamak için kullanılan araçlar.

Bu makale yalnızca için Blazor WebAssemblygeçerlidir.

.NET WebAssembly derleme araçları

.NET WebAssembly derleme araçları, web platformu için bir derleyici araç zinciri olan Emscripten'i temel alır. Yükleme dahil olmak üzere derleme araçları hakkında daha fazla bilgi için bkz . ASP.NET Core Blazor WebAssembly derleme araçları ve önceden (AOT) derleme.

Uygulamanın proje dosyasına öğe ekleyerek NativeFileReference uygulamaya Blazor WebAssembly yerel bağımlılıklar ekleyin. Proje oluşturulduğunda, her NativeFileReference biri .NET WebAssembly derleme araçları tarafından Emscripten'e geçirilir, böylece bunlar derlenir ve çalışma zamanına bağlanır. Ardından, p/invoke uygulamanın .NET kodundaki yerel koda geçin.

Genel olarak, tüm taşınabilir yerel kodlar ile Blazor WebAssemblyyerel bağımlılık olarak kullanılabilir. C/C++ koduna veya daha önce Emscripten kullanılarak derlenmiş koda yerel bağımlılıklar ekleyebilirsiniz:

  • Nesne dosyaları (.o)
  • Dosyaları arşivle (.a)
  • Bit kodu (.bc)
  • Tek başına WebAssembly modülleri (.wasm)

Önceden oluşturulmuş bağımlılıklar genellikle .NET WebAssembly çalışma zamanını derlemek için kullanılan Emscripten sürümü kullanılarak oluşturulmalıdır.

Not

Mono/WebAssembly MSBuild özellikleri ve hedefleri için bkz WasmApp.targets . (dotnet/runtime GitHub deposu). Ortak MSBuild özellikleri için resmi belgeler, Belge blazor msbuild yapılandırma seçeneklerine göre planlanmaktadır (dotnet/docs #27395).

Yerel kod kullanma

Uygulamaya basit bir yerel C işlevi Blazor WebAssembly ekleyin:

  1. Yeni Blazor WebAssembly bir proje oluşturun.

  2. Projeye bir Test.c dosya ekleyin.

  3. Bilgi işlem faktöriyeli için bir C işlevi ekleyin.

    Test.c:

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

  4. Uygulamanın proje dosyasına for NativeFileReferenceTest.c ekleyin:

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

  5. Bir Razor bileşende, oluşturulan Test kitaplıkta fact işlev için bir DllImportAttribute ekleyin ve bileşenindeki fact .NET kodundan yöntemini çağırın.

    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);
}

Uygulamayı .NET WebAssembly derleme araçları yüklü olarak oluşturduğunuzda, yerel C kodu derlenip .NET WebAssembly çalışma zamanına (dotnet.wasm ) bağlanır. Uygulama oluşturulduktan sonra işlenen faktöriyel değeri görmek için uygulamayı çalıştırın.

C++ yönetilen yöntem geri çağırmaları

C++ öğesine geçirilen yönetilen yöntemleri özniteliğiyle etiketle [UnmanagedCallersOnly] .

özniteliğiyle [UnmanagedCallersOnly] işaretlenmiş yöntem olmalıdır static. Bir bileşendeki Razor bir örnek yöntemini çağırmak için örneği GCHandle için C++ öğesine geçirin ve yerele geri geçirin. Alternatif olarak, bileşenin örneğini tanımlamak için başka bir yöntem kullanın.

ile [DllImport] işaretlenen yöntem, geri çağırma bağımsız değişkeni için temsilci türü yerine C# 9.0 işlev işaretçisi kullanmalıdır.

Not

Yöntemlerdeki [DllImport] C# işlev işaretçisi türleri için, yerine yönetilen taraftaki delegate *unmanaged<int, void>yöntem imzasında kullanınIntPtr. Daha fazla bilgi için bkz . [WASM] yerel koddan .NET'e geri çağırma: İşlev işaretçisi türlerinin imzalarda ayrıştırılması desteklenmiyor (dotnet/runtime #56145).

NuGet paketinde yerel bağımlılıkları paketleme

NuGet paketleri WebAssembly'de kullanılmak üzere yerel bağımlılıklar içerebilir. Bu kitaplıklar ve yerel işlevleri daha sonra tüm Blazor WebAssembly uygulamalar tarafından kullanılabilir. Yerel bağımlılıkların dosyaları WebAssembly için derlenmeli ve mimariye browser-wasmözgü klasörde paketlenmelidir. WebAssembly'ye özgü bağımlılıklara otomatik olarak başvurulmuyor ve bunlar el NativeFileReferenceile başvurulmalıdır. Paket yazarları, başvurularla birlikte pakete bir .props dosya ekleyerek yerel başvuruları eklemeyi seçebilir.

SkiaSharp örnek kitaplık kullanımı

SkiaSharp, desteği olan yerel Skia grafik kitaplığını temel alan .NET için Blazor WebAssemblyplatformlar arası bir 2B grafik kitaplığıdır.

SkiaSharp'ı bir Blazor WebAssembly uygulamada kullanmak için:

  1. Projedeki SkiaSharp.Views.BlazorBlazor WebAssembly pakete paket başvurusu ekleyin. Bir uygulamaya paket eklemek için Visual Studio'nun işlemini kullanın (Ön sürümü dahil et seçili olarak NuGet Paketlerini Yönet) veya komutu bir komut kabuğunda yürütündotnet add package:

    dotnet add package –-prerelease SkiaSharp.Views.Blazor

    Not

    .NET uygulamalarına paket ekleme hakkında yönergeler için, Paket tüketimi iş akışında (NuGet belgeleri)paketleri yüklemek ve yönetmek altındaki makalelere bakın. NuGet.org'da doğru paket sürümlerini onaylayın.

  2. Aşağıdakilerle uygulamaya bir SKCanvasView bileşen ekleyin:

    • SkiaSharp ve SkiaSharp.Views.Blazor ad alanları.
    • SkiaSharp Tuval Görünümü bileşeninde (SKCanvasView ) çizim yapmak için mantık.

    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. Uygulamayı derlemek birkaç dakika sürebilir. Uygulamayı çalıştırın ve konumundaki /native-dependency-examplebileşene NativeDependencyExample gidin.

Ek kaynaklar

.NET WebAssembly derleme araçları