Поток развертывания приложения Angular закончен на экземплярах AWS EC2

Question

Я пытаюсь найти лучший способ развертывания приложения angular в Amazon Web Service. Мое приложение уже работает нормально, и я размещаю его на VPS. Я хотел бы перенести мое приложение на AWS, но не могу понять, как выполнить развертывание.

В настоящее время, поскольку мое приложение также имеет серверную часть lumen, я использую composer library deployer для развертывания моего приложения на сервере. Этот сценарий в основном регистрируется на удаленном сервере, получает мой код через git pull, компилирует и устанавливает все необходимые зависимости, затем изменяет символические ссылки на новую версию, чтобы она была доступна из Интернета.

Используя этот метод angular приложение - это компилятор на сервере, который может использовать много оперативной памяти для простой компиляции. Недавно мне пришлось обновить свою оперативную память по этой самой причине.

Теперь мой вопрос: как я могу аналогичным образом развернуть мое приложение на AWS? В идеале я хотел бы использовать функцию балансировки нагрузки AWS, поэтому мне понадобится AMI моего обновленного приложения. Я знаю, что это можно сделать с помощью Amazon SDK, но я не совсем уверен, что это путь к go.

В настоящее время мой процесс развертывания будет:

• Мастер извлечения в новую папку
• Установите зависимости
• скомпилируйте приложение
• build и AMI, используя папку dist (каким-то образом)
• Загрузить AMI включен AWS
• Уведомите мой экземпляр об использовании нового AMI вместо текущего.
• Промойте и повторите для API.

I ' Я также боюсь, что это приведет к простоям из-за перезапуска экземпляра.

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

Я также знаю о Усиление , но я никогда не использовал его, и я не уверен, что он будет делать то, что я Я ищу, так как я не ищу автоматического развертывания.

У меня есть че Я уже ответил на несколько вопросов, но они не выглядят так, как я ищу. Развертывание Angular Приложение на AWS для практики
Развертывание angular приложения на AWS Elasti c бобовый стебель

Answer 1

Самое быстрое решение

Разверните ваше приложение на основе Angular - используя Amazon S3 вместе с Amazon CloudFront .

Используйте стандартный или любой доступный веб-пакет для компиляции и связывания приложения в каталоге / build или / dist с использованием ng build --prod

Кроме того, вы можете написать небольшой скрипт в вашем пакете . json, чтобы переопределить поведение по умолчанию ng build. Например, добавление или обновление переменных среды во время сборки.

cp ./src/config.dev.js ./src/config.dev.bak.js &&  cp ./src/config.prod.js ./src/config.dev.js &&  react-app-rewired build &&  mv ./src/config.dev.bak.js ./src/config.dev.js

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

Время на сборку: ~ 5 минут

Как только готовая производственная сборка готова, вы может go опередить и создать корзину Amazon S3 с настройками по умолчанию (конечно, вы можете настроить параметры и безопасность позже, когда вы изучите больше).

Вот простое объяснение того, как вы можете начать работу с Amazon S3 - научиться создавать корзину

После создания корзины вы можете настроить ее для размещения сайт c. Вот еще одна ссылка из официальной AWS документации для - stati c хостинг веб-сайтов

Время для настройки Amazon S3: ~ 3 минуты

Как только вы получите ведро готово, вы можете просто загрузить свой код сборки в ведро. Веб-сайт будет доступен по конечной точке URL-адреса, предоставленной вам при настройке сервера stati c для вашего сегмента.

Несколько параметров конфигурации, которые вы можете рассмотреть при работе с Amazon S3:

1. Bucket-Policy; используйте любую легкодоступную стандартную политику Bucket и улучшайте параметры безопасности в соответствии с вашими потребностями.

2. Вы также можете настроить «Версионирование» для своего ведра, чтобы поддерживать историю выпуска.

Вы живете менее чем за 10 минут!

Пост-развертывание

1. Настройте Amazon CloudFront, который будет служить Сеть доставки контента для сайта stati c.

   Руководство по запуску: Вот путь

   Создание рассылки займет несколько минут до начала источника Bucket Server связан с дистрибутивом.

   Наряду с принудительным перенаправлением HTTPS, шифрованием SSL для вашего приложения вы также можете отслеживать трафик c, запросы, потребление ресурсов и создавать оповещения о вашем распределении с помощью Amazon CloudFront в дополнение к другим Amazon Web Services ( Amazon CloudWatch )

2. На случай, если вы хотите перенаправить трафик fi c в вашем домене - используйте Amazon Route53

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

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

Есть также другие доступные опции с веб-сервисами Amazon, такие как AWS Elasti c Beanstalk , которые могут предоставить вам Amazon EC2 экземпляр в облачной среде для поддержки вашего PHP бэкэнда. Требуется больше конфигураций, в отличие от предоставленного решения.

Всего наилучшего.

Answer 2

Выполните следующие действия: -

1. создайте приложение Angular в рабочем режиме с помощью этой команды ng build --prod
2. Я знаю два способа развертывания приложения в AWS
   1) S3 Bucket
   2) EC2 экземпляр с использованием nginx

1) для развертывания Приложение на S3 Bucket довольно простое. Следуйте этому руководству https://medium.com/codefactory/angular2-s3-love-deploy-to-cloud-in-6-steps-3f312647a659

2) для развертывания приложения на EC2 Экземпляре

• скопируйте свою сборку prod (/dist содержимое папки) внутри app или любого другого каталога AWS
• Setup Nginx на вашем сервере https://www.nginx.com/blog/setting-up-nginx/
• Создать файл конфигурации server.conf конфигурация внутри /etc/nginx/conf.d
• В server.conf файле используйте эту конфигурацию. Это очень простая конфигурация. Убедитесь, что вы указали правильный путь сборки, а каталог должен иметь разрешение на выполнение. Вы также можете используйте Nginx в качестве балансировщика нагрузки.

server {
    root /home/ec2-user/app;

    location / {
    try_files $uri $uri/ /index.html;
    }
}