Как связать фронт на React и бэкенд на ASP.NET, при условии, что и фронт и бэк представлены как 2 раздельных проекта?

Question

[Георгий Кузнецов]

Оба проекта скинуть не могу ибо кода там слишком много, даже если рассматривать каждый по отдельности.
Так вот, что помимо Cors посоветуете почитать, чтобы хотя бы понимать что ты делаешь?

p.s. оба проекта будут висеть на разных локалхостах.

Answer 1

[Василий Банников]

Ничего особенного для связи не нужно.
Фронт скорее всего запускается через webpack-dev-server - в него можно через переменные среды прокинуть адрес бэкенда.
На проде фронт будет раздаваться, скорее всего, с nginx, так что никакой параметр прокинуть нельзя, зато можно обращаться к тому же домену, на котором сидит и фронт (делать запросы типа fetch("/api/something")) - и уже на стороне nginx разруливать.

Comments

[Владимир]

https://webpack.js.org/configuration/dev-server/#d...
И ничего не нужно прокидывать в переменные

[Василий Банников]

Владимир, давно на фронт не заходил, так что писал что запомнил)

[Георгий Кузнецов]

Короче, тот к кому я недавно на собес ходил говорит что использование Cors - обязательно, пока я ничего дельного о том как его юзать в .NET не нашёл.

[Василий Банников]

Георгий Кузнецов, просто в стартапе пишешь AddCors / UseCors
Во время разработки его включать не нужно.

Answer 2

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

Сначала по организации

Application - папка репозитория и всех остальных проектов, содержит также Jenkins скрипты и документацию readme.md
Application\Application.Web - net core application project
Application\Application.Web\app - фронтенд
Application\Application.BL - бизнес логика

В принципе можно запускать фронт прямо из бэкенд проекта но это реально долго и не видно ошибок, в общем легче запускать из отдельной консоли.
Бэк правится в 2019 студии, фронт в Visual studio code.
Авторизация через identityserver4 все в одном приложении.
CORS и области конфигурируются через env файлы + дженкинс подменяет строки соединений при сборке.

Answer 3

[Владимир]

Фронт это скорее всего create react app или самописный конфиг webpack
Вебпаку можно прописать конфиг, чтобы проксировать запросы к api в определенную подпапку домена
https://webpack.js.org/configuration/dev-server/#d...
Бек поднимаете отдельно его конфигом
На продакшене нужно будет настроить nginx чтобы он одну подпапку проксировал на поднятое рядом API а остальные запросы направлял на индескный файл фронта