В этой пошаговой инструкции я покажу, как запустить простейший веб сайт, состоящий из одной статической веб страницы с помощью следующего набора облачных сервисов Amazon: AWS S3, CloudFront, Route 53 и Certificate Manager. Я продемонстрирую, как совместно задействовать использовать все эти технологии для запуска сайта.
Что нам понадобится:
- Активный аккаунт Amazon Web Services (AWS)
- Доменное имя (можно приобрести у любого регистратора имен или даже найти бесплатный домен 3 – уровня)
- Статическая веб страница, готовая к загрузке
Теперь вкратце о сервисах, которые я предлагаю использовать:
AWS S3 – облачный сервис хранения файлов Amazon Simple Storage Service, позволяющий хранить статические HTML файлы без необходимости в каком-либо виде обслуживать сервер. URL сайта, предоставляемый сервисом AWS S3 будет иметь примерно такой вид:: http://MyStaticSite.s3-website-us-east-1.amazonaws.com/index.html
Route53 – провайдер DNS, который позволит использовать вместо длинного URL, предоставляемого AWS S3, короткое приобретенное мной у регистратора доменное имя (mystaticsite77.ru)
Certificate Manager – предоставляет бесплатный SSL сертификат, который будем использовать для запуска HTTPS версии сайта
CloudFront – CDN провайдер, который позволяет обеспечить быструю загрузку сайта и привязать к сайту SSL сертификат Certificate Manager
Создание статического сайта на AWS S3
- Войдите в свой аккаунт AWS и создайте корзину (bucket) с именем www.mystaticsite77.ru (обязательно укажите www в начале имени). Выберите регион, в котором должны храниться ваши файлы.
- На вкладке Properties включите функцию хостинга статического сайта (Static website hosting).
- Укажите имя основного файла (index.html) и страницу, которую нужно отображать при ошибке (404.html). Сохраните изменения. Обратите внимание на URL (Endpoint), сгенерированного AWS. Скопируйте его.
- Чтобы открыть общий доступ к это корзине, нужно изменить политику на вкладке Permissions -> Bucket Policy
{
"Version":"2012-10-17",
"Statement":[
{
"Sid":"AddPerm",
"Effect":"Allow",
"Principal": "*",
"Action":["s3:GetObject"],
"Resource":["arn:aws:s3:::www.mystaticsite77.ru/*"]
}
]
} - Загрузите новую статическую страницу HTML в созданную корзину (Object->Upload).
Теперь сайт должен быть доступен по длинному endpoint bucket URL, который выглядит примерно так: http://www.mystaticsite77.ru.s3-website-us-east-1.amazonaws.com
Запрос бесплатного SSL сертификата через Certificate Manager
Конечно, в общем случае вопрос установки SSL сертификата для статического сайта весьма спорен. Мы в большей степени будем его использовать в целях демонстрации.
- В разделе Security, Identity & Compliance откройте секцию Certificate Manager
- Нажмите кнопку “Request a certificate” и укажите имя своего домена в *.mystaticsite77.ru и mystaticsite77.ru, а затем нажмите кнопку “Review and request“.
- Подтвердите запрос сертификата и AWS попытается отправить вам электронное письмо для подтверждения запроса. Нажав на стрелку, можно отобразить список email, на которые должен быть отправлен запрос.
Это, пожалуй, самый «трудный» шаг, т.к. у вас должен быть доступ к любому из ящиков в списке. Как правило, это ящик, указанный во WHOIS домена (я использую адрес privacyguardian.org для защиты данных WHOIS). - После получения письма от AWS, нажмите на ссылку в письме для подтверждения запроса на выпуск SSL сертификата. Имейте в виду, что AWS отправит два письма (для *.mystaticsite77.ru и mystaticsite77.ru ), нужно подтвердить их оба.
Это, пожалуй, самый «трудный» шаг, т.к. у вас должен быть доступ к любому из ящиков в списке. Как правило, это ящик, указанный во WHOIS домена (я использую адрес privacyguardian.org для защиты данных WHOIS).
CloudFront – настройка CDN и привязка HTTPS
CloudFront позволит нам не только привязать к сайту бесплатный SSL-сертификат, но и позволяет использовать для доступа к сайту протокол HTTP/2, который во всех тестах показывает производительность намного выше, чем HTTP. Кроме того, большая распределенная сеть CDN CloudFront еще более увеличивает скорость доступа к нашему сайту из разных точек мира.
- В разделе Networking & Content Delivery выберите CloudFront.
- Нажмите на кнопку Create Distribution, а затем в разделе Web distribution нажмите кнопку Get Started
- Я задал такие настройки (остальные можно оставить по-умолчанию):
- В разделе Networking & Content Delivery выберите CloudFront.
Origin: длинный URL сайта, предоставляемый S3.
Viewer Protocol Policy: Redirect HTTP to HTTPS
Compress Objects Automatically: Yes
CNAMEs: www.mystaticsite77.ru
Custom SSL Certificate: выберите созданный ранее SSL сертификат.
Default Root Object: index.html
Затем нажмите Create Distribution
Примечание: По умолчанию CloudFront покажет список источников и предложит использовать S3 Bucket. Вам нужно будет сменить S3 Bucket, выбрав вместо него S3 URL (Endpoint S3 bucket). К примеру, http://www.mystaticsite77.ru.s3-website-us-east-1.amazonaws.com
Генерация данных в сети CloudFront займет довольно продолжительное время – от 30 минут до нескольких часов.
Настройка DNS в Route 53
Настала пора объединить URL сайта на S3 с нашим доменным именем mystaticsite77.ru
- В разделе Networking & Content Delivery выберите пункт Route 53 .
- В разделе Hosted zones нажмите на кнопку Create Hosted Zone
- Укажите имя своего домена, в качестве типа зоны выберите Public Hosted Zone и нажмите кнопку Create
- Затем нужно настроить сервера имен, предоставляемых AWS и обновить имена серверов имен, предоставляемых регистратором.
- Теперь пора создать ресурсные записи. Для имени www и типа записи A (A- IPv4) укажите Yes в разделе Alias, а в качестве цели записи (Alias Target), укажите адрес, сгенерированный для вас в CloudFront.
После обновления DNS (может занят до 48 часов), вы сможете открыть сайт по адресу https://www.mystaticsite77.ru, причем при обращении к HTTP адресу, пользователя автоматически перенаправляет на HTTPS адрес.
Редирект домена без WWW нвWWW
Итак, мы почти закончили, осталось озаботиться поисковой оптимизацией, чтобы поисковые системы видели только один сайт, настроив редирект с https://mystaticsite77.ru на WWW адрес https://www.mystaticsite77.ru
- Для этого создадим еще одну корзину (bucket) S3 с именем mystaticsite77.ru, также включаем для нее поддержку размещения статического сайта, однако выбираем опцию “Redirect Requests” и указываем имя первой корзины (www.mystaticsite77.ru)
- В CloudFront создадим новый пакет со следующими настройками:Origin: адрес второго сайта S3 (endpoint URL)
CNAMEs: mystaticsite77.ru
Custom SSL Certificate: выберите ваш сертификат.Нажмите кнопку “Create Distribution“ - Затем в Route 53 создадим еще одну запись для mystaticsite77.ru типа A – IPv4 с алиасом, указывающим на второй пакет CloudFront. Сохраните изменения.
Дождитесь обновления, и убедитесь, что 301 работает редирект с адреса сайта без www на www.
С помощью популярного сервиса GTmetrix.com замерим скорость загрузки сайта. Для нашего сайта на AWS рейтинг PageSpeed Score: A, YSlow Score: B, а скорость загрузки страницы 1.3 секунды, что очень неплохо.
