В конце лета нам пришло сообщение от Google о том, что в Chrome будут появляться предупреждения о возможной опасности при переходе на наш сайт «Я люблю ИП». Это касалось страниц, где есть текстовые формы (<input type="text"> или <input type="email">). Изменения должны были вступить в силу с октября, и мы решили, что наконец пора осуществить переезд на HTTPS, который мы планировали уже давно.


В сети много инструкций о том, как переехать на HTTPS, поэтому я постараюсь их не повторять и расскажу, как получить бесплатный SSL-сертификат от Amazon и установить его на сайте. Весь процесс у нас занял не более двух часов. Но я надеюсь, с этой инструкцией у вас получится сделать всё ещё быстрее.


Итак, вот краткое содержание статьи:


1) Подготовка сайта к переезду
2) Бесплатный SSL-сертификат от Amazon
3) Установка сертификата
4) Настройка домена
5) Редирект для домена на HTTPS без www
6) Рекомендации по SEO


Статья предполагает, что у вас уже есть статичный сайт на Amazon S3. Если ещё нет, то вы можете воспользоваться этой инструкцией от Amazon (на английском).


Подготовка сайта к переезду


Самая трудозатратная часть, по описанию во многих статьях, это подготовка сайта к переезду. Её смысл заключается в том, чтобы изменить абсолютные ссылки на относительные. Это касается внутренних ссылок сайта, картинок и внешних файлов.


Для внутренних ссылок мы использовали относительные ссылки без домена, например, /kb/insurance-deductions/. Для внешних ресурсов — относительные ссылки без протокола, например, <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js">.


После проверки ссылок можно переходить к установке сертификата.


Бесплатный SSL-сертификат от Amazon


Существует несколько видов SSL-сертификатов:


  • проверка домена (Domain Validation — DV),
  • проверка организации (Organization Validation — OV),
  • расширенная проверка (Extended Validation — EV).

Также SSL-сертификаты отличаются по функциональности. Они могут быть выпущены только на сам домен (обычные сертификаты), на домен и все поддомены (Wildcard сертификаты) или на несколько доменов на одном сервере (SAN или Multi Domain сертификаты).


Если вы не банк и не интернет-магазин, то вам подойдёт обычный SSL-сертификат с проверкой домена (DV).


Amazon предоставляет бесплатные сертификаты уровня Domain Validation сроком на 13 месяцев. Обновление сертификатов происходит автоматически. Сертификат можно использовать для поддоменов и других доменов (но не более 10). На один аккаунт можно выпустить не более 100 сертификатов.


Процес выпуска сертификата довольно простой.


Первое, что нужно сделать, это завести на домене почту:


  • administrator@domain.ru
  • webmaster@domain.ru
  • hostmaster@domain.ru
  • postmaster@domain.ru
  • admin@domain.ru

Далее зайти в раздел Certificate Manager в консоли AWS и нажать кнопку Request a Certificate.



На следующем шаге указать имя домена (или нескольких доменов). Для поддоменов, а также домена с www, можно использовать звёздочку *.domain.ru. Чтобы сертификат покрывал домен с www и без, нужно указать оба домена.



Нажать Review and request и затем Confirm.


Для подтверждения домена нужно перейти по ссылке в письме от Amazon, которое придёт на один из адресов, указанных выше. (Если доменов несколько, то нужно подтвердить каждый домен.)


Установка сертификата


Для установки сертификата необходимо создать CloudFront distribution.


Наш сайт работает на Jekyll, и для его отправки на S3 мы используем gem s3_website. Чтобы добавить с его помощью поддержку CloudFront достаточно ввести в командной строке s3_website cfg apply, и на вопрос, хотите ли вы подключить CloudFront, ответить да.


Если вы будете создавать CloudFront distribution вручную, то имейте в виду, что в качестве Origin Domain Name нужно указать не корзину (S3 bucket), где находится сайт, а конечный URL (Endpoint) корзины без http://. Его можно найти в разделе Properties > Static website hosting.


В настройках CloudFront distribution в разделе General укажите Custom SSL Certificate и выберите ваш сертификат. В поле CNAME укажите ваш домен с www, остальные настройки оставьте по умолчанию.



Развёртывание CloudFront distribution займёт некоторые время. Если всё было сделано правильно, то ваш сайт будет доступен по адресу на cloudfront.net. Проверить это можно с помощью команды cURL:


$ curl -I -H 'Host: www.iloveip.ru' https://df7vbe7u5dhq3.cloudfront.net
HTTP/1.1 200 OK
Content-Type: text/html; charset=utf-8
Content-Length: 10784
Connection: keep-alive
Date: Sat, 07 Oct 2017 08:44:03 GMT
Cache-Control: no-cache, no-store
Content-Encoding: gzip
Last-Modified: Sat, 07 Oct 2017 08:33:04 GMT
ETag: "53b8ab65638f649f57c3cb0802754d5a"
Server: AmazonS3
X-Cache: Miss from cloudfront
Via: 1.1 b94d547106622a98842a2c4a2d0cbf2b.cloudfront.net (CloudFront)
X-Amz-Cf-Id: 4qQ_fAFAA4TJji9DlVQwNrCZpfqi8fefW4SZdCgTbdFecvw8Kwm_3Q==

Настройка домена


Чтобы сайт с HTTPS открывался на вашем домене, для него нужно добавить новую запись в Route 53. Нажмите Create Record Set, в поле Name укажите www, выберите Type A (A — IPv4 address) и в поле Alias нажмите Yes. Далее в поле Alias Target выберите CloudFront distribution и нажмите Create.



Если всё верно, то сайт станет доступен на вашем домене.


$ curl -I https://www.iloveip.ru
HTTP/1.1 200 OK
Content-Type: text/html; charset=utf-8
Content-Length: 10784
Connection: keep-alive
Date: Sat, 07 Oct 2017 08:44:03 GMT
Cache-Control: no-cache, no-store
Content-Encoding: gzip
Last-Modified: Sat, 07 Oct 2017 08:33:04 GMT
ETag: "53b8ab65638f649f57c3cb0802754d5a"
Server: AmazonS3
Age: 963
X-Cache: Hit from cloudfront
Via: 1.1 1b8e55abce35b88e0cbce7d177d84d20.cloudfront.net (CloudFront)
X-Amz-Cf-Id: UZO3W6qiJWlcSJcEVBYkFnixuU_GIBQbUQNHG9EULEr78hTtzV_k3Q==

Редирект для домена на HTTPS без www


Чтобы установить редирект с домена на HTTPS без www на домен с www, нужно создать новую корзину S3, CloudFront distribution и запись в Route 53. Но их настройки будут немного отличаться.


В разделе S3 создайте новую корзину и укажите в качестве имени ваш домен без www.



Перейдите в корзину, в разделе Properties > Static website hosting выберите Redirect requests, в поле Target bucket or domain укажите домен с www, в поле Protocol — https.



Скопируйте Endpoint, он понадобится для создания CloudFront distribution.


В CloudFront нажмите Create Distribution> Web > Get Started. В качестве Origin Domain Name укажите URL корзины, который вы скопировали на предыдущем шаге, без http://.


В поле Cache Based on Selected Request Headers и Forward Cookies выберите All, в поле Query String Forwarding and Caching выберите Forward all, cache based on all. (Я не совсем понимаю, что означают эти настройки, но без них настроить редирект не получалось.)



Далее в поле CNAME укажите ваш домен без www, выберите Custom SSL Certificate и ваш сертификат. Остальные настройки оставьте по умолчанию.



Если всё верно, то сайт без www на cloudfront.net будет отдавать статус 301 Moved Permanently.


$ curl -I -H 'Host: iloveip.ru' https://d21b1cny7kphd.cloudfront.net
HTTP/1.1 301 Moved Permanently
Content-Length: 0
Connection: keep-alive
Date: Sun, 08 Oct 2017 13:08:57 GMT
Location: https://www.iloveip.ru/
Server: AmazonS3
X-Cache: Miss from cloudfront
Via: 1.1 f2a927b7000cd52484f674ad25ccd8ff.cloudfront.net (CloudFront)
X-Amz-Cf-Id: gbGS646vty5zzTX7tmhOhBt7tFXfZ2FpQIFvVgFb3PukkIF8ducA0g==

Теперь осталось настроить домен. Для этого нужно добавить ещё одну запись в Route 53. Нажмите Create Record Set, поле Name оставьте пустым, выберите Type A (A — IPv4 address) и в поле Alias нажмите Yes. Далее в поле Alias Target выберите CloudFront distribution и нажмите Create.



Проверяем.


$ curl -I https://iloveip.ru
HTTP/1.1 301 Moved Permanently
Content-Length: 0
Connection: keep-alive
Date: Sun, 08 Oct 2017 13:15:13 GMT
Location: https://www.iloveip.ru/
Server: AmazonS3
X-Cache: Miss from cloudfront
Via: 1.1 11a727876922c83c000e3ada668fa181.cloudfront.net (CloudFront)
X-Amz-Cf-Id: k9zlvicvxcxh3peyaXxn-KHlwNYPwwZwV4F_wfOclXxK9WnDoY6pCw==

Рекомендации по SEO


Вы наверное заметили, что в настройках CloudFront в поле Viewer Protocol Policy мы оставляли значение по умолчанию: HTTP and HTTPS. Это означает, что сайт будет доступен по обоим протоколам. Это необходимо до тех пор, пока не произойдёт склейка зеркал в Яндексе.


Что ещё нужно сделать по SEO в связи с переездом на HTTPS?


  1. Обновить файл robots.txt. Добавить https в директиве Host и в адресе Sitemap.


    User-agent: *
    Sitemap: https://www.iloveip.ru/sitemap.xml


    User-agent: Yandex
    Host: https://www.iloveip.ru
    Sitemap: https://www.iloveip.ru/sitemap.xml


  2. Обновить все ссылки в карте сайта. Как я уже говорила, наш сайт работает на Jekyll. Для генерации карты сайта мы используем плагин jekyll-seo-tag. Чтобы обновить все ссылки в карте сайта, достаточно указать URL с HTTPS в файле _config.yml:


    title: Я люблю ИП
    description: Всё для самостоятельной регистрации ИП и ведения бизнеса
    url: https://www.iloveip.ru


  3. Установить <link rel="canonical" href="" /> с HTTPS для всех страниц. Плагин jekyll-seo-tag сделает это автоматически, если выполнен пункт 2.
  4. Добавить сайт с HTTPS в Google Search Console. Для этого нужно добавить ресурс и подтвердить права. Для Google больше ничего делать не нужно
  5. Добавить сайт с HTTPS в Яндекс Вебмастере (аналогично пункту 4). Для Яндекса нужно выполнить ещё один пункт.
  6. Сделать переезд сайта в Яндекс Вебмастере для версии с HTTP. Для этого в разделе Индексирование > Переезд сайта поставьте галочку Добавить HTTPS.

После того, как в Яндекс Вебмастере появится сообщение о том, что у вашего сайта изменилось главное зеркало, настройте 301 редиректы с HTTP на HTTPS. Для этого в CloudFront выберите distribution для сайта с www, в разделе Behaviors в поле Viewer Protocol Policy выберите Redirect HTTP to HTTPS.



На этом всё.


Заключение


В процессе переезда мы допустили несколько ошибок. Первое, мы не сразу сообщили о новом сайте поисковикам (п. 4 и 5), а сделали это примерно на третий день. Второе, в Яндекс Вебмастере мы отметили Переезд сайта на HTTPS (п. 6) одновременно с запуском HTTPS версии сайта. Обычно рекомендуют это делать только после того, как Яндекс проиндексирует большинство страниц.


Может это было ошибкой, а может и нет, но Яндекс изменил главное зеркало для нашего сайта ровно за 6 дней и справился с этим даже быстрее, чем Google.


Как переезд на HTTPS скажется на траффике, мы узнаем потом.


Полезные ссылки:


Комментарии (10)


  1. Chugumoto
    09.10.2017 15:38
    -1

    эм… я или туплю от того что с VPS работал… на которых как бэ можно нормально автоматизировать бесплатное получение сертов от летсэнкрипта… или…


    1. iloveip Автор
      09.10.2017 15:55

      Не поняла вопрос.


      1. ambientos
        09.10.2017 19:22
        +2

        Товарищ хотел до вас донести, что переезд к какому-либо хостеру, который обещает бесплатный сертификат — нынче далеко не преимущество. Уже достаточно давно отлажен процесс получения «вечных» и бесплатных сертификатов для любого сервера от Let'sEncrypt.


        1. iloveip Автор
          09.10.2017 21:07

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


          1. ambientos
            09.10.2017 21:27
            +1

            Да я уже понял, что это чистейшей воды реклама амазона. Просто ваш заголовок на 50% состоит из того, что основное преимущество этого сервиса — бесплатный сертификат. Хотя, по сути, ничего необычного в этом нет, и бесплатные сертификаты уже давно доступны всем желающим.


            1. iloveip Автор
              09.10.2017 21:34

              Тогда попросите Amazon перечислить мне деньги за рекламу) Они ни про нас, ни про Хабр наверное и не слышали)

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


        1. BDI
          10.10.2017 09:54
          +1

          Справедливости ради стоит заметить, что в статье упоминается wildcard сертификат(если верить скриншоту), а Let'sEncrypt wildcard ещё только анонсировал на январь 2018-го. Так что кому-то может и пригодится информация из статьи.


          1. iloveip Автор
            10.10.2017 09:55

            Большое спасибо за дополнение!


  1. PQR
    10.10.2017 12:45
    +1

    Недавно занимался примерно тем же самым, только сайт не статический, поэтому не на S3, а на EC2 (на виртуалке с nginx + php).
    Решил всё сделать через Amazon и вот пара подводных камней, о которых хочу рассказать:

    1) Зарегистрировал новый домен с помощью сервиса Route 53, заплатил 11$ — пока всё ок

    2) Иду регистрировать бесплатный сертификат с помощь ACM, указал домен, далее нужно подтвердить своё право владения, перейдя по ссылке, которая отправлена на admin@domain.com, webmaster@domain.ru и т.п. Но постойте, у меня нет этих почтовых ящиков, я только лишь зарегистрировал домен в Route 53! По наивности думал, если купить домен в Amazon, то он сообразит, что у меня есть права на этот домен и сертификат выпишут в один клик. Оказалось, что не выпишут. Как завести почту? Пошел быстренько подключил яндекс.почту для домена, потом в Амазоне нажал кнопку «отправить письмо повторно», получил письмо, перешел по ссылке, сертификат выписан.

    3) Я заказал сертификат на *.domain.com чтобы покрыть всё сразу. Но оказалось *.domain.com покрывает только поддомены, но не сам domain.com — вещь достаточно известная для тех кто сталкивался, но для новичка будет не очевидно. Чтобы действительно покрыть всё, нужно выписывать сертификат сразу на две позиции: domain.com и *.domain.com с помощью кнопки «Add another name to this certificate». Кстати, скриншот в этой статье показан не удачный, там видно что добавлена всего одна позиция "*.domain.com", не забудьте добавить вторую позицию «domain.com»!
    (хотя по описанию из статьи автор на самом деле выписывал сертификат как надо на две позиции)
    image

    4) В Amazon можно получить бесплатный сертификат, но его не получится установить на nginx на своей EC2 виртуалке, они просто не отдают приватные ключи. Чтобы воспользоваться этим бесплатным сертификатом придётся купить сервис балансировщика ELB к которому можно привязать только что выписанный сертификат, и который будет терминировать HTTPS трафик, а к нашей конечной EC2 виртуалке с nginx будет приходить обычный HTTP запрос. Получается сэкономили на сертификате, но заплатили за ELB. В сколько именно мне обойдётся этот ELB я пока не разобрался.

    5) Сделать перенаправление http -> https средствами Route 53 или ELB не удастся, эту задачу придётся самому прописывать в конфиге nginx на EC2 (напомню, по условиям данной задачи мы говорим не про статический сайт на S3, а про сайт на виртуалке EC2). Фокус в том, что nginx на нашей виртуалке стоит за балансировщиком ELB и он теперь всегда получает голый http. Как в этом случает понять, по какому протоколу пришел реальный пользователь, http или https? Погуглив, обнаружил что этим вопросом задаются многие. Если трафик пришел через ELB, то мы можем проверить оригинальный протокол по специальному заголовку x-forwarded-proto:

    server {
        listen 80;
        listen [::]:80 ipv6only=on;
    
        if ($http_x_forwarded_proto = "http") {
           rewrite ^(.*)$ https://$http_host$1;
        }
    
       #...
    }
    


    6) Наконец, на бэкенде за nginx у вас работает какое-то приложение (PHP/Ruby/Python/Node/...), в коде которого может быть дополнительная логика проверяющая протокол http/https. Поместив приложение за ELB с терминацией https, мы создали видимость, что у нас все запросы приходят чисто по http. Не забудьте проверить, помешает ли это вашему конкретному приложению и умеет ли оно читать x-forwarded-proto?


    1. iloveip Автор
      10.10.2017 13:22

      Большое вам спасибо за комментарий! Действительно, сертификат выпускали на два домена, а скриншоты я делала уже потом и пропустила это. Скриншот в статье обновила, текст тоже.