Статический сайт на AWS с редиректом http→https, www.site→site

5f97dccb92647f808b434bca03a7cad4

Задача

Есть AWS аккаунт, на котором требуется поднять статический сайт (html, js, css, png, jpg) на своём домене example.com.

Ссылки: http://example.com, http://www.example.com, https://www.example.com должны перенаправлять на основной сайт https://example.com.

План действий

  • Покупка домена

  • Выпуск SSL сертификата

  • Заливка файлов html, js, css в S3.

  • Создание двух CloudFront distributions (основного и для редиректа с www)

  • Привязка CloudFront функции редиректа к CloudFront distribution

  • Создание A-записей в DNS

Покупка домена

Route 53 → Registered domains → Register domains
Ищем нужный домен example.com, оплачиваем. Домен появляется в списке Registered domains.
В разделе Route 53 → Hosted zones будет создана hosted zone для выбранного домена example.com с DNS записями NS и SOA.

Выпуск SSL сертификата

Выпускаем Amazon issued SSL certificate для двух доменов: example.com и www.example.com.
AWS Certificate Manager → Certificates → Request certificate
Request a public certificate, Next.
Fully qualified domain name: example.com
Нажать Add another name to this certificate. Добавить www.example.com
Validation method: DNS validation — recommended
Нажать Request.
View certificate. Нажать Create records in Route 53.
В течение нескольких минут статус сертификата поменяется на Issued. Он будет автоматически перевыпускаться до истечения срока действия (год).

Заливка файлов в S3

S3 → Create bucket.
Bucket name: example-com (точки меняем на дефис)
AWS Region: любой по желанию.
Включить Block all public access. (Публичный доступ к файлам в S3 крайне не рекомендуется, AWS предоставляет другие способы доступа)
Нажать Create bucket.
В корень бакета заливаем файл index.html и другие статические файлы любым удобным способом (перетаскиванием или AWS CLI, если файлов много или сложная структура папок) с настройками по умолчанию.

CloudFront distribution для example.com

CloudFront → Distributions → Create distribution
Origin domain: выбрать из списка example-com.s3.amazonaws.com (это S3 бакет, созданный на предыдущем шаге).
Origin access: Origin access control settings (recommended)
Нажать Create control setting. Нажать Create. Выбрать его из списка.
Появится предупреждение: You must update the S3 bucket policy
Viewer protocol policy: Redirect HTTP to HTTPS (для редиректа http://example.com → https://example.com)
Отметить Do not enable security protections
Price class: выбрать нужный по балансу цена/время отклика.
Alternate domain name (CNAME) → Add item → example.com
Custom SSL certificate: Выбрать SSL сертификат из списка.
Default root object: index.html
Нажать Create distribution.

CloudFront функция для редиректа www.example.com → example.com

CloudFront Functions появились в 2021 г. как более простая и дешёвая замена Lambda@Edge функций для программной модификации HTTP ответов и заголовков. Эта функция будет использована во вспомогательном CloudFront distribution (www.example.com) на следующем шаге. Когда бразер запрашивает страницу из distribution, к которому привязана эта функция, она мгновенно, без доступа к файлам в S3, вернёт HTTP ответ с кодом 301 (Permanently Moved) и новым URL, https://example.com.

CloudFront → Functions → Create function
Name: Redirect-www-example-com
Description: Redirect www.example.com to https://example.com
Нажать Create function.
На вкладке Development заменить код функции на такой, изменив значение ключа location на свой домен:

function handler(event) {
    // NOTE: This example function is for a viewer request event trigger. 
    // Choose viewer request for event trigger when you associate this function with a distribution. 
    var response = {
        statusCode: 301,
        statusDescription: 'Moved Permanently',
        headers: {
            'cloudfront-functions': { value: 'generated-by-CloudFront-Functions' },
            'location': { value: 'https://example.com' }
        }
    };
    return response;
}

Нажать Save changes. Вкладка Publish → кнопка Publish function.

CloudFront distribution для редиректа www.example.com → example.com

CloudFront → Distributions → Create distribution
Origin domain: выбрать из списка example-com.s3.amazonaws.com (выбранное значение не важно, т.к. будет настроен редирект).
Origin access: Origin access control settings (recommended)
Origin access control: выбрать ранее созданный.
Viewer protocol policy: HTTP and HTTPS
В разделе Function associations, в строке Viewer request выбрать CloudFront Functions, выбрать Redirect-www-example-com (функция, созданная на предыдущем шаге)
Отметить Do not enable security protections
Price class: выбрать нужный по балансу цена/время отклика.
Alternate domain name (CNAME) → Add item → www.example.com
Custom SSL certificate: Выбрать тот же SSL сертификат из списка.
Default root object: оставить пустым (не имеет значения).
Нажать Create distribution.
После создания distribution скопировать в буфер текст policy для S3.
Текст policy вставить в S3 → example-com → Permissions → Bucket policy.

Создание A-записи для example.com

Route 53 → Hosted zones → example.com
Create record.
Record name: example.com (поле ввода subdomain — пустое)
Record type: A.
Alias: Yes.
Route traffic to: Alias to CloudFront distribution.
Choose distribution: example.com (*.cloudfront.net).
Нажать Create records.

Создание A-записи для www.example.com

Route 53 → Hosted zones → example.com
Create record.
Record name: www.example.com (в поле ввода subdomain вписать www)
Record type: A.
Alias: Yes.
Route traffic to: Alias to CloudFront distribution.
Choose distribution: www.example.com (*.cloudfront.net).
Нажать Create records.
Обычно записи активируются в течение пары минут.

Результат

Сайт работает по главной ссылке https://example.com.
CloudFront обеспечивает быструю загрузку файлов сайта при любой нагрузке. Обслуживание не требуется.
Ссылки http://www.example.com, https://www.example.com, http://example.com перенаправляют (HTTP code 301) на основной сайт https://example.com.
Обратное перенаправление (example.com → www.example.com) при необходимости делается похожим образом.

Такой способ хостинга отлично работает для небольших сайтов с невысокой нагрузкой. При наличии тяжёлой графики и высокой частоты запросов итоговая цена может оказаться высоковата и стоит задуматься об альтернативах.

© Habrahabr.ru