Размещение и развертывание ASP.NET Core Blazor

Примечание.

Это не последняя версия этой статьи. В текущем выпуске см . версию .NET 8 этой статьи.

Предупреждение

Эта версия ASP.NET Core больше не поддерживается. Дополнительные сведения см. в статье о политике поддержки .NET и .NET Core. В текущем выпуске см . версию .NET 8 этой статьи.

Внимание

Эта информация относится к предварительному выпуску продукта, который может быть существенно изменен до его коммерческого выпуска. Майкрософт не предоставляет никаких гарантий, явных или подразумеваемых, относительно приведенных здесь сведений.

В текущем выпуске см . версию .NET 8 этой статьи.

В этой статье объясняется, как размещать и развертывать Blazor приложения.

Публикация приложения

Приложения публикуются для развертывания в конфигурации выпуска.

Примечание.

Опубликуйте размещенное Blazor WebAssemblyрешение из проекта Server.

  1. Выберите команду "Опубликовать {APPLICATION}" в меню "Сборка", где {APPLICATION} заполнитель имени приложения.
  2. Выберите целевой объект публикации. Чтобы опубликовать объект в локальной среде, выберите папку.
  3. Оставьте расположение по умолчанию в поле выбора папки или укажите другое расположение. Выберите кнопку Publish.

Публикация приложения активирует восстановление зависимостей проекта и выполняет сборку проекта, прежде чем создавать ресурсы для развертывания. В ходе процесса построения удаляются неиспользуемые методы и сборки, чтобы уменьшить размер скачиваемого приложения и время загрузки.

Расположения публикации.

  • Blazor Web App: приложение публикуется в папке /bin/Release/{TARGET FRAMEWORK}/publish . Разверните содержимое папки publish на узле.
  • Blazor WebAssembly: приложение публикуется в папке bin\Release\net8.0\browser-wasm\publish\ . Чтобы развернуть приложение как статический сайт, скопируйте содержимое папки wwwroot на узел статического сайта.
  • Blazor Server: приложение публикуется в папке /bin/Release/{TARGET FRAMEWORK}/publish . Разверните содержимое папки publish на узле.
  • Blazor WebAssembly
    • Автономный: приложение публикуется в /bin/Release/{TARGET FRAMEWORK}/publish/wwwroot папке или bin\Release\{TARGET FRAMEWORK}\browser-wasm\publish в зависимости от версии пакета SDK, используемого для публикации приложения. Чтобы развернуть приложение как статический сайт, скопируйте содержимое папки wwwroot на узел статического сайта.
    • Размещено: клиентское Blazor WebAssembly приложение публикуется в /bin/Release/{TARGET FRAMEWORK}/publish/wwwroot папке серверного приложения, а также любые другие статические веб-ресурсы клиентского приложения. Разверните содержимое папки publish на узле.

В {TARGET FRAMEWORK} предыдущих путях используется целевая платформа (например, net8.0).

IIS

Сведения о размещении Blazor приложения в IIS см. в следующих ресурсах:

Совместное использование пула приложений среди приложений ASP.NET Core не поддерживается, включая приложения Blazor. Используйте один пул приложений для каждого приложения при размещении с IIS и избегайте использования виртуальных каталогов IIS для размещения нескольких приложений.

Одно или несколько приложений Blazor WebAssembly, размещенных приложением ASP.NET Core, которое называется размещенным решением Blazor WebAssembly, поддерживаются для одного пула приложений. Но мы не рекомендуем и не поддерживаем назначение одного пула приложений нескольким размещенным решениям Blazor WebAssembly или в сценариях размещения вложенных приложений.

Дополнительные сведения о решениях см. в статье Инструментарий для ASP.NET CoreBlazor.

Базовый путь приложения

Базовый путь приложения  — это корневой URL-путь приложения. Для успешной маршрутизации в Blazor приложениях требуется конфигурация платформы для любого корневого URL-адреса, который не используется по базовому пути /по умолчанию.

Рассмотрим следующее приложение ASP.NET Core и подприложение Blazor:

  • Приложение ASP.NET Core называется MyApp:
    • Физическое расположение приложения: d:/MyApp.
    • запросы принимаются по адресу: https://www.contoso.com/{MYAPP RESOURCE}.
  • Имя Blazor CoolApp приложения — это вложенное приложение MyApp:
    • Физическое расположение дочернего приложения: d:/MyApp/CoolApp.
    • запросы принимаются по адресу: https://www.contoso.com/CoolApp/{COOLAPP RESOURCE}.

Если для CoolApp не указана дополнительная конфигурация, дочернее приложение в этом сценарии не имеет сведений о своем местоположении на сервере. Например, приложение не может создавать правильные относительные URL-адреса к своим ресурсам, если ему неизвестно, что оно находится по относительному пути URL /CoolApp/. Это также применяется в различных сценариях размещения и использования обратного прокси-сервера, когда приложение не размещается по корневому пути URL.

Общие сведения

Назначениеhref тега привязки () можно создать с двумя конечными точками:

  • Абсолютные расположения, включающие схему (по умолчанию для схемы страницы, если она опущена), узел, порт и путь или просто косая черта (/) и путь (), за которым следует путь.

    Примеры: https://example.com/a/b/c или /a/b/c

  • Относительные расположения, содержащие только путь и не начинающиеся с косой черты (/). Они разрешаются относительно текущего URL-адреса документа или <base> значения тега, если указано.

    Пример: a/b/c

Наличие косой черты (/) в настроенном базовом пути приложения имеет важное значение для вычисления базового пути для URL-адресов приложения. Например, https://example.com/a имеет базовый путь https://example.com/, а https://example.com/a/ с косой чертой имеет базовый путь https://example.com/a.

Существует три источника ссылок, относящихся к Blazor приложениям ASP.NET Core:

  • URL-адреса в Razor компонентах (.razor) обычно относительны.
  • URL-адреса в сценариях, таких как Blazor скрипты (blazor.*.js), относятся к документу.
  • URL-адреса, написанные вручную в _Host.cshtml файле (Blazor Server), которые при отображении в разных документах всегда должны быть абсолютными.
  • URL-адреса в Razor компонентах (.razor) обычно относительны.
  • URL-адреса в сценариях, таких как Blazor скрипты (blazor.*.js), относятся к документу.

Если вы отрисовываете Blazor приложение из разных документов (например, /Admin/B/C/ и /Admin/D/E/), необходимо учитывать базовый путь приложения или базовый путь отличается, когда приложение отрисовывается в каждом документе и ресурсы извлекаются из неправильных URL-адресов.

Существует два подхода к решению проблемы правильного разрешения относительных связей:

  • Динамически сопоставляйте ресурсы с помощью документа, на который они были отрисованы в качестве корневого элемента.
  • Задайте согласованный базовый путь для документа и сопоставите ресурсы с этим базовым путем.

Первый вариант является более сложным и не является наиболее типичным подходом, так как он делает навигацию разными для каждого документа. Рассмотрим следующий пример для отрисовки страницы /Something/Else:

  • Отрисовка в разделе /Admin/B/C/страницы отрисовывается с помощью пути /Admin/B/C/Something/Else.
  • Отрисовка в разделе /Admin/D/E/страницы отрисовывается по тому же пути/Admin/B/C/Something/Else.

При первом подходе предложения IDynamicEndpointMetadata маршрутизации и MatcherPolicy, которые в сочетании могут быть основой для реализации полностью динамического решения, определяющего во время выполнения о том, как маршрутизовываются запросы.

Для второго варианта, который является обычным подходом, приложение задает базовый путь в документе и сопоставляет конечные точки сервера с путями под базой. В следующем руководстве используется этот подход.

Серверная сторона Blazor

Сопоставить SignalR концентратор приложения на стороне Blazor сервера, передав путь к MapBlazorHub файлу Program :

app.MapBlazorHub("base/path");

Преимущество использования MapBlazorHub заключается в том, что вы можете сопоставить шаблоны, такие как "{tenant}" , а не только конкретные пути.

Вы также можете сопоставить SignalR концентратор, если приложение находится в виртуальной папке с конвейером ветвленного по промежуточного слоя. В следующем примере запросы для /base/path/ обработки обрабатываются концентраторомBlazorSignalR:

app.Map("/base/path/", subapp => {
    subapp.UsePathBase("/base/path/");
    subapp.UseRouting();
    subapp.UseEndpoints(endpoints => endpoints.MapBlazorHub());
});

<base> Настройте тег в соответствии с инструкциями в разделе "Настройка базового пути приложения".

Размещенного Blazor WebAssembly

Если приложение является размещенным Blazor WebAssembly приложением:

  • Server В проекте (Program.cs):
    • Настройте путь UseBlazorFrameworkFiles (например, app.UseBlazorFrameworkFiles("/base/path");).
    • Настройте вызовы UseStaticFiles (например, app.UseStaticFiles("/base/path");).
  • Client В проекте:

Пример размещения нескольких приложений в размещенном Blazor WebAssembly решении см. в разделе "Несколько размещенных ASP.NET Основных Blazor WebAssembly приложений", где рассматриваются подходы для размещения доменов и портов и подпатов размещения нескольких Blazor WebAssembly Blazor WebAssembly клиентских приложений.

Автономный Blazor WebAssembly

В автономном Blazor WebAssembly приложении настроен только <base> тег в соответствии с инструкциями в разделе "Настройка базового пути приложения".

Настройка базового пути приложения

Чтобы предоставить конфигурацию базового Blazor пути https://www.contoso.com/CoolApp/приложения, задайте базовый путь приложения (<base>), который также называется относительным корневым путем.

Настроив базовый путь приложения, компонент, который не находится в корневом каталоге, может создавать URL-адреса относительно корневого пути приложения. Компоненты, которые существуют на разных уровнях структуры каталогов, могут создавать ссылки на другие ресурсы во всех местах приложения. Базовый путь к приложению также используется для перехвата выбранных гиперссылок, когда целевой объект ссылки href находится в пределах URI-пространства базового пути к приложению. Компонент Router обрабатывает внутреннюю навигацию.

<base> Поместите тег в <head> разметку (расположение содержимого) перед элементами со значениями атрибутов<head>, которые являются URL-адресами, такими как href атрибуты <link> элементов.

Во многих сценариях размещения относительный путь URL к приложению является корнем приложения. В этих случаях по умолчанию относительный базовый путь URL-адреса приложения настраивается / как <base href="/" /> в <head> содержимом.

Во многих сценариях размещения относительный путь URL к приложению является корнем приложения. В этих случаях по умолчанию относительный базовый путь к URL-адресу приложения соответствует следующему <head> содержимому:

  • Blazor Server: ~/ настроено как <base href="~/" />.
  • Blazor WebAssembly: / настроено как <base href="/" />.

Примечание.

В некоторых сценариях размещения, таких как GitHub Pages и вложенные приложения IIS, базовый путь приложения должен быть установлен на относительный URL-адрес сервера приложения.

  • В серверном Blazor приложении используйте любой из следующих подходов:

    • Вариант 1. Используйте <base> тег, чтобы задать базовый путь приложения (расположение содержимого<head>):

      <base href="/CoolApp/">
      

      Требуется завершающая косая черта.

    • Вариант 2. Сначала вызовите UsePathBase в конвейере обработки запросов приложения () сразу после WebApplicationBuilder построения (Program.csbuilder.Build()), чтобы настроить базовый путь для любого следующего по промежуточного слоя, взаимодействующего с путем запроса:

      app.UsePathBase("/CoolApp");
      

      Вызов UsePathBase рекомендуется, если вы также хотите запускать приложение Blazor Server локально. Например, укажите URL-адрес запуска в файле Properties/launchSettings.json:

      "launchUrl": "https://localhost:{PORT}/CoolApp",
      

      Заполнитель {PORT} в предыдущем примере — это порт, соответствующий защищенному порту в пути конфигурации applicationUrl. В следующем примере показан полный профиль запуска приложения на порту 7279.

      "BlazorSample": {
        "commandName": "Project",
        "dotnetRunMessages": true,
        "launchBrowser": true,
        "applicationUrl": "https://localhost:7279;http://localhost:5279",
        "launchUrl": "https://localhost:7279/CoolApp",
        "environmentVariables": {
          "ASPNETCORE_ENVIRONMENT": "Development"
      }
      

      Дополнительные сведения о launchSettings.json файле см. в разделе "Использование нескольких сред в ASP.NET Core". Дополнительные сведения о Blazor базовых путях и размещении приложений см<base href="/" />. в статье или альтернативе базовому тегу для Blazor интеграции MVC (dotnet/aspnetcore #43191).

  • Blazor WebAssembly Автономная (wwwroot/index.html):

    <base href="/CoolApp/">
    

    Требуется завершающая косая черта.

  • Размещено Blazor WebAssembly (Client проект, wwwroot/index.html):

    <base href="/CoolApp/">
    

    Требуется завершающая косая черта.

    Server В проекте сначала вызовите UsePathBaseв конвейере обработки запросов приложения () сразу после WebApplicationBuilder сборки (Program.csbuilder.Build()), чтобы настроить базовый путь для любого следующего по промежуточного слоя, взаимодействующего с путем запроса:

    app.UsePathBase("/CoolApp");
    

Примечание.

При использовании WebApplication (см. раздел "Миграция с ASP.NET Core 5.0 на 6.0") app.UseRouting должен вызываться после UsePathBase того, чтобы по промежуточному слоям маршрутизации можно было наблюдать измененный путь перед сопоставлением маршрутов. В противном случае маршруты будут сопоставляться, прежде чем UsePathBase перезапишет путь, как описано в статьях Порядок ПО промежуточного слоя и Маршрутизация.

Не префикс ссылок по всему приложению с косой чертой. Избегайте использования разделителя сегментов пути, либо используйте нотацию относительного пути точка-косая черта (./):

  • Неправильно: <a href="/account">
  • Правильно: <a href="account">
  • Правильно: <a href="./account">

В Blazor WebAssembly запросах веб-API со HttpClient службой убедитесь, что вспомогательные элементы JSON (HttpClientJsonExtensions) не префикс url-адреса с косой чертой (/):

  • Неправильно: var rsp = await client.GetFromJsonAsync("/api/Account");
  • Правильно: var rsp = await client.GetFromJsonAsync("api/Account");

Не префикс диспетчера навигации относительных ссылок с косой чертой. Избегайте использования разделителя сегментов пути или используйте нотацию относительного пути () с точки-косой чертой (./Navigationявляется внедреннойNavigationManager):

  • Неправильно: Navigation.NavigateTo("/other");
  • Правильно: Navigation.NavigateTo("other");
  • Правильно: Navigation.NavigateTo("./other");

В стандартных конфигурациях для размещения Azure или служб IIS дополнительная настройка обычно не требуется. В некоторых сценариях размещения, отличных от IIS и обратного прокси-сервера, может потребоваться дополнительная конфигурация ПО промежуточного слоя статических файлов:

  • Для правильного обслуживания статических файлов (например, app.UseStaticFiles("/CoolApp");).
  • Для обслуживания скрипта Blazor (_framework/blazor.*.js). Дополнительные сведения. см. в статье Статические файлы ASP.NET Core Blazor.

Приложение Blazor WebAssembly с некорневым относительным путем URL (например, <base href="/CoolApp/">) не сможет найти свои ресурсы при локальном запуске. Для решения этой проблемы во время локальной разработки и тестирования можно предоставить аргумент базового пути, который соответствует значению href тега <base> во время выполнения. Не добавляйте в конце косую черту. Чтобы передать базовый аргумент пути при локальном запуске приложения, выполните dotnet watch команду (или dotnet run) из каталога приложения с параметром --pathbase :

dotnet watch --pathbase=/{RELATIVE URL PATH (no trailing slash)}

Для приложения Blazor WebAssembly с относительным путем URL /CoolApp/ (<base href="/CoolApp/">) команда имеет следующий вид:

dotnet watch --pathbase=/CoolApp

Если вы предпочитаете настроить профиль запуска приложения, чтобы указать pathbase автоматически, а не вручную с dotnet watch помощью (или dotnet run), задайте commandLineArgs свойство в Properties/launchSettings.json. В следующем примере также настраивается URL-адрес запуска (launchUrl):

"commandLineArgs": "--pathbase=/{RELATIVE URL PATH (no trailing slash)}",
"launchUrl": "{RELATIVE URL PATH (no trailing slash)}",

В качестве примера используется CoolApp:

"commandLineArgs": "--pathbase=/CoolApp",
"launchUrl": "CoolApp",

dotnet watch Используя параметр (илиdotnet run) с --pathbase параметром или конфигурацией профиля запуска, которая задает базовый путь, Blazor WebAssembly приложение отвечает локальноhttp://localhost:port/CoolApp.

Дополнительные сведения о launchSettings.json файле см. в разделе "Использование нескольких сред в ASP.NET Core". Дополнительные сведения о Blazor базовых путях и размещении приложений см<base href="/" />. в статье или альтернативе базовому тегу для Blazor интеграции MVC (dotnet/aspnetcore #43191).

Получение базового пути приложения из конфигурации

В следующем руководстве объясняется, как получить путь к <base> тегу из файла параметров приложения для разных сред.

Добавьте файл параметров приложения в приложение. В следующем примере используется Staging среда (appsettings.Staging.json):

{
  "AppBasePath": "staging/"
}

В серверном Blazor приложении загрузите базовый путь из конфигурации в <head> содержимом:

@inject IConfiguration Config

...

<head>
    ...
    <base href="/@(Config.GetValue<string>("AppBasePath"))" />
    ...
</head>

Кроме того, серверное приложение может получить значение из конфигурации UsePathBase. Поместите следующий код в конвейер обработки запросов приложения (Program.cs) сразу после WebApplicationBuilder сборки (builder.Build()). В следующем примере используется ключ AppBasePathконфигурации:

app.UsePathBase($"/{app.Configuration.GetValue<string>("AppBasePath")}");

В клиентском Blazor WebAssembly приложении:

Если для загрузки не требуется значение конфигурации, например в средах, отличных от промежуточной среды, предыдущий href путь разрешается в корневой путь /.

Примеры в этом разделе посвящены предоставлению базового пути приложения из параметров приложения, но подход чтения пути IConfiguration из любого поставщика конфигурации является допустимым. Дополнительные сведения см. на следующих ресурсах:

Blazor ServerКонфигурация MapFallbackToPage

Этот раздел применяется только к приложениям Blazor Server . MapFallbackToPage не поддерживается в Blazor Web Appприложениях и Blazor WebAssembly приложениях.

В сценариях, где приложению требуется отдельная область с настраиваемыми ресурсами и компонентами Razor, выполните приведенные ниже действия.

  • Создайте папку в папке Pages приложения для хранения ресурсов. Например, раздел администратора приложения создается в новой папке с именем Admin (Pages/Admin).

  • Создайте корневую страницу (_Host.cshtml) для области. Например, создайте файл Pages/Admin/_Host.cshtml на основе основной корневой страницы приложения (Pages/_Host.cshtml). Не указывайте директиву @page на странице _Host администратора.

  • Добавьте макет к папке области (например, Pages/Admin/_Layout.razor). В макете для отдельной области задайте тег <base> href в соответствии с папкой области (например, <base href="/Admin/" />). В демонстрационных целях добавьте ~/ к статическим ресурсам на странице. Например:

    • ~/css/bootstrap/bootstrap.min.css
    • ~/css/site.css
    • ~/BlazorSample.styles.css (пространство имен для примера приложения — BlazorSample)
    • ~/_framework/blazor.server.js (скрипт Blazor)
  • Если область должна иметь собственную статическую папку ресурсов, добавьте ее и укажите ее расположение в ПО промежуточного слоя статических файлов в Program.cs (например, app.UseStaticFiles("/Admin/wwwroot")).

  • Компоненты Razor добавляются в папку области. Как минимум, добавьте компонент Index в папку области с правильной директивой @page для области. Например, добавьте файл Pages/Admin/Index.razor на основе заданного по умолчанию файла Pages/Index.razor приложения. Укажите область администратора в качестве шаблона маршрута в верхней части файла (@page "/admin"). Добавьте дополнительные компоненты по мере необходимости. Например, Pages/Admin/Component1.razor с директивой @page и шаблоном маршрута @page "/admin/component1.

  • В Program.cs вызовите MapFallbackToPage для пути к запросу области сразу же перед путем к резервной корневой странице к странице _Host:

    ...
    app.UseRouting();
    
    app.MapBlazorHub();
    app.MapFallbackToPage("~/Admin/{*clientroutes:nonfile}", "/Admin/_Host");
    app.MapFallbackToPage("/_Host");
    
    app.Run();
    

Размещение нескольких Blazor WebAssembly приложений

Дополнительные сведения о размещении нескольких приложений Blazor WebAssembly в размещенном решении Blazor см. в статье Несколько размещенных приложений ASP.NET Core Blazor WebAssembly.

Развертывание

Инструкции по развертыванию см. в следующих разделах: