Статический веб-сайт в Yandex Object Storage

С помощью этой инструкции вы научитесь загружать статические HTML-файлы вашего веб-сайта в хранилище Yandex Object Storage и привязать доменное имя к бакету, в котором будут храниться файлы.

Чтобы разместить статический веб-сайт в Object Storage:

1. Подготовьте облако к работе.
2. Создайте бакет с публичным доступом.
3. Настройте главную веб-страницу сайта и страницу ошибки.
4. Настройте использование собственного домена.
5. Загрузите файлы сайта.
6. Проверьте работу сайта.

Если сайт вам больше не нужен, удалите его файлы из хранилища.

Подготовьте облако к работе

Перед использованием Yandex Object Storage нужно зарегистрироваться в Облаке и создать платежный аккаунт:

1. Перейдите в консоль управления, затем войдите в Яндекс.Облако или зарегистрируйтесь, если вы еще не зарегистрированы.
2. На странице биллинга убедитесь, что у вас подключен платежный аккаунт, и он находится в статусе ACTIVE или TRIAL_ACTIVE. Если платежного аккаунта нет, создайте его.

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

Необходимые платные ресурсы

В стоимость поддержки статического сайта входит:

• плата за хранение данных статического сайта (см. тарифы Yandex Object Storage);
• плата за операции с данными (см. тарифы Yandex Object Storage);
• стоимость исходящего трафика из Облака в интернет (см. тарифы Yandex Object Storage).

Создайте публичный бакет

Чтобы создать бакет для файлов статического сайта:

1. Перейдите в консоль управления Яндекс.Облака и выберите каталог, в котором будете выполнять операции.

2. На странице каталога нажмите кнопку Создать ресурс и выберите Бакет.

3. В поле Имя введите имя бакета, например, www.example.com. Имя бакета будет использоваться в доменном имени сайта: https://www.example.com.website.yandexcloud.net.

   Имя должно удовлетворять требованиям:

   • Длина имени должна быть от 3 до 63 символов.
   • Имя может содержать строчные буквы латинского алфавита, цифры, дефисы и точки.
   • Первый и последний символы должны быть буквами или цифрами.
   • Символы справа и слева от точки должны быть буквами или цифрами.
   • Имя не должно иметь вид IP-адреса (например 10.1.3.9).

   Примечание

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

4. Укажите максимальный размер бакета в ГБ.

5. Выберите Публичный доступ к бакету.

6. Нажмите кнопку Создать бакет.

Настройте главную страницу сайта и страницу ошибки

Необходимо загрузить и настроить индексную страницу и страницу ошибки. Для этого:

1. Создайте на компьютере файлы:
   • index.html с текстом Hello world!. Содержимое файла будет показываться при обращении к главной странице веб-сайта.
   • error.html с текстом Error!. Содержимое файла будет показываться при ответах веб-сайта с ошибками 4хх.
2. На вкладке Объекты на странице вашего бакета нажмите кнопку Загрузить. В открывшемся окне выберите созданные файлы и нажмите кнопку подтверждения.
3. Нажмите кнопку Загрузить.
4. Откройте вкладку Веб-сайт на странице вашего бакета.
5. Выберите Хостинг.
6. В поле Главная страница укажите index.html.
7. В поле Страница ошибки укажите error.html.
8. Нажмите кнопку Сохранить.
9. Проверьте, что главная страница веб-сайта открывается. Для этого подключитесь к сайту через браузер по ссылке вида https://{имя-бакета}.website.yandexcloud.net.
10. Проверьте, что страница ошибки открывается. Для этого подключитесь к сайту через браузер по ссылке вида https://{имя-бакета}.website.yandexcloud.net/error-check.

Настройте использование собственного домена

Чтобы использовать для веб-сайта собственный домен:

• Проверьте, что имя бакета в точности совпадает с именем домена. Домен должен быть третьего и более уровня, например, www.example.com.
• Создайте запись типа CNAME (Canonical Name — каноническое имя) у своего провайдера DNS или на собственном DNS-сервере.

В инструкции ниже описана настройка внешнего DNS-сервиса на примере reg.ru для доменных имен www.example.com.website.yandexcloud.net и www.example.com:

1. На вкладке Веб-сайт на странице бакета в консоли управления найдите адрес сайта.
2. Войдите в панель управления внешнего DNS-сервиса. Перейдите в список ваших доменов и нажмите на имя нужного домена.
3. Перейдите по ссылке Управление зоной в блоке Управление доменом.
4. Создайте CNAME-запись со значениями полей:
   • Subdomain — www.
   • Canonical name — адрес сайта с точкой на конце, например, www.example.com.website.yandexcloud.net..
5. Подождите 15-20 минут, пока изменения DNS-записей вводятся в действие. Время ожидания может отличаться для вашего DNS-сервиса.

Загрузите файлы веб-сайта

После настройки и проверки доступности сайта загрузите в бакет остальные файлы, необходимые для работы сайта. Используйте для этого консоль управления, API или один из доступных инструментов для работы с Object Storage.

Проверьте работу сайта

Чтобы проверить работу сайта, откройте в браузере адрес

http://www.example.com.website.yandexcloud.net`

Как удалить созданные ресурсы

Чтобы перестать платить за хранение файлов, удалите загруженные файлы.