Про 200 webpack-плагінів для перформансу на конференції JavaScript fwdays'20 | 14 березня
×Закрыть

Деплой VueJS + .NetCore приложения

Всем привет. Сильно не глумите за вопрос, возможно кому-то он даже покажется глупым, но я в «этом» деле недавно.
Сразу отвечу: я или плохой гуглер, или в инете действительно нету инфы на конкретно мой вопрос (первое вполне не исключено).
У меня есть сайт, как понятно из названия, фронт — VueJS и бэк — .NetCore

Первый раз встречаюсь с полным деплоем и хостингом «фулстек» сайта

Я знаю как «задеплоить» фронтенд часть, но не знаю как сделать тоже самое для бекенда так, что бы:
Во-первых, мой фронд мог делать запросы на API;
Во-вторых, если возможно, что бы только мой фронт мог делать эти запросы;

В голове мелькает мысль задеплоить их отдельно друг от друга, но навряд ли это хорошая практика.

Нужен совет: как лучшим способом задеплоить такое приложение? Можно ли задеплоить их на один сервер?
Да и вообще, какие практики деплоя фронта и бэка есть?

Заранее спасибо за ответ)
Буду так же очень благодарен, если посоветуете сервисы для реализации данной идеи.

LinkedIn
Допустимые теги: blockquote, a, pre, code, ul, ol, li, b, i, del.
Ctrl + Enter
Допустимые теги: blockquote, a, pre, code, ul, ol, li, b, i, del.
Ctrl + Enter
что бы только мой фронт мог делать эти запросы;

Любой клиент может вызывать твой http endpoint, так что это твоя задача на уровне бэкенда убедиться, что клиент авторизирован выполнять операцию, которую он запросил. Удобнее всего для это использовать JWT, наверное. С валидным токеном тебе будет без разницы какой клиент выполняет запрос. Но нужен будет еще сервис, который эти токены выдает.

Приложения я бы деплоил отдельно, а чтобы не заморачиваться с CORS можно их спрятать за reverse proxy. Тогда и у фронта и у бэка будет тот же домен.

Но нужен будет еще сервис, который эти токены выдает.

Ну либо подключить любой из существующих айдентити провайдеров

Я бы так и делал, да, решил не перегружать пост инфой. А вообще, например, auth0.com.

Только «либо» звучит, как какая-то альтернатива, а фраза

сервис, который эти токены выдает

не подразумевает, что его нужно разрабатывать/менеджить самому. Сторонний сервис — тоже сервис. А если хочется еще больше позаморачиваться/поиграться — есть identityserver.io.

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

Если работаешь с .net core то точно есть смысл разобраться с
а) Докер-файлами для контейнеризации приложения на кор
б) деплоем в Azure App Service (можно завести бесплатный аккаунт ажур с 200 баксами на счету для песочницы)
в) настройкой CI/CD пайплайнов для core и npm в Azure DevOps.
Это сценарий, которые на сегодняшний день наиболее распространенный при работе с .net core

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

Последних полгода думал, что докер это какая-то утилита для документации кода/апи :D
Вкратце пробежался по ваших пунктах — впервые встречаюсь с каждым, но звучит интересно, буду разбираться ;)
По поводу фронта — да, выбрал вариант с КОРС
Спасибо за помощь)

Докер — это технология легковесных производительных виртуальных машин на линуксе. Докерфайл это по сути инструкции как именно собрать нужно машину — за основу берется базовый темплейт машины и дальше описывается что еще нужно доустановить и как развернуть приложение, чтобы оно работало.
Для .net framework было не сильно актуально, а для кросс-платформенного .net core стало де-факто стандартом разработки.
Технология докер-контейнеров довольно мощная, и может включать в себя сложные задачи, так что прям есть выделенные специалисты по созданию и управлению сложными системами докер-контейнеров. Но в базовом варианте все довольно просто и можно за пару дней разобраться как что использовать. Главное, что это является ключиком к CI/CD. В том же Azure Devops (хотя есть и другие тулзы для той же задачи, просто с Ажуром она наиболее интегрирована) легко собираются пайплайны, реагирующие на коммит в гит, собирают по докер файлу окружение, проганяют весь набор тестов и деплоят в ажур на стейджинг или прод. И вест этот процесс занимает пару минут времени. Релиз происходит либо нажатием одной кнопки, либо вообще происходит автоматом после коммита в гит, если команда работает через trunkbaseddevelopment.com

Ох, супер. Як же круто(просто) ви вмієте писати про складне)

Ваш комментарий просветил меня в понимании, что же «оно» такое и для чего используеться, больше, чем 4-5 статтей с инета :D
Большое спасибо :)

докер это какая-то утилита для документации кода/апи :D

Вероятно вы путали докер вот с этим swagger.io

Только хотел спросить, есть ли смысл разбираться с этими пунктами углубленно не для своих целей, а для «гребежки на дядю»?

Тримай ± адекватний докер файл .net core )

github.com/...​croStarter.Api/Dockerfile

Стосовно корсів. CorsPolicyUrls — array адрес (типу твій фронт) докер піднімай на http ) прикладеш сертифікат для прикладу через nginx, буде тобі щастя )

services.AddCors(options =>
            {
                options.AddPolicy("default", policy =>
                {                    
                    var corsPolicyUrls = Configuration.GetSection("CorsPolicyUrls").Get<string[]>();

                    policy.WithOrigins(corsPolicyUrls)
                        .AllowAnyHeader()
                        .AllowAnyMethod()
                        .AllowCredentials();
                });
            });

Враховуючи те, що з докером зустрічаюсь вперше, даний файл — пекло :D
За інфу дякую)

но не знаю как сделать тоже самое для бекенда так, что бы:
Во-первых, мой фронд мог делать запросы на API;
Во-вторых, если возможно, что бы только мой фронт мог делать эти запросы;

1. Деплой: docs.microsoft.com/...​nginx?view=aspnetcore-2.2
2. Не знаю як принято по стандарту, я зробив паблік токен без якого сервер буде відкидати запит як неавторизований. Цей токен в заголовку на фронті вказується. Звісно цей токен можна витягти з фронту і використовувати на лівому сайті. Правда там ще CORS буде блокуватися якщо сервер не повертає заголовок з дозволом браузеру викликати з того домену.

В голове мелькает мысль задеплоить их отдельно друг от друга, но навряд ли это хорошая практика.

На мою думку це прекрасна практика коли фронт на свому сервері працює а апі на своєму. Незалежність одного від іншого.

Можно ли задеплоить их на один сервер?

Можна без проблем. В різних директоріях і навіть під різними юзерами. Тільки nginx хости налаштувати.

Начебто зрозуміло та має сенс, дякую :)
Поки що буду пробувати таким чином, можливо в когось будуть ще якісь думки

Поставте на один сервер в різні директорії і все. Потім апі привязати на піддомен api.domain.com, налаштувати CORS в .net core в Startup.cs. Точний шмат коду не памятаю, буду дома скину. Можна ще погуглити. Є лише 2 варіанти деплою апі — на одному сервері разом з фронт апкою, чи окремо. Звісно ще є екзотика як серверлес, але я не впевнений що треба з цим шукати собі головної болі. А от фронт ніби як буває ставлять на якісь сторонні серверлес провайдери де не треба морочитися з налаштуванням серверу під нього.

UPD. Брешу, ще можна в докер контейнері задеплоїти. Ну і мсовський azure web service з яким інтегрована віжуал студіо комюніті. Що то за звір теж не в курсі, але по ідеї має полегшувати деплой і конфігурування серверу. Якщо не шкода переплатити за хостинг я б звернув увагу. В іншому разі тільки дешевий віртуал хостинг під лінукс.

Як налаштувати CORS знаю, думав просто чи на 100% це надійно.
Поки що піду Вами описаним шляхом
Можливо знаєте сервіс де можна і .NetCore і фронт розгорнути чи тут тільки орендувати сервер і власноруч налаштовувати все треба?

Можливо знаєте сервіс для автоматичного хостингу .NetCore чи тут тільки платити за сервер і власноруч налаштовувати все треба?

Я оновив коментар додавши про Azure App Service. docs.microsoft.com/...​ng-vs?view=aspnetcore-2.2

По ідеї цей варіант має бути найлегшим, так як МС працює над інтеграцією .нет кор і своїм хостингом в першу чергу. Не пробував, але рекомендую. Для початку подивіться що в них за ціни. Здається там двозначне число. З лінуксом можна за декілька доларів хостити, хоч і прийдеться повозитися з налаштуванням. Докер контейнер під лінукс, теж має спростити деплой, але я у себе на чисту убунту встановив апку використовуючи .net Runtime без жодних сервісів додаткових. Ніби як все ок працює, але поки апка не пішла в продакшин і не дістала серйозну провірку під великим трафіком то важко сказати. Загалом особливих проблем не бачу, заливаю на сервер зіп папку з білдом, розпаковую в директорії куди нгінх налаштований, рестартю сервер і автоматично запускається нова версія апу.

Як налаштувати CORS знаю, думав просто чи на 100% це надійно.

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

Незрозуміло навіщо автору захищати публічні ендпоінти, серед яких по самій суті не має бути жодних що модифікують щось в системі. Окрім як чогось для гостів, як контакти, статистика, реєстрація. Де ризик лише в тому що можуть заспамити ботами базу.

Анівей, які є варіанти, такі щоб не можна було витягти з нетворк активіті в браузері при посиланні запиту і вставити той публічний ключ потім ботам? Реферал підробляється. По чому домен можна залізно визначити? Судячи по гуглу варіанту який не можна обійти нема. Тому можна просто брати з реферера або паблік токен авторизацію зробити. Захист такий собі, але краще ніж нічого.

Реальної необхідності в захисті на описаному в топіку сайті немає взагалі, так як дійсно — немає поінтів, які змінюють щось в системі, окрім описаних вами. Ціль просто в практиці даного захисту, на випадок якщо такий дійсно буде потрібен

Подписаться на комментарии