Compartir a través de


Varias aplicaciones hospedadas ASP.NET Core Blazor WebAssembly

Nota:

Esta no es la versión más reciente de este artículo. Para obtener la versión más reciente de este artículo, consulte la versión de .NET 7.

En este artículo se explica cómo configurar una aplicación hospedada Blazor WebAssembly para hospedar varias Blazor WebAssembly aplicaciones.

Configuración

Seleccione la versión de este artículo que coincida con los requisitos de hospedaje, ya sea el hospedaje de puertos o dominios (por ejemplo, :5001/:5002 o ) o firstapp.com/secondapp.comel hospedaje de subrutas (por ejemplo, /FirstApp y )./SecondApp

Con la selección de hospedaje actual, en este artículo se describe el hospedaje de puertos o dominios (por ejemplo, :5001/:5002 o ).firstapp.com/secondapp.com

En los ejemplos siguientes:

  • El nombre del proyecto de la aplicación hospedada Blazor WebAssembly se encuentra MultipleBlazorApps en una carpeta denominada MultipleBlazorApps.
  • Los tres proyectos de la solución antes de agregar una segunda aplicación cliente se encuentran MultipleBlazorApps.Client en la Client carpeta , MultipleBlazorApps.Server en la Server carpeta y MultipleBlazorApps.Shared en la Shared carpeta .
  • La aplicación cliente inicial (primera) es el proyecto cliente predeterminado de la solución creada a partir de la plantilla de Blazor WebAssembly proyecto.
  • Se agrega una segunda aplicación cliente a la solución, MultipleBlazorApps.SecondClient en una carpeta denominada SecondClient.
  • Opcionalmente, el proyecto de servidor (MultipleBlazorApps.Server) puede servir páginas o vistas como una Razor aplicación Pages o MVC.
  • La primera aplicación cliente es accesible en un explorador en el puerto 5001 o con un host de firstapp.com. La segunda aplicación cliente es accesible en un explorador en el puerto 5002 o con un host de secondapp.com.

Con la selección actual, en este artículo se describe el hospedaje de subrutas de ruta (por ejemplo, /FirstApp y /SecondApp).

En los ejemplos siguientes:

  • El nombre del proyecto de la aplicación hospedada Blazor WebAssembly se encuentra MultipleBlazorApps en una carpeta denominada MultipleBlazorApps.
  • Los tres proyectos de la solución antes de agregar una segunda aplicación cliente se encuentran MultipleBlazorApps.Client en la Client carpeta , MultipleBlazorApps.Server en la Server carpeta y MultipleBlazorApps.Shared en la Shared carpeta .
  • La aplicación cliente inicial (primera) es el proyecto cliente predeterminado de la solución creada a partir de la plantilla de Blazor WebAssembly proyecto.
  • Se agrega una segunda aplicación cliente a la solución, MultipleBlazorApps.SecondClient en una carpeta denominada SecondClient.
  • Opcionalmente, el proyecto de servidor (MultipleBlazorApps.Server) puede servir páginas o vistas como una aplicación formal Razor pages o MVC.
  • Ambas aplicaciones cliente usan el puerto predeterminado definido por el MultipleBlazorApps.Server archivo del Properties/launchSettings.json proyecto en su applicationUrl valor. La primera aplicación cliente es accesible en un explorador en la /FirstApp subruta. La segunda aplicación cliente es accesible en un explorador en la /SecondApp subruta.

Los ejemplos que se muestran en este artículo requieren una configuración adicional para:

  • Acceso a las aplicaciones directamente en los dominios firstapp.com de host de ejemplo y secondapp.com.
  • Certificados para las aplicaciones cliente para habilitar la seguridad TLS/HTTPS.
  • Configuración de la aplicación de servidor como una Razor aplicación Pages para las siguientes características:
    • Integración de Razor componentes en páginas o vistas.
    • Representación previa de Razor componentes.

Las configuraciones anteriores están fuera del ámbito de este artículo. Para obtener más información, consulte los siguientes recursos:

Use una Blazor WebAssembly hospedada existente o cree una Blazor WebAssembly a partir de la plantilla de proyecto pasando la Blazor WebAssembly opción si usa la CLI de .NET o activa la casilla -ho|--hosted en Visual Studio cuando se crea el proyecto en el IDE.

Use una carpeta para la solución denominada MultipleBlazorApps y asigne al proyecto MultipleBlazorAppsel nombre .

Cree una carpeta en la solución denominada SecondClient. En la nueva carpeta, agregue una segunda Blazor WebAssembly aplicación cliente denominada MultipleBlazorApps.SecondClient. Agregue el proyecto como una aplicación independiente Blazor WebAssembly . Para crear una aplicación independiente Blazor WebAssembly , no pase la -ho|--hosted opción si usa la CLI de .NET o no usa la casilla ASP.NET Core Hosted si usa Visual Studio.

Realice los cambios siguientes en el MultipleBlazorApps.SecondClient proyecto:

  • Copie el FetchData componente (Pages/FetchData.razor) de la Client/Pages carpeta a la SecondClient/Pages carpeta . Este paso es necesario porque una aplicación independiente Blazor WebAssembly no llama al controlador de un Server proyecto para los datos meteorológicos, usa un archivo de datos estático. Al copiar el FetchData componente en el proyecto agregado, la segunda aplicación cliente también realiza una llamada api web a la API de servidor para los datos meteorológicos.
  • Elimine la SecondClient/wwwroot/sample-data carpeta, ya que no se usa el weather.json archivo de la carpeta.

En la tabla siguiente se describen las carpetas y los nombres de proyecto de la solución después de agregar la carpeta y SecondClient el MultipleBlazorApps.SecondClient proyecto.

Carpeta física Nombre de proyecto Description
Client MultipleBlazorApps.Client Blazor WebAssembly aplicación cliente
SecondClient MultipleBlazorApps.SecondClient Blazor WebAssembly aplicación cliente
Server MultipleBlazorApps.Server aplicación de servidor de ASP.NET Core
Shared MultipleBlazorApps.Shared Proyecto de recursos compartidos

El MultipleBlazorApps.Server proyecto sirve las dos Blazor WebAssembly aplicaciones cliente y proporciona datos meteorológicos a los componentes de FetchData las aplicaciones cliente a través de un controlador MVC. Opcionalmente, el MultipleBlazorApps.Server proyecto también puede servir páginas o vistas, como una aplicación de Pages o MVC tradicional Razor . Los pasos para habilitar el servicio de páginas o vistas se tratan más adelante en este artículo.

Nota:

En la demostración de este artículo se usan los nombres de ruta de acceso de recursos web estáticos del FirstAppMultipleBlazorApps.Client proyecto y SecondApp del MultipleBlazorApps.SecondClient proyecto. Los nombres "FirstApp" y "SecondApp" son meramente para fines de demostración. Otros nombres son aceptables para distinguir las aplicaciones cliente, como App1/App2, Client1/Client2, 1/2o cualquier esquema de nomenclatura similar.

Al enrutar solicitudes a las aplicaciones cliente por un puerto o un dominio, "FirstApp" y "SecondApp" se usan internamente para enrutar las solicitudes y atender las respuestas de los recursos estáticos y no se ven en la barra de direcciones del explorador.

Nota:

En la demostración de este artículo se usan los nombres de ruta de acceso de recursos web estáticos del FirstAppMultipleBlazorApps.Client proyecto y SecondApp del MultipleBlazorApps.SecondClient proyecto. Los nombres "FirstApp" y "SecondApp" son meramente para fines de demostración. Otros nombres son aceptables para distinguir las aplicaciones cliente, como App1/App2, Client1/Client2, 1/2o cualquier esquema de nomenclatura similar.

"FirstApp" y "SecondApp" también aparecen en la barra de direcciones del explorador porque las solicitudes se enrutan a las dos aplicaciones cliente con estos nombres. Se admiten otros segmentos de ruta url válidos y los segmentos de ruta no necesitan coincidir estrictamente con los nombres usados para enrutar los recursos web estáticos internamente. El uso de "FirstApp" y "SecondApp" para el enrutamiento de recursos estáticos internos y el enrutamiento de solicitudes de aplicación es simplemente para la colaboración en los ejemplos de este artículo.

En el primer archivo de proyecto de la aplicación cliente (MultipleBlazorApps.Client.csproj), agregue una <StaticWebAssetBasePath> propiedad a <PropertyGroup> con un valor de FirstApp para establecer la ruta de acceso base para los recursos estáticos del proyecto:

<StaticWebAssetBasePath>FirstApp</StaticWebAssetBasePath>

En el archivo de proyecto de la MultipleBlazorApps.SecondClient aplicación (MultipleBlazorApps.SecondClient.csproj):

  • Agregue una <StaticWebAssetBasePath> propiedad a <PropertyGroup> con un valor de SecondApp:

    <StaticWebAssetBasePath>SecondApp</StaticWebAssetBasePath>
    
  • Agregue una referencia de proyecto para el MultipleBlazorApps.Shared proyecto a :<ItemGroup>

    <ItemGroup>
      <ProjectReference Include="..\Shared\MultipleBlazorApps.Shared.csproj" />
    </ItemGroup>
    

En el archivo de proyecto de la aplicación de servidor (Server/MultipleBlazorApps.Server.csproj), cree una referencia de proyecto para la aplicación cliente agregada MultipleBlazorApps.SecondClient en :<ItemGroup>

<ProjectReference Include="..\SecondClient\MultipleBlazorApps.SecondClient.csproj" />

En el archivo de Properties/launchSettings.json la aplicación de servidor, configure applicationUrl el Kestrel del perfil (MultipleBlazorApps.Server) para acceder a las aplicaciones cliente en los puertos 5001 y 5002. Si configura el entorno local para usar los dominios de ejemplo, las direcciones URL para applicationUrl pueden usar firstapp.com y secondapp.com no usar los puertos.

Nota:

El uso de puertos en esta demostración permite el acceso a los proyectos de cliente en un explorador local sin necesidad de configurar un entorno de hospedaje local para que los exploradores web puedan acceder a las aplicaciones cliente a través de las configuraciones firstapp.com de host y secondapp.com. En escenarios de producción, una configuración típica es usar subdominios para distinguir las aplicaciones cliente.

Por ejemplo:

  • Los puertos se quitan de la configuración de esta demostración.
  • Los hosts se cambian para usar subdominios, como www.contoso.com para los visitantes del sitio y admin.contoso.com para los administradores.
  • Se pueden incluir hosts adicionales para aplicaciones cliente adicionales y se requiere al menos un host más si la aplicación de servidor también es una Razor aplicación Pages o MVC que sirve páginas o vistas.

Si tiene previsto proporcionar páginas o vistas desde la aplicación de servidor, use la siguiente applicationUrl configuración en el Properties/launchSettings.json archivo, que permite el acceso siguiente:

  • Opcionalmente, la Razor aplicación Pages o MVC (MultipleBlazorApps.Server project) responde a las solicitudes en el puerto 5000.
  • Las respuestas a las solicitudes del primer cliente (MultipleBlazorApps.Client proyecto) están en el puerto 5001.
  • Las respuestas a las solicitudes del segundo cliente (MultipleBlazorApps.SecondClient proyecto) están en el puerto 5002.
"applicationUrl": "https://localhost:5000;https://localhost:5001;https://localhost:5002",

Si no tiene previsto que la aplicación de servidor sirva páginas o vistas y solo sirva a las Blazor WebAssembly aplicaciones cliente, use la siguiente configuración, que permite el acceso siguiente:

  • La primera aplicación cliente responde en el puerto 5001.
  • La segunda aplicación cliente responde en el puerto 5002.
"applicationUrl": "https://localhost:5001;https://localhost:5002",

En el archivo de la aplicación de Program.cs servidor, quite el código siguiente, que aparece después de la llamada a UseHttpsRedirection:

  • Si tiene previsto proporcionar páginas o vistas desde la aplicación de servidor, elimine las siguientes líneas de código:

    - app.UseBlazorFrameworkFiles();
    
    - app.MapFallbackToFile("index.html");
    
  • Si planea que la aplicación de servidor solo sirva a las Blazor WebAssembly aplicaciones cliente, elimine el código siguiente:

    - app.UseBlazorFrameworkFiles();
    
    ...
    
    - app.UseRouting();
    
    - app.MapRazorPages();
    - app.MapControllers();
    - app.MapFallbackToFile("index.html");
    

    Deje el middleware de archivos estáticos en su lugar:

    app.UseStaticFiles();
    
  • Agregue middleware que asigne solicitudes a las aplicaciones cliente. En el ejemplo siguiente se configura el middleware para que se ejecute cuando el puerto de solicitud sea 5001 para la primera aplicación cliente o 5002 para la segunda aplicación cliente o el host de solicitud sea firstapp.com para la primera aplicación cliente o secondapp.com para la segunda aplicación cliente.

    Nota:

    El uso de los hosts (firstapp.com/secondapp.com) en un sistema local con un explorador local requiere una configuración adicional que esté fuera del ámbito de este artículo. Para las pruebas locales de este escenario, se recomienda usar puertos. Las aplicaciones de producción típicas están configuradas para usar subdominios, como www.contoso.com para los visitantes del sitio y admin.contoso.com para los administradores. Con la configuración de DNS y servidor adecuada, que está fuera del ámbito de este artículo y depende de las tecnologías usadas, la aplicación responde a las solicitudes en cualquier host denominado en el código siguiente.

    Donde quitó la app.UseBlazorFrameworkFiles(); línea de Program.cs, coloque el código siguiente:

    app.MapWhen(ctx => ctx.Request.Host.Port == 5001 || 
        ctx.Request.Host.Equals("firstapp.com"), first =>
    {
        first.Use((ctx, nxt) =>
        {
            ctx.Request.Path = "/FirstApp" + ctx.Request.Path;
            return nxt();
        });
    
        first.UseBlazorFrameworkFiles("/FirstApp");
        first.UseStaticFiles();
        first.UseStaticFiles("/FirstApp");
        first.UseRouting();
    
        first.UseEndpoints(endpoints =>
        {
            endpoints.MapControllers();
            endpoints.MapFallbackToFile("/FirstApp/{*path:nonfile}", 
                "FirstApp/index.html");
        });
    });
    
    app.MapWhen(ctx => ctx.Request.Host.Port == 5002 || 
        ctx.Request.Host.Equals("secondapp.com"), second =>
    {
        second.Use((ctx, nxt) =>
        {
            ctx.Request.Path = "/SecondApp" + ctx.Request.Path;
            return nxt();
        });
    
        second.UseBlazorFrameworkFiles("/SecondApp");
        second.UseStaticFiles();
        second.UseStaticFiles("/SecondApp");
        second.UseRouting();
    
        second.UseEndpoints(endpoints =>
        {
            endpoints.MapControllers();
            endpoints.MapFallbackToFile("/SecondApp/{*path:nonfile}", 
                "SecondApp/index.html");
        });
    });
    

    Advertencia

    Las API que se basan en el encabezado host, como HttpRequest.Host y RequireHost, están sujetas a una posible suplantación de identidad por parte de los clientes.

    Para evitar la suplantación de identidad de host y puerto, use uno de los métodos siguientes:

  • Agregue middleware que asigne solicitudes a las aplicaciones cliente. En el ejemplo siguiente se configura el middleware para que se ejecute cuando la subruta de solicitud sea /FirstApp para la primera aplicación cliente o /SecondApp para la segunda aplicación cliente.

    Donde quitó la app.UseBlazorFrameworkFiles(); línea de Program.cs, coloque el código siguiente:

    app.MapWhen(ctx => ctx.Request.Path.StartsWithSegments("/FirstApp", 
        StringComparison.OrdinalIgnoreCase), first =>
    {
        first.UseBlazorFrameworkFiles("/FirstApp");
        first.UseStaticFiles();
        first.UseStaticFiles("/FirstApp");
        first.UseRouting();
    
        first.UseEndpoints(endpoints =>
        {
            endpoints.MapControllers();
            endpoints.MapFallbackToFile("/FirstApp/{*path:nonfile}",
                "FirstApp/index.html");
        });
    });
    
    app.MapWhen(ctx => ctx.Request.Path.StartsWithSegments("/SecondApp", 
        StringComparison.OrdinalIgnoreCase), second =>
    {
        second.UseBlazorFrameworkFiles("/SecondApp");
        second.UseStaticFiles();
        second.UseStaticFiles("/SecondApp");
        second.UseRouting();
    
        second.UseEndpoints(endpoints =>
        {
            endpoints.MapControllers();
            endpoints.MapFallbackToFile("/SecondApp/{*path:nonfile}",
                "SecondApp/index.html");
        });
    });
    
  • Establezca la ruta de acceso base en cada aplicación cliente:

    En el primer archivo de index.html la aplicación cliente (Client/wwwroot/index.html), actualice el valor de <base> etiqueta para reflejar la subruta. Se requiere la barra diagonal final:

    <base href="/FirstApp/" />
    

    En el segundo archivo de index.html la aplicación cliente (SecondClient/wwwroot/index.html), actualice el valor de <base> etiqueta para reflejar la subruta. Se requiere la barra diagonal final:

    <base href="/SecondApp/" />
    

Para obtener más información sobre UseStaticFiles, consulte ASP.NET archivos estáticos de CoreBlazor.

Para obtener más información sobre UseBlazorFrameworkFiles y MapFallbackToFile, consulte los siguientes recursos:

Nota:

Los vínculos de la documentación al origen de referencia de .NET cargan normalmente la rama predeterminada del repositorio, que representa el desarrollo actual para la próxima versión de .NET. Para seleccionar una etiqueta para una versión específica, use la lista desplegable Cambiar ramas o etiquetas . Para obtener más información, consulta Procedimientos para seleccionar una etiqueta de versión de código fuente de ASP.NET Core (dotnet/AspNetCore.Docs #26205).

Las solicitudes de las aplicaciones cliente a /WeatherForecast en la API de servidor son para /FirstApp/WeatherForecast o /SecondApp/WeatherForecast en función de la aplicación cliente que realice la solicitud. Por lo tanto, las rutas del controlador que devuelven datos meteorológicos de la API de servidor requieren una modificación para incluir los segmentos de ruta de acceso.

En el controlador de previsión meteorológica de la aplicación de servidor (Controllers/WeatherForecastController.cs), reemplace la ruta existente ([Route("[controller]")]) por WeatherForecastController las siguientes rutas, que tienen en cuenta las rutas de acceso de solicitud del cliente:

[Route("FirstApp/[controller]")]
[Route("SecondApp/[controller]")]

Si tiene previsto servir páginas desde la aplicación de servidor, agregue una IndexRazor página a la Pages carpeta de la aplicación de servidor:

Pages/Index.cshtml:

@page
@model MultipleBlazorApps.Server.Pages.IndexModel
@{
    ViewData["Title"] = "Home";
}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>Home</title>
</head>
<body>
    <div class="main">
        <div class="content px-4">

            <div>
                <h1>Welcome</h1>
                <p>Hello from Razor Pages!</p>
            </div>
        </div>
    </div>
</body>
</html>

Pages/Index.cshtml.cs:

using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Mvc.RazorPages;

namespace MultipleBlazorApps.Server.Pages;

public class IndexModel : PageModel
{
    public void OnGet()
    {
    }
}
using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Mvc.RazorPages;

namespace MultipleBlazorApps.Server.Pages
{
    public class IndexModel : PageModel
    {
        public void OnGet()
        {
        }
    }
}

Nota:

La página anterior Index es un ejemplo mínimo exclusivamente con fines de demostración. Si la aplicación requiere recursos adicionales Razor de Pages, como un diseño, estilos, scripts e importaciones, obtengalos de una aplicación creada a partir de la Razor plantilla de proyecto Pages. Para obtener más información, consulte Razor Arquitectura y conceptos de Pages en ASP.NET Core.

Si tiene previsto proporcionar vistas de MVC desde la aplicación de servidor, agregue una Index vista y un Home controlador:

Views/Home/Index.cshtml:

@{
    ViewData["Title"] = "Home";
}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>Home</title>
</head>
<body>
    <div class="main">
        <div class="content px-4">

            <div>
                <h1>Welcome</h1>
                <p>Hello from MVC!</p>
            </div>
        </div>
    </div>
</body>
</html>

Controllers/HomeController.cs:

using Microsoft.AspNetCore.Mvc;

namespace MultipleBlazorApps.Server.Controllers;

public class HomeController : Controller
{
    public IActionResult Index() => View();
}

Nota:

La vista anterior Index es un ejemplo mínimo exclusivamente con fines de demostración. Si la aplicación requiere recursos de MVC adicionales, como un diseño, estilos, scripts e importaciones, obtengalos de una aplicación creada a partir de la plantilla de proyecto de MVC. Para obtener más información, consulte Introducción a ASP.NET Core MVC.

Para obtener más información sobre el uso de los componentes de cualquiera de las Razor aplicaciones cliente en páginas o vistas de la aplicación de servidor, consulte Integración de componentes de ASP.NET Core Razor con MVC o Razor Pages en soluciones hospedadasBlazor WebAssembly.

Ejecución de la aplicación

Ejecute el MultipleBlazorApps.Server proyecto:

  • Acceda a la aplicación cliente inicial en https://localhost:5001.
  • Acceda a la aplicación cliente agregada en https://localhost:5002.
  • Si la aplicación de servidor está configurada para servir páginas o vistas, acceda a la Index página o vista en https://localhost:5000.
  • Acceda a la aplicación cliente inicial en https://localhost:{DEFAULT PORT}/FirstApp.
  • Acceda a la aplicación cliente agregada en https://localhost:{DEFAULT PORT}/SecondApp.
  • Si la aplicación de servidor está configurada para servir páginas o vistas, acceda a la Index página o vista en https://localhost:{DEFAULT PORT}.

En las direcciones URL del ejemplo anterior, el {DEFAULT PORT} marcador de posición es el puerto predeterminado definido por el MultipleBlazorApps.Server archivo del Properties/launchSettings.json proyecto en su applicationUrl valor.

Importante

Al ejecutar la aplicación con el dotnet watch comando (o dotnet run) (CLI de .NET), confirme que el shell de comandos está abierto en la Server carpeta de la solución.

Al usar el botón inicio de Visual Studio para ejecutar la aplicación, confirme que el MultipleBlazorApps.Server proyecto está establecido como proyecto de inicio (resaltado en el Explorador de soluciones).

Recursos estáticos

Cuando un recurso se encuentra en la carpeta de wwwroot una aplicación cliente, proporcione la ruta de acceso de solicitud de recurso estático en los componentes:

<img alt="..." src="{PATH AND FILE NAME}" />

El marcador de posición {PATH AND FILE NAME} es la ruta de acceso y el nombre de archivo en wwwroot.

Por ejemplo, el origen de una imagen de Jeep (jeep-yj.png) en la vehicle carpeta de wwwroot:

<img alt="Jeep Wrangler YJ" src="vehicle/jeep-yj.png" />

Razor Compatibilidad con la biblioteca de clases (RCL)

Agregue la Razor biblioteca de clases (RCL) a la solución como un nuevo proyecto:

  • Haga clic con el botón derecho en la solución en el Explorador de soluciones y seleccione Agregar>nuevo proyecto.
  • Use la Razor plantilla de proyecto Biblioteca de clases para crear el proyecto. En los ejemplos de esta sección se usa el nombre del proyecto , que también es el nombre ComponentLibrarydel ensamblado de RCL. No active la casilla Páginas y vistas de soporte técnico .

Para cada aplicación cliente hospedada Blazor WebAssembly , cree una referencia de proyecto para el proyecto RCL haciendo clic con el botón derecho en cada proyecto cliente en el Explorador de soluciones y seleccionando Agregar>referencia de proyecto.

Use componentes de la RCL en las aplicaciones cliente con cualquiera de los enfoques siguientes:

  • Coloque una @using directiva en la parte superior del componente para el espacio de nombres de la RCL y agregue Razor sintaxis para el componente. El ejemplo siguiente es para una RCL con el nombre ComponentLibrarydel ensamblado :

    @using ComponentLibrary
    
    ...
    
    <Component1 />
    
  • Proporcione el espacio de nombres de la RCL junto con la Razor sintaxis del componente. Este enfoque no requiere una @using directiva en la parte superior del archivo de componente. El ejemplo siguiente es para una RCL con el nombre ComponentLibrarydel ensamblado :

    <ComponentLibrary.Component1 />
    

Nota:

También se puede colocar una @using directiva en el archivo de _Import.razor cada aplicación cliente, lo que hace que el espacio de nombres de la RCL esté disponible globalmente para los componentes de ese proyecto.

Cuando cualquier otro recurso estático se encuentra en la wwwroot carpeta de una RCL, haga referencia al recurso estático en una aplicación cliente según las instrucciones de la interfaz de usuario reutilizable Razor en las bibliotecas de clases con ASP.NET Core:

<img alt="..." src="_content/{PACKAGE ID}/{PATH AND FILE NAME}" />

El {PACKAGE ID} marcador de posición es el identificador de paquete de la RCL. El id. de paquete tiene como valor predeterminado el nombre de ensamblado del proyecto si <PackageId> no se especifica en el archivo del proyecto. El {PATH AND FILE NAME} marcador de posición es ruta de acceso y nombre de archivo en wwwroot.

En el ejemplo siguiente se muestra el marcado de una imagen de Jeep (jeep-yj.png) en la vehicle carpeta de la carpeta rcl wwwroot . El ejemplo siguiente es para una RCL con el nombre ComponentLibrarydel ensamblado :

<img alt="Jeep Wrangler YJ" src="_content/ComponentLibrary/vehicle/jeep-yj.png" />

Recursos adicionales