Как связать front-end на Angular и back-end asp.net core?

Question

[Sitler39]

Много слышал что используют ангулар для фронта и asp.net core для бэка. По какому принципу передаются данные? Я подозреваю что c фронта кидают запросы на asp.net web api? Это единственный способ?
Спасибо!
PS. Я знаю что в студии есть готовый шаблон, но это не подходит.

Answer 1

[Антон Швец]

МС конкретно намутила воду пытаясь в свой фреймворк адаптировать для SPA.
Мыслите по другому.
Если вам нужно веб-приложение, веб-приложение состоит из двух частей (как минимум) - фронт и бэк.
Фронт это гора скриптов, которые пользователь получает от статик веб-сервера. Бэк - логика, которая умеет общаться с бд и отвечает по протоколу, доступному для фронта.
Поскольку asp.net это такая крупная энтерпрайз штука, то и фреймворк для фронта МС выбрали крупный, энтерпрайзный - Ангуляр и попытались интегрироватся с ним как могли. (Странно что МС не нашла очередной фатальный недостаток и не взялась пилить собственный веб-фрейм)
Спасибо им конечно, но по факту это два разных относительно незавимых приложения все равно и в доке Ангуляра вы про asp.net не найдете ничего.

И возвращаясь к сути вопроса, да, фронт делает http запросы на бэк. Асинхронные запросы в обе стороны тоже возможны, через websocket.

Comments

[Sitler39]

У них уже появился собственный SPA фреймворк - Blazor.

[Антон Швец]

Sitler39, засунуть CLR в WebAssembly чтобы оно работало в браузере - пока это выглядит дичью и экспериментом с мутантами. И в последний раз когда я его смотрел, оно дико тормозило.
И я подозреваю на этом поле, если оно вообще взлетит, появятся и другие, более изящные решения.

[Антон Швец]

Sitler39, а еще есть Bazel - сборка ангуляра силами C#

[Sitler39]

Спасибо, погуглю.

[Антон Швец]

Sitler39, ну суть не меняется, просто сборщик другой.

[Роман]

Ну шаблон проекта с Angular это ещё не интеграция, такой же шаблон есть и для React, даже целых два. Просто он кривой, проще иметь два проекта, один чистый Web api, второй SPA. Сейчас как раз так, 2 разных проекта, добавлены в единый воркспэйс vscode, один через dotnet cli родится, другой через ng cli. Без всяких выдуманных интеграций.

Answer 2

[Владимир Коротенко]

REST
А по поводу студии, как то у них не очень. Намного удобней держать отдельный проект для клиента в Visual Studio Code.

А сам проект api запускать
dotnet watch run

Answer 3

[atmk]

1. Создать приложение ASP.NET.CORE как Web.API. Никакой АНГУЛАР там не нужен. Это отдельный проект в Visual Studio. Он может общаться с базой MySQL и работать под Linux. Я использую VPS сервер с UBUNTU
2. В Visual Studio Code создать отдельный проект через Angular CLI.
3. Это два отдельные независимые проекты.

КАК СВЯЗАТЬ ПРОЕКТЫ МЕЖДУ СОБОЙ
На клиенте я использую ng-swagger-gen. Он автоматически генерирует все сервисы доступа с клиента к серверной части.

В беке (в проекте ASP.NET.CORE) подключить библиотеки Swashbuckle.AspNetCore
using Swashbuckle.AspNetCore.Swagger;
using Swashbuckle.AspNetCore.SwaggerGen;
Сайт Swagger
https://swagger.io/
Документация ASP.NET.Core - Swagger
https://docs.microsoft.com/en-us/aspnet/core/tutor...

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

Доступ к серверной части можно сделать откуда угодно (не только с проекта Angular). Можно например с Windows-приложения написаного на любом языке или с любого фреймворка...