Автоматизация развертывания статических веб-сайтов с Github на S3 с помощью AWS CodePipeline


Резюме

В этом блоге описаны шаги, необходимые для добавления конвейера непрерывной интеграции и непрерывной доставки (CI/CD) к существующему ведру в Amazon Simple Storage Service (Amazon S3) в облаке Amazon Web Services (AWS) Cloud.

В этом блоге в качестве поставщика источников используется GitHub. Конвейер запускается при фиксации новых элементов, после чего изменения отражаются в ведре S3.

В блоге будет рассказано о создании учетной записи AWS для автоматического развертывания статического веб-сайта с Github на S3 с помощью AWS CodePipeline.

Пояснения по инструментам

  • AWS CodePipeline — служба непрерывной доставки, которую можно использовать для моделирования, визуализации и автоматизации шагов, необходимых для выпуска вашего программного обеспечения. Вы можете быстро смоделировать и настроить различные этапы процесса выпуска программного обеспечения.
    CodePipeline автоматизирует шаги, необходимые для непрерывного выпуска изменений в вашем программном обеспечении.

  • Amazon S3 — высокомасштабируемая служба хранения объектов. Она может использоваться для хранения данных в самых разных системах, включая веб-сайты, мобильные приложения, резервные копии и озера данных.

Необходимые условия и ограничения

Необходимые условия
  1. Активная учетная запись AWS
  2. Знание Amazon S3 и AWS CodePipeline
  3. Статический веб-сайт
  4. Репозиторий GitHub
Ограничения
  • Этот процесс рекомендуется для отображения содержимого, доступного только для чтения. Он не рекомендуется для сбора или передачи конфиденциальной информации, поскольку Amazon S3 использует протокол HTTP.
  • Веб-сайты, созданные с использованием PHP, JSP или APS.NET, не поддерживаются, поскольку Amazon S3 не поддерживает сценарии на стороне сервера.

Архитектура:

Шаг 1: Создание учетной записи AWS

Создайте учетную запись AWS, зарегистрировавшись здесь: aws.amazon.com

Шаг 2: Регистрация учетной записи

После успешной регистрации войдите в консоль

Шаг 3: Создание ведра S3

Перейдите к ведру Amazon S3 и создайте новый S3 Bucket для размещения/загрузки контента. S3 является глобальным сервисом, поэтому требуется уникальное имя ведра.

Введите уникальное DNS-совместимое имя, глобально уникальное, поскольку пространство имен будет общим для всех учетных записей AWS.

Выберите либо регион AWS по умолчанию, либо конкретный регион, в котором будет расположено ваше ведро.

Установите разрешения, разрешив публичный доступ к вашему ведру, выбрав Разрешения, а затем выбрав Изменить. Выберите Off для Block all public access. По умолчанию этот флажок установлен в целях безопасности. Выберите Сохранить и просмотрите информацию, прежде чем выбрать Создать ведро. Это закроет всплывающее окно и создаст ведро.

Шаг 4: Конфигурация ведра S3 для хостинга статических веб-сайтов

Следующим шагом будет настройка ведра для статического хостинга веб-сайтов.

В консоли S3 выберите щелчком мыши ведро, которое вы только что создали.

На вкладке «Свойства» для ведра S3 выберите «Статический хостинг веб-сайтов», нажав кнопку «Изменить».

Выберите «Включить» в пункте Хостинг статических веб-сайтов.

Выберите «Хостинг статического веб-сайта» в Тип хостинга.

Укажите имена и расширения файлов для главной страницы и страницы ошибок (например, index.html и error.html). Убедитесь, что корневая папка содержит эти файлы и что они служат в качестве целевых страниц.

Нажмите кнопку Сохранить изменения.

Шаг 5: Добавление политики ведра

Создайте политику ведра, чтобы другие приложения AWS могли получить доступ и выполнять действия с вашим ведром. На вкладке Разрешения выберите Политика ведра.

В редакторе Bucket Policy вставьте политику ведра, представленную здесь:

Обязательно замените «arn:aws:s3:::example.com/» на ваш BUCKET ARN. Убедитесь, что /* находится в конце вашего Bucket ARN через запятую.

{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Sid": "PublicReadGetObject",
            "Effect": "Allow",
            "Principal": "*",
            "Action": [
                "s3:GetObject"
            ],
            "Resource": [
                "arn:aws:s3:::example.com/*"
            ]
        }
    ]
}
Вход в полноэкранный режим Выйдите из полноэкранного режима

Нажмите Сохранить, чтобы применить политику

Шаг 6: Создание репозитория GITHUB

Создайте репозиторий и разместите в нем свой начальный объект или добавьте в него файл. (например, HTML-файл и т.д.) в хранилище.
Запомните, какую ветку вы используете, для простоты я буду использовать главную ветку.

Шаг 7: Создание конвейера

Войдите в AWS Management Console и откройте консоль AWS CodePipeline. Выберите Create pipeline.

Дайте трубопроводу полезное имя, например website-delpoy-s3.

Выберите New service role, например: AWSCodePipelineServiceRole-us-east-1-website-delpoy-s3

Хранилище артефактов: Выберите опцию Расположение по умолчанию

Нажмите Далее, чтобы перейти к следующему этапу

Шаг 8: Добавление этапа исходного кода

Выберите Github Version 2 в качестве поставщика источников.

Нажмите Connect to Github, чтобы перейти к следующему этапу.

Напишите имя соединения. Нажмите Подключиться.

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

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

Шаг 9: Фаза сборки

Пропустите этап сборки. Вы можете использовать AWS Codebuild для компиляции typescript или любого другого проекта, который необходимо собрать перед развертыванием. Мы пропускаем этот этап, поскольку репозиторий содержит статическое содержимое сайта.

Шаг 10: Этап развертывания

Выберите провайдера развертывания: Выберите Amazon S3
Ведро: Выберите ведро, настроенное для статического веб-сайта.
Извлечь файл перед развертыванием: Вы должны отметить этот параметр, поскольку конвейер кода сжимает артефакт.

Никаких дополнительных настроек не требуется. Нажмите кнопку Далее.

Вы можете вернуться и изменить конфигурацию, если допустили ошибку на шаге Review. Нажмите кнопку Создать конвейер.

Если конвейер был создан успешно, вы получите две зеленые галочки на Source и Deploy.

Пора проверить, работает ли ваш конвейер.

Поместите файл на GitHub, и CodePipeline должен подхватить его и автоматически развернуть эти дополнения/обновления на ведро S3.

Этот конвейер будет стоить всего 1 доллар в месяц и взимает плату только в том случае, если произошло развертывание.

Очистка: Удалите только что созданный конвейер.

Следуйте за Сумамой Заем на LinkedIn

Оцените статью
Procodings.ru
Добавить комментарий