Минулої ночі я трохи більше попрацював над деплоєм мого сайту-проекту http://www.practiceinterviews.tech/, який раніше був розміщений на Heroku, а потім вирішив купити домен і розмістити його для публічного використання та зручності.
Після дослідження в Інтернеті надійних постачальників DNS я натрапив на два сайти, які отримали хороші відгуки про підтримку клієнтів і додаткові послуги. Один з них — GoDaddy, а інший — Hostinger.com. Я вибрав hostinger.com, завдяки їхнім хорошим відгукам та потужним послугам, а також через зручний у використанні інтерфейс.
Покроковий посібник з деплою
Крок 1: Купити новий домен на www.hostinger.com
Перейдіть на hostinger.com і натисніть на "get a new domain"
Пошукайте бажане ім’я домену, і система надасть вам інші варіанти, якщо ваше ім’я вже зайняте.
Наприклад, я шукав ім’я ‘iamjohndoe’, але воно було зайняте, тому система запропонувала кілька інших варіантів разом з їхніми цінами в INR.
Після того як ви вибрали ім’я вашого домену, наприклад, в моєму випадку practiceinterviews.tech, вам потрібно зробити кілька кроків, щоб почати.
Технічно, потрібно переконатися, що записи DNS для www та @ вказують на CNAME запис вашого додатку на Heroku.
Зв’яжіться зі службою підтримки Hostinger і повідомте їм, що потрібно направити DNS на ваш Heroku DNS. Через обмеження прямого мапінгу на обох платформах це має бути зроблено з бекенду.
Надайте їм рішення з StackOverflow, і вони зможуть це налаштувати.
https://stackoverflow.com/questions/60720244/cant-point-hostinger-custom-domain-to-herokuapp
Після цього ви зможете побачити ваш сайт на новому домені.
Крок 2: Додайте новий домен до вкладки Access на Heroku, як показано нижче
- Клацніть на "Add domain".
- Додайте нове ім’я домену.
- Це згенерує новий DNS Target. Скопіюйте цей target і вставте його на DNS Hostinger як CNAME тип.
Зробіть це на Hostinger
Додано CNAME тип з Heroku
Зробіть це на Heroku
Вкладка Heroku Access — Додати домени з CN
Крок 3: Генерація SSL для вашого сайту, якщо ви ще цього не зробили, за допомогою ZeroSSL:
Крок 1 — Зареєструйтесь на sslforfree.com
Перейдіть на сайт sslforfree.com, введіть вашу URL адресу сайту та натисніть Create Free SSL Certificate:
Після цього зареєструйтесь.
Крок 2 — Генерація сертифікату
Перевірте ще раз ім’я домену і натисніть Next:
Виберіть 90-Day Certificate (варіант на 1 рік платний) і виберіть безкоштовний план на останньому етапі.
Коли сертифікат успішно згенеровано, ви отримаєте таке повідомлення:
Примітка: майте на увазі, що безкоштовний план пропонує лише 3 сертифікати на 90 днів.
Крок 3 — Підтвердження права власності на домен
Є 3 варіанти, як ви можете підтвердити право власності на ваш домен — ми настійно рекомендуємо метод HTTP File Upload, оскільки це найшвидший варіант.
Для цього методу завантажте запитуваний файл, потім відкрийте Hosting → Manage → File Manager вашого домену.
У public_html створіть папку .well-known (не забудьте крапку на початку), а в ній ще одну папку pki-validation:
Завантажте файл, який ви завантажили раніше, за допомогою перетягування або кнопки Upload Files:
Ваш результат повинен виглядати ось так:
Найважливіше — тепер перейдіть за наданим посиланням:
Ви повинні змогти відкрити файл за цією адресою — тепер натискайте Next.
Після цього відкрийте ваш hPanel, Hosting → Manage → DNS Zone Editor, і введіть sectigo в поле пошуку.
Перейдіть на hostinger.com і натисніть на DNS Nameservers в лівій панелі, і ви побачите список DNS записів, які були додані автоматично.
Спочатку видаліть всі записи типу: CAA
Їх буде досить багато, тому найкраще буде видалити всі записи CAA, вони нам не знадобляться в цьому налаштуванні з Heroku.
Після того як ви видалите всі записи CAA, додайте новий запис CAA до списку
Зачекайте кілька хвилин і поверніться на сторінку перевірки сертифікату. Натискайте Verify.
Завантажте та встановіть ваш SSL сертифікат
Виберіть тип за замовчуванням і завантажте архів з вашим сертифікатом:
Ви побачите 3 файли:
- private.key;
- certificate.crt;
- ca_bundle.crt.
Відкрийте Hosting → Manage → SSL:
Частина з налаштування SSL: подяка команді Hostinger
Перекладено з: Deploy Heroku app in production with Hostinger + ZeroSSL