Хостинг приложения Asp.Net Core Blazor c БД PostgreSQL на сервер через git push

В этой статье мы рассмотрим, как развернуть на сервере Asp.Net приложение. Подключим его к PostgreSQL и сделаем так, чтобы доставка обновлений осуществлялась через простое обновление кода в Git-репозитории.

Обзор решения

Для примера мы возьмем Web-приложение Blazor, предоставляющее возможность извлекать из базы данных информацию о погоде.

Используемые инструменты и технологии:

• IDE:** Visual Studio 2022 

• Шаблон проекта: Blazor Web App (Server + WebAssembly)

• Версия .NET:** 8.0

• База данных: PostgreSQL

• Исходный код проекта: github

Склонируйте заранее подготовленный проект командой:

git clone https://github.com/Kuprich/AmveraWeather

Решение состоит из 2-х проектов и каталога SolutionItems: 

1. AmveraWeather — проект типа Blazor WebServer

1. AmveraWeather.Client — проект типа Blazor WebAssembly

Структура проекта (assets/project_structure.png)

> Подробнее про модели размещения ASP.NET Core Blazor

Модель и контекст БД

Содержимое файла WeatherForecast.cs, расположенного в каталоге Models проекта AmveraWeather:

cs public class WeatherForecast {     public Guid Id { get; set; }     public DateOnly Date { get; set; }     public int TemperatureC { get; set; }     public string? Summary { get; set; } }

Содержимое файла AppDbContext.cs, расположенного в каталоге Data проекта «AmveraWeather»:

c# public class AppDbContext(DbContextOptions<AppDbContext> options) : DbContext(options) {     public DbSet<WeatherForecast> Forecasts { get; set; } }

Инициализация базы данных и заполнение её тестовыми данными

Применение миграций к базе данных и заполнение её тестовыми данными реализовано в статическом классе DbInitializer, расположенном в каталоге Data проекта «AmveraWeather»:

c# public static class DbInitializer {     public static async Task InitializeDbAsync(AppDbContext dbContext)     {         await dbContext.Database.MigrateAsync();          if (dbContext.Forecasts.Any()) return;          await dbContext.AddRangeAsync(GetForecasts());         await dbContext.SaveChangesAsync();     }      private static WeatherForecast[] GetForecasts()     {         var startDate = DateOnly.FromDateTime(DateTime.Now);         var summaries = new[] { "Freezing", "Bracing", "Chilly", "Cool", "Mild", "Warm", "Balmy", "Hot", "Sweltering", "Scorching" };         return Enumerable.Range(1, 5).Select(index => new WeatherForecast         {             Date = startDate.AddDays(index),             TemperatureC = Random.Shared.Next(-20, 55),             Summary = summaries[Random.Shared.Next(summaries.Length)]         }).ToArray();     } } 

> Подробнее по использованию механизма миграций в EF Core: Обзор миграций

Подключение к PostgreSQL

В файле appsettings.json проекта AmveraWether добавлен параметр «ConnectionStrings»:

json {   "ConnectionStrings": {     "PostgreeSql": "Server=; Database=; User Id=; Password=;"   }, } 

> Данный метод определения параметра ConnectionStrings в файле appsettings.json представлен в ознакомительных целях. Данные о подключении к БД следует скрывать, например, используя «Сейф хранилище секретов приложений в разработке в ASP.NET Core«.

Публикация ASP.NET Core Blazor приложения. Подготовка

Создание Dockerfile

dockerfile # https://hub.docker.com/_/microsoft-dotnet FROM mcr.microsoft.com/dotnet/sdk:8.0 AS build WORKDIR /src  # copy csproj and restore as distinct layers COPY AmveraWeather/AmveraWeather/*.csproj ./AmveraWeather/AmveraWeather/ COPY AmveraWeather/AmveraWeather.Client/*.csproj ./AmveraWeather/AmveraWeather.Client/ RUN dotnet restore AmveraWeather/AmveraWeather/AmveraWeather.csproj   # copy everything else and build app COPY . . WORKDIR /src/AmveraWeather/AmveraWeather RUN dotnet publish "AmveraWeather.csproj" -c release -o /app/publish  # final stage/image FROM mcr.microsoft.com/dotnet/aspnet:8.0 WORKDIR /app COPY --from=build /app/publish . ENTRYPOINT ["dotnet", "AmveraWeather.dll"]

> Посетите страницу «Образы Docker для ASP.NET Core» для ознакомления с примерами DockerFile.

Контекст базы данных «AppdbContext» зарегистрирован как сервис с использованием внедрения зависимостей:

cs builder.Services.AddDbContext<AppDbContext>(opt =>     opt.UseNpgsql(builder.Configuration.GetConnectionString("PostgreeSql")) );

> Метод AddDbContext поставляется NuGet-пакетом «Microsoft.EntityFrameworkCore»

> Метод UseNpgsql поставляется NuGet-пакетом «Npgsql.EntityFrameworkCore.PostgreSQL»

Хостинг ASP.NET приложения. Deploy

Перейдите на сайт Amvera. Выполните вход в ЛК. 

Необходимо создать два проекта:

1. Проект типа Приложение

1. Проект типа PostgreSQL

Создание проекта типа Приложение. Этап 1

В ЛК создайте новый проект типа «приложение», заполнив поля: 

— Название проекта

— Тариф 

> Для данного проекта достаточно начального тарифного плана. Для решений посложнее специалисты Amvera рекомендуют выполнить первый запуск с одним из старших тарифов

Создание проекта типа Приложение. Этап 2

Т.к. репозиторий уже инициализирован, следуя подсказкам сервиса подключите проект к удаленному репозиторию командой:

git remote add amvera https://git.amvera.ru/{имя пользователя}/{имя проекта}

Далее, отправьте изменения в удаленный репозиторий командой:

git push amvera master

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

Создание проекта типа Приложение. Этап 3

— Выберите окружение: docker

— Выберите инструмент: docker

— Добавьте в параметр аргумента порт: —port 8080

— Установите порт контейнера со значением: 8080

Завершите создание проекта

> По умолчанию ASP.NET основной порт изменился с 80 по 8080

> Выполняйте команды git, не закрывая окно «Создание проекта». Так как задание конфигурации создает коммит в удаленном репозитории, это означает, что понадобится синхронизация удаленного репозитория с имеющимся

По завершении создания проекта, выполните команду

git pull amvera master

для получения файла amvera.yml:

meta:   environment: docker   toolchain:     name: docker     version: latest build:   dockerfile: Dockerfile   skip: false run:   persistenceMount: /data   containerPort: 8080   args: --port 8080

Важно: для деплоя не обязательно использовать Dockerfile. Можно задать конфигурацию и через amvera.yaml, заполнив необходимые поля в разделе конфигуратора.

Создание проекта типа PostgreSQL

Создание проекта типа PostgreSQL. Этап 1.

На главной странице управления проектами создайте новый проект с типом сервиса PostgreSQL: 

— Введите название проекта: WeatherDb

— Выберите тарифный план: «Начальный» 

Перейдите далее

Создание проекта типа PostgreSQL. Этап 2.

На следующем этапе заполните обязательные поля: 

— Имя создаваемой БД

— Имя пользователя

— Пароль пользователя

Завершите конфигурацию

Подключение проекта PostgreSQL к Blazor-приложению

Обновите локальный репозиторий командой:

git pull amvera master

После того, как проект типа PostgreSQL создан, в разделе Info появится 3 варианта доступа:

Скопируйте вариант «№1. Для чтения/записи». Далее, внесите изменения в файл appsettings.json проекта:

— Server — ранее скопированное доменное имя (одно из трех)

— Database — имя ранее созданной БД

— User Id — имя пользователя 

`json "ConnectionStrings": {   "PostgreeSql": "Server=amvera-kupri4-cnpg-weatherdb-rw; Database=weatherdb; User Id=amvera; Password=*******;" }

> Примеры строк подключения к БД типа postgreSQL

> Вносите изменения именно в файл appsettings.json. В проекте имеется файл appsettings.Development.json. ASP.NET Core может настраивать поведение приложения в зависимости от среды выполнения. Подробнее:Использование нескольких сред в ASP.NET Core

Создайте коммит:

git commit -a  -m "db connection is configured

Отправьте обновленные данные в удаленный репозиторий: 

git push amvera master

Сборка проекта начнется автоматически, но имеется возможность пересобрать проект.

В разделе Настройки основного проекта необходимо активировать доменное имя. Имя третьего уровня генерируется автоматически

> Посетите страницу Сетевое взаимодействие если вы хотите использовать своё доменное имя

Финальный результат:

Результат: мы осуществили деплой Asp.Net приложения на сервер Amvera. Подключили его к PostgreSQL и если нам потребуется его обновить, будет достаточно простой команды — git push, введенной в терминале.