Spolupráce JavaScriptu [JSImport]/[JSExport] s ASP.NET Core Blazor

Tento článek vysvětluje, jak pracovat s JavaScriptem (JS) v komponentách na straně klienta pomocí rozhraní API pro interoperabilitu JavaScriptu (JS) [JSImport]/[JSExport] vydané pro aplikace, které využívají .NET 7 nebo novější.

Blazor poskytuje vlastní JS mechanismus spolupráce na IJSRuntime základě rozhraní. BlazorJS Interop je jednotně podporován napříč Blazor režimy vykreslování a pro Blazor Hybrid aplikace. IJSRuntime umožňuje autorům knihoven vytvářet JS knihovny vzájemné spolupráce pro sdílení v ekosystému Blazor a zůstává doporučeným přístupem pro JS interoperabilitu v Blazorsystému . Podívejte se na následující články:

• Volání funkcí JavaScriptu z metod .NET v ASP.NET Core Blazor
• Volání metod .NET z funkcí JavaScriptu v ASP.NET Core Blazor

Tento článek popisuje alternativní JS přístup k vzájemné spolupráce specifické pro komponenty na straně klienta spuštěné na WebAssembly. Tyto přístupy jsou vhodné, pokud očekáváte, že se budou spouštět pouze na webAssembly na straně klienta. Autoři knihoven můžou tyto přístupy použít k optimalizaci JS vzájemné spolupráce kontrolou při provádění kódu, pokud je aplikace spuštěná na WebAssembly v prohlížeči (OperatingSystem.IsBrowser). Přístupy popsané v tomto článku by se měly použít k nahrazení zastaralého nepotřebného JS rozhraní API pro interoperabilitu při migraci na .NET 7 nebo novější.

Poznámka:

Tento článek se zaměřuje na JS interoperabilitu v komponentách na straně klienta. Pokyny k volání .NET v javascriptových aplikacích najdete v tématu Spuštění .NET z JavaScriptu.

Zastaralé rozhraní API pro interoperabilitu JavaScriptu

Nepotřebné JS zprostředkovatele komunikace pomocí IJSUnmarshalledRuntime rozhraní API je zastaralé v ASP.NET Core v .NET 7 nebo novějším. Podle pokynů v tomto článku nahraďte zastaralé rozhraní API.

Požadavky

Stáhněte a nainstalujte .NET 7 nebo novější , pokud ještě není v systému nainstalovaný nebo pokud systém nemá nainstalovanou nejnovější verzi.

Obor názvů

Rozhraní API pro interoperabilitu JS (JSHost.ImportAsync) popsané v tomto článku je řízeno atributy v System.Runtime.InteropServices.JavaScript oboru názvů.

Povolení nebezpečných bloků

AllowUnsafeBlocks Povolte vlastnost v souboru projektu aplikace, která umožňuje generátoru kódu v kompilátoru Roslyn používat ukazatele pro JS interoperabilitu:

<PropertyGroup>
  <AllowUnsafeBlocks>true</AllowUnsafeBlocks>
</PropertyGroup>

Upozorňující

Rozhraní API pro interoperabilitu JS vyžaduje povolení AllowUnsafeBlocks. Při implementaci vlastního nebezpečného kódu v aplikacích .NET buďte opatrní, což může představovat rizika zabezpečení a stability. Další informace naleznete v tématu Nebezpečný kód, typy ukazatelů a ukazatele funkce.

Razor Kolace JS knihovny tříd (RCL) není podporována.

Obecně platí, že podpora umístění pro interoperabilitu JS založenou JS na jazyce JavaScript (umístění JavaScriptu v aplikacích ASP.NET CoreBlazor) je k dispozici také pro interoperabilitu [JSImport]/[JSExport] popsanou v tomto článku.IJSRuntime Jediná nepodporovaná JS funkce umístění je pro kolaci JS v knihovně Razor tříd (RCL).

Místo použití kolace JS v seznamu RCL umístěte JS soubor do složky seznamu RCL wwwroot a odkazujte na něj pomocí obvyklé cesty pro statické prostředky RCL:

_content/{PACKAGE ID}/{PATH}/{FILE NAME}.js

• Zástupný {PACKAGE ID} symbol je identifikátor balíčku RCL (nebo název knihovny pro knihovnu tříd).
• Zástupný {PATH} symbol je cesta k souboru.
• Zástupný {FILE NAME} symbol je název souboru.

JS I když spolupráce v seznamu RCL není podporována[JSExport][JSImport]/, můžete soubory uspořádat JS pomocí obou následujících přístupů:

• Pojmenujte JS soubor stejně jako komponentu, ve které JS se používá. Pro komponentu v seznamu RCL s názvem CallJavaScriptFromLib (CallJavaScriptFromLib.razor) pojmenujte soubor CallJavaScriptFromLib.js ve wwwroot složce.
• Umístěte soubory specifické pro JS komponenty do Components složky uvnitř složky seznamu RCL wwwroot a použijte "Components" v cestě k souboru: _content/{PACKAGE ID}/Components/CallJavaScriptFromLib.js.

Volání JavaScriptu z .NET

Tato část vysvětluje, jak volat JS funkce z .NET.

V následující komponentě CallJavaScript1:

• Modul CallJavaScript1 se importuje asynchronně z kompletovaného JS souboru s JSHost.ImportAsync.
• Importovaná getMessageJS funkce je volána funkcí GetWelcomeMessage.
• Vrácený řetězec uvítací zprávy se zobrazí v uživatelském rozhraní prostřednictvím message pole.

CallJavaScript1.razor:

@page "/call-javascript-1"
@rendermode InteractiveWebAssembly
@using System.Runtime.InteropServices.JavaScript

<h1>
    JS <code>[JSImport]</code>/<code>[JSExport]</code> Interop 
    (Call JS Example 1)
</h1>

@(message is not null ? message : string.Empty)

@code {
    private string? message;

    protected override async Task OnInitializedAsync()
    {
        await JSHost.ImportAsync("CallJavaScript1", 
            "../Components/Pages/CallJavaScript1.razor.js");

        message = GetWelcomeMessage();
    }
}

Poznámka:

Zahrňte podmíněný kód pro vrácení se OperatingSystem.IsBrowser změnami, aby se zajistilo, že interoperabilita JS je volána pouze komponentou vykreslovanou v klientovi. To je důležité pro knihovny nebo balíčky NuGet, které cílí na komponenty na straně serveru, které nemůžou spustit kód poskytnutý tímto JS rozhraním API pro interoperabilitu.

Pokud chcete naimportovat JS funkci, která ji bude volat z jazyka C#, použijte [JSImport] atribut podpisu metody jazyka C#, který odpovídá JS podpisu funkce. Prvním parametrem atributu [JSImport] je název funkce, která JS se má importovat, a druhý parametr je název JS modulu.

V následujícím příkladu JS je funkce, getMessage která vrací string pro modul s názvem CallJavaScript1. Podpis metody jazyka C#odpovídá: Funkci nejsou předány JS žádné parametry a JS funkce vrátí hodnotu string. Funkce JS je volána v kódu jazyka GetWelcomeMessage C#.

CallJavaScript1.razor.cs:

using System.Runtime.InteropServices.JavaScript;
using System.Runtime.Versioning;

namespace BlazorSample.Components.Pages;

[SupportedOSPlatform("browser")]
public partial class CallJavaScript1
{
    [JSImport("getMessage", "CallJavaScript1")]
    internal static partial string GetWelcomeMessage();
}

Obor názvů aplikace pro předchozí CallJavaScript1 částečnou třídu je BlazorSample. Obor názvů komponenty je BlazorSample.Components.Pages. Pokud v místní testovací aplikaci používáte předchozí komponentu, aktualizujte obor názvů tak, aby odpovídal aplikaci. Obor názvů je ContosoApp.Components.Pages například v případě, že obor názvů aplikace je ContosoApp. Další informace najdete v tématu ASP.NET základní Razor komponenty.

V podpisu importované metody můžete použít typy .NET pro parametry a návratové hodnoty, které jsou automaticky zařazovány modulem runtime. Slouží JSMarshalAsAttribute<T> k řízení způsobu, jakým jsou importované parametry metody zařazovány. Můžete se například rozhodnout, že zařadíte jako long System.Runtime.InteropServices.JavaScript.JSType.Number nebo System.Runtime.InteropServices.JavaScript.JSType.BigInt. Zpětná volání můžete předat Action/Func<TResult> jako parametry, které jsou zařazovány jako volatelné JS funkce. Můžete předat odkazy na objekty i JS spravované objekty a jsou zařazovány jako proxy objekty, přičemž objekt je aktivní v rámci hranice, dokud se proxy neshromáždí. Můžete také importovat a exportovat asynchronní metody s Task výsledkem, které jsou zařazovány jako JS přísliby. Většina zařazovaných typů funguje v obou směrech jako parametry a jako návratové hodnoty u importovaných i exportovaných metod, které jsou popsané v části Volání .NET z JavaScriptu dále v tomto článku.

Následující tabulka uvádí podporované mapování typů.

.NET	JavaScript	Nullable	Task➔k Promise	JSMarshalAs volitelný	Array of
Boolean	Boolean	✅Podporuje se	✅Podporuje se	✅Podporuje se	Nepodporováno
Byte	Number	✅Podporuje se	✅Podporuje se	✅Podporuje se	✅Podporuje se
Char	String	✅Podporuje se	✅Podporuje se	✅Podporuje se	Nepodporováno
Int16	Number	✅Podporuje se	✅Podporuje se	✅Podporuje se	Nepodporováno
Int32	Number	✅Podporuje se	✅Podporuje se	✅Podporuje se	✅Podporuje se
Int64	Number	✅Podporuje se	✅Podporuje se	Nepodporováno	Nepodporováno
Int64	BigInt	✅Podporuje se	✅Podporuje se	Nepodporováno	Nepodporováno
Single	Number	✅Podporuje se	✅Podporuje se	✅Podporuje se	Nepodporováno
Double	Number	✅Podporuje se	✅Podporuje se	✅Podporuje se	✅Podporuje se
IntPtr	Number	✅Podporuje se	✅Podporuje se	✅Podporuje se	Nepodporováno
DateTime	Date	✅Podporuje se	✅Podporuje se	Nepodporováno	Nepodporováno
DateTimeOffset	Date	✅Podporuje se	✅Podporuje se	Nepodporováno	Nepodporováno
Exception	Error	Nepodporováno	✅Podporuje se	✅Podporuje se	Nepodporováno
JSObject	Object	Nepodporováno	✅Podporuje se	✅Podporuje se	✅Podporuje se
String	String	Nepodporováno	✅Podporuje se	✅Podporuje se	✅Podporuje se
Object	Any	Nepodporováno	✅Podporuje se	Nepodporováno	✅Podporuje se
Span<Byte>	MemoryView	Nepodporováno	Nepodporováno	Nepodporováno	Nepodporováno
Span<Int32>	MemoryView	Nepodporováno	Nepodporováno	Nepodporováno	Nepodporováno
Span<Double>	MemoryView	Nepodporováno	Nepodporováno	Nepodporováno	Nepodporováno
ArraySegment<Byte>	MemoryView	Nepodporováno	Nepodporováno	Nepodporováno	Nepodporováno
ArraySegment<Int32>	MemoryView	Nepodporováno	Nepodporováno	Nepodporováno	Nepodporováno
ArraySegment<Double>	MemoryView	Nepodporováno	Nepodporováno	Nepodporováno	Nepodporováno
Task	Promise	Nepodporováno	Nepodporováno	✅Podporuje se	Nepodporováno
Action	Function	Nepodporováno	Nepodporováno	Nepodporováno	Nepodporováno
Action<T1>	Function	Nepodporováno	Nepodporováno	Nepodporováno	Nepodporováno
Action<T1, T2>	Function	Nepodporováno	Nepodporováno	Nepodporováno	Nepodporováno
Action<T1, T2, T3>	Function	Nepodporováno	Nepodporováno	Nepodporováno	Nepodporováno
Func<TResult>	Function	Nepodporováno	Nepodporováno	Nepodporováno	Nepodporováno
Func<T1, TResult>	Function	Nepodporováno	Nepodporováno	Nepodporováno	Nepodporováno
Func<T1, T2, TResult>	Function	Nepodporováno	Nepodporováno	Nepodporováno	Nepodporováno
Func<T1, T2, T3, TResult>	Function	Nepodporováno	Nepodporováno	Nepodporováno	Nepodporováno

Následující podmínky platí pro mapování typů a zařazované hodnoty:

• Sloupec Array of označuje, zda lze typ .NET zařaďovat jako JSArray. Příklad: C# int[] (Int32) namapovaný na JSArray s Number.
• Při předávání JS hodnoty do jazyka C# s hodnotou nesprávného typu vyvolá architektura ve většině případů výjimku. Architektura neprovádí kontrolu JStypu kompilace .
• JSObject, ExceptionTask a ArraySegment vytvořte GCHandle a proxy. Odstranění můžete aktivovat v kódu vývojáře nebo povolit uvolnění paměti .NET (GC) později. Tyto typy mají značné nároky na výkon.
• Array: Zařazování pole vytvoří kopii pole v JS rozhraní .NET nebo .NET.
• MemoryView
  • MemoryViewJS je třída pro modul runtime .NET WebAssembly pro zařazování Span a ArraySegment.
  • Na rozdíl od zařazování pole zařazování nebo ArraySegment nezařazování Span kopie podkladové paměti.
  • MemoryView lze správně vytvořit instanci pouze modulem runtime .NET WebAssembly. Proto není možné importovat funkci jako metodu JS .NET, která má parametr Span nebo ArraySegment.
  • MemoryView vytvoření pro volání Span zprostředkovatele je platné pouze po dobu trvání volání zprostředkovatele komunikace. Jak Span je přiděleno v zásobníku volání, který se nezachovává po volání zprostředkovatele komunikace, není možné exportovat metodu Span.NET, která vrací .
  • MemoryView vytvořeno pro ArraySegment přežití po volání zprostředkovatele komunikace a je užitečné pro sdílení vyrovnávací paměti. Volání dispose() vytvořeného MemoryView pro ArraySegment zlikviduje proxy server a odepnou základní pole .NET. Doporučujeme zavolat dispose() do try-finally bloku pro MemoryView.

Název modulu v atributu [JSImport] a volání načtení modulu v komponentě se JSHost.ImportAsync musí shodovat a být v aplikaci jedinečné. Při vytváření knihovny pro nasazení v balíčku NuGet doporučujeme použít obor názvů balíčků NuGet jako předponu v názvech modulů. V následujícím příkladu název modulu odráží Contoso.InteropServices.JavaScript balíček a složku tříd interoperability zpráv uživatele (UserMessages):

[JSImport("getMessage", 
    "Contoso.InteropServices.JavaScript.UserMessages.CallJavaScript1")]

Funkce přístupné pro globální obor názvů je možné importovat pomocí globalThis předpony v názvu funkce a pomocí atributu [JSImport] bez zadání názvu modulu. V následujícím příkladu console.log je předpona globalThis. Importovaná funkce je volána metodou jazyka C# Log , která přijímá řetězcovou zprávu jazyka C# (message) a zařadí řetězec jazyka JSString console.logC# na :

[JSImport("globalThis.console.log")]
internal static partial void Log([JSMarshalAs<JSType.String>] string message);

Exportujte skripty ze standardního modulu JavaScript ES6, který je součástí nebo umístěný s jinými statickými prostředky JavaScriptu JS v souboru (například tam, wwwroot/js/{FILE NAME}.jskde JS jsou statické prostředky udržovány ve složce pojmenované js ve složce aplikace wwwroot a {FILE NAME} zástupný symbol je název souboru).

V následujícím příkladu JS se funkce s názvem getMessage exportuje z kompletovaného JS souboru, který vrátí uvítací zprávu "Hello from!" (Hello from!" (Hello from Blazor) v portugalštině:

CallJavaScript1.razor.js:

export function getMessage() {
  return 'Olá do Blazor!';
}

Volání .NET z JavaScriptu

Tato část vysvětluje, jak volat metody .NET z JS.

Následující CallDotNet1 komponenta volá JS , která přímo komunikuje s modelem DOM, aby vykreslila uvítací řetězec zprávy:

• Modul CallDotNet JS se importuje asynchronně z kompletovaného JS souboru pro tuto komponentu.
• Importovaná setMessageJS funkce je volána funkcí SetWelcomeMessage.
• Vrácená setMessage uvítací zpráva se zobrazí v uživatelském rozhraní prostřednictvím message pole.

Důležité

V příkladu JS této části se interoperabilita používá k ztlumení elementu DOM čistě pro demonstrační účely po vykreslení komponenty v OnAfterRender. Obvykle byste měli ztlumit pouze objekt DOM, JS když objekt nepracuje Blazor. Přístup uvedený v této části je podobný případům, kdy se v komponentě Razor používá knihovna třetí stranyJS, kde komponenta komunikuje s JS knihovnou prostřednictvím JS vzájemné spolupráce, knihovna třetí strany JS komunikuje s částí DOM a Blazor není přímo zapojená dom aktualizací této části dom. Další informace najdete v tématu ASP.NET Interoperabilita Core Blazor JavaScriptu (JSinteroperabilita).

CallDotNet1.razor:

@page "/call-dotnet-1"
@rendermode InteractiveWebAssembly
@using System.Runtime.InteropServices.JavaScript

<h1>
    JS <code>[JSImport]</code>/<code>[JSExport]</code> Interop 
    (Call .NET Example 1)
</h1>

<p>
    <span id="result">.NET method not executed yet</span>
</p>

@code {
    protected override async Task OnAfterRenderAsync(bool firstRender)
    {
        if (firstRender)
        {
            await JSHost.ImportAsync("CallDotNet1", 
                "../Components/Pages/CallDotNet1.razor.js");

            SetWelcomeMessage();
        }
    }
}

Chcete-li exportovat metodu .NET tak, aby ji bylo možné volat z JS, použijte [JSExport] atribut.

V následujícím příkladu:

• SetWelcomeMessageJS volá funkci s názvem setMessage. Funkce JS volá rozhraní .NET, aby přijímala uvítací zprávu GetMessageFromDotnet a zobrazila zprávu v uživatelském rozhraní.
• GetMessageFromDotnet je metoda .NET s atributem [JSExport] , který vrací uvítací zprávu "Hello from Blazor!" v portugalštině.

CallDotNet1.razor.cs:

using System.Runtime.InteropServices.JavaScript;
using System.Runtime.Versioning;

namespace BlazorSample.Components.Pages;

[SupportedOSPlatform("browser")]
public partial class CallDotNet1
{
    [JSImport("setMessage", "CallDotNet1")]
    internal static partial void SetWelcomeMessage();

    [JSExport]
    internal static string GetMessageFromDotnet()
    {
        return "Olá do Blazor!";
    }
}

Obor názvů aplikace pro předchozí CallDotNet1 částečnou třídu je BlazorSample. Obor názvů komponenty je BlazorSample.Components.Pages. Pokud v místní testovací aplikaci používáte předchozí komponentu, aktualizujte obor názvů aplikace tak, aby odpovídal aplikaci. Obor názvů komponenty je ContosoApp.Components.Pages například v případě, že obor názvů aplikace je ContosoApp. Další informace najdete v tématu ASP.NET základní Razor komponenty.

V následujícím příkladu je JS funkce s názvem setMessage importována z kompletovaného JS souboru.

Metoda setMessage:

• Volání globalThis.getDotnetRuntime(0) pro zveřejnění instance modulu runtime WebAssembly .NET pro volání exportovaných metod .NET.
• Získá export sestavení JS aplikace. Název sestavení aplikace v následujícím příkladu je BlazorSample.
• Volá metodu BlazorSample.Components.Pages.CallDotNet1.GetMessageFromDotnet z exportu (exports). Vrácená hodnota, což je uvítací zpráva, je přiřazena k CallDotNet1 textu komponenty <span> . Obor názvů aplikace je BlazorSamplea CallDotNet1 obor názvů komponenty je BlazorSample.Components.Pages.

CallDotNet1.razor.js:

export async function setMessage() {
  const { getAssemblyExports } = await globalThis.getDotnetRuntime(0);
  var exports = await getAssemblyExports("BlazorSample.dll");

  document.getElementById("result").innerText = 
    exports.BlazorSample.Components.Pages.CallDotNet1.GetMessageFromDotnet();
}

Poznámka:

Volání getAssemblyExports k získání exportů může nastat v inicializátoru JavaScriptu pro dostupnost v celé aplikaci.

Volání importu více modulů

JS Po načtení modulu jsou funkce modulu JS dostupné komponentám a třídám aplikace, pokud je aplikace spuštěná v okně prohlížeče nebo na kartě bez ručního načtení aplikace uživatelem. JSHost.ImportAsync lze volat vícekrát ve stejném modulu bez významného snížení výkonu, pokud:

• Uživatel navštíví komponentu, která volá JSHost.ImportAsync import modulu, přejde mimo komponentu a pak se vrátí k komponentě JSHost.ImportAsync , která se znovu volá pro stejný import modulu.
• Stejný modul se používá v různých součástech a načítá JSHost.ImportAsync je v každé z těchto komponent.

Použití jednoho javascriptového modulu napříč komponentami

Před provedením pokynů v této části si přečtěte část tohoto článku volání JavaScriptu z .NET a volání .NET z částí tohoto článku, které poskytují obecné pokyny pro [JSImport]/[JSExport] interoperabilitu.

Příklad v této části ukazuje, jak používat JS interoperabilitu ze sdíleného JS modulu v aplikaci na straně klienta. Pokyny v této části se nevztahují na Razor knihovny tříd (RCLS).

Používají se následující komponenty, třídy, metody jazyka C#a JS funkce:

• Interopclass (Interop.cs): Nastaví interoperabilitu importu a exportu [JSExport] JS [JSImport] s atributy modulu s názvem .Interop
  • GetWelcomeMessage: Metoda .NET, která volá importovanou getMessageJS funkci.
  • SetWelcomeMessage: Metoda .NET, která volá importovanou setMessageJS funkci.
  • GetMessageFromDotnet: Exportovaná metoda jazyka C#, která vrátí řetězec uvítací zprávy při zavolání z JS.
• wwwroot/js/interop.js soubor: Obsahuje JS funkce.
  • getMessage: Vrátí uvítací zprávu při zavolání kódu jazyka C# v komponentě.
  • setMessage: Volá metodu jazyka GetMessageFromDotnet C# a přiřadí vrácenou uvítací zprávu elementu DOM <span> .
• Program.cs volání JSHost.ImportAsync pro načtení modulu z wwwroot/js/interop.js.
• CallJavaScript2 component (CallJavaScript2.razor): Volá GetWelcomeMessage a zobrazuje vrácenou uvítací zprávu v uživatelském rozhraní komponenty.
• CallDotNet2 součást (CallDotNet2.razor): Volání SetWelcomeMessage.

Interop.cs:

using System.Runtime.InteropServices.JavaScript;
using System.Runtime.Versioning;

namespace BlazorSample.JavaScriptInterop;

[SupportedOSPlatform("browser")]
public partial class Interop
{
    [JSImport("getMessage", "Interop")]
    internal static partial string GetWelcomeMessage();

    [JSImport("setMessage", "Interop")]
    internal static partial void SetWelcomeMessage();

    [JSExport]
    internal static string GetMessageFromDotnet()
    {
        return "Olá do Blazor!";
    }
}

V předchozím příkladu je BlazorSampleobor názvů aplikace a úplný obor názvů pro třídy interoperability jazyka C# je BlazorSample.JavaScriptInterop.

wwwroot/js/interop.js:

export function getMessage() {
  return 'Olá do Blazor!';
}

export async function setMessage() {
  const { getAssemblyExports } = await globalThis.getDotnetRuntime(0);
  var exports = await getAssemblyExports("BlazorSample.dll");

  document.getElementById("result").innerText =
    exports.BlazorSample.JavaScriptInterop.Interop.GetMessageFromDotnet();
}

System.Runtime.InteropServices.JavaScript Zpřístupnění oboru názvů v horní části Program.cs souboru:

using System.Runtime.InteropServices.JavaScript;

Načtěte modul Program.cs dříve, než WebAssemblyHost.RunAsync se volá:

if (OperatingSystem.IsBrowser())
{
    await JSHost.ImportAsync("Interop", "../js/interop.js");
}

CallJavaScript2.razor:

@page "/call-javascript-2"
@rendermode InteractiveWebAssembly
@using BlazorSample.JavaScriptInterop

<h1>
    JS <code>[JSImport]</code>/<code>[JSExport]</code> Interop 
    (Call JS Example 2)
</h1>

@(message is not null ? message : string.Empty)

@code {
    private string? message;

    protected override void OnInitialized()
    {
        message = Interop.GetWelcomeMessage();
    }
}

CallDotNet2.razor:

@page "/call-dotnet-2"
@rendermode InteractiveWebAssembly
@using BlazorSample.JavaScriptInterop

<h1>
    JS <code>[JSImport]</code>/<code>[JSExport]</code> Interop  
    (Call .NET Example 2)
</h1>

<p>
    <span id="result">.NET method not executed</span>
</p>

@code {
    protected override void OnAfterRender(bool firstRender)
    {
        if (firstRender)
        {
            Interop.SetWelcomeMessage();
        }
    }
}

Důležité

V příkladu JS této části se interoperabilita používá k ztlumení elementu DOM čistě pro demonstrační účely po vykreslení komponenty v OnAfterRender. Obvykle byste měli ztlumit pouze objekt DOM, JS když objekt nepracuje Blazor. Přístup uvedený v této části je podobný případům, kdy se v komponentě Razor používá knihovna třetí stranyJS, kde komponenta komunikuje s JS knihovnou prostřednictvím JS vzájemné spolupráce, knihovna třetí strany JS komunikuje s částí DOM a Blazor není přímo zapojená dom aktualizací této části dom. Další informace najdete v tématu ASP.NET Interoperabilita Core Blazor JavaScriptu (JSinteroperabilita).

Další materiály

• Dokumentace k rozhraní API
  • [JSImport] atribut
  • [JSExport] atribut
• Spuštění .NET z JavaScriptu
• V úložišti dotnet/runtime GitHub:
  • Modul runtime .NET WebAssembly
  • dotnet.d.ts file (konfigurace modulu runtime .NET WebAssembly)