--- title: 'Разместить статический веб-сайт' sidebar_label: 'Разместить статический веб-сайт' description: 'Как разместить в бакете статический веб-сайт и настроить страницу ошибки' sidebar_position: 8 --- import Formbricks from '@theme/MDXComponents/Formbricks' # Разместить статический веб-сайт В публичном бакете S3 вы можете: * [разместить статический веб-сайт](#configure-website) для быстрого доступа к файлам и снижения расходов на хранение; * [настроить страницу ошибки](#configure-error-page). Если пользователь запросит несуществующий объект, запрос будет обрабатываться в соответствии с настройками: будет возвращаться другой объект или происходить переадресация на внешний URL. ## Разместить статический веб-сайт \{#configure-website} Статические сайты состоят из набора файлов (HTML, JS, графики, шрифтов), которые можно хранить в виде объектов в бакете. Сайт будет открываться по адресу [публичного домена бакета](/s3/manage/domains.mdx#bucket-public-domain) или [пользовательского домена](/s3/manage/domains.mdx#user-domain), если он добавлен к бакету. Есть два способа размещения веб-сайта: * [хостинг](#configure-hosting) — вы указываете главную страницу веб-сайта, которая хранится в виде объекта в публичном бакете; * [веб-листинг](#configure-weblisting) — вместо отображения главной страницы вы включаете возвращение списка объектов в бакете и задаете свои CSS-стили. ### Настроить хостинг \{#configure-hosting} 1. В бакет [загрузите объект](/s3/objects/upload-object.mdx) — HTML-файл, который будет главной страницей. 2. В [панели управления](https://my.selectel.ru/storage/) в верхнем меню нажмите **Продукты** и выберите **S3**. 3. Перейдите в раздел **Бакеты**. 4. Откройте страницу бакета → вкладка **Веб-сайт**. 5. В блоке **Веб-сайт** включите тумблер. 6. Откройте вкладку **Хостинг**. 7. Введите [путь до объекта](#path-to-object) с главной страницей с расширением `.html`. 8. Нажмите **Сохранить**. ### Настроить веб-листинг \{#configure-weblisting} 1. Если вы хотите хранить файл с CSS-стилями в бакете, [загрузите его](/s3/objects/upload-object.mdx). 2. В [панели управления](https://my.selectel.ru/storage/) в верхнем меню нажмите **Продукты** и выберите **S3**. 3. Перейдите в раздел **Бакеты**. 4. Откройте страницу бакета → вкладка **Веб-сайт**. 5. В блоке **Веб-сайт** включите тумблер. 6. Откройте вкладку **Веб-листинг**. 7. Введите адрес файла с CSS-стилями. Формат адреса зависит от того, где хранится файл: * в бакете — введите [путь до объекта](#path-to-object) с CSS-стилями; * на стороннем ресурсе — введите URL-адрес файла с CSS-стилями. 8. Нажмите **Сохранить**. ## Настроить страницу ошибки \{#configure-error-page} Если пользователи будут обращаться к несуществующему объекту, возникнет ошибка, которую можно обрабатывать двумя способами: * [возвращать другой объект из бакета](#return-object); * [выполнять переадресацию запроса на внешний URL](#redirect). ### Возвращать объект из бакета \{#return-object} 1. В [панели управления](https://my.selectel.ru/storage/) в верхнем меню нажмите **Продукты** и выберите **S3**. 2. Перейдите в раздел **Бакеты**. 3. Откройте страницу бакета → вкладка **Веб-сайт**. 4. В блоке **Страница ошибки** включите тумблер. 5. Опционально: если вы хотите, чтобы объект возвращался с кодом 200, выберите его в качестве кода ответа. По умолчанию ответ на запрос будет с кодом 400. 6. В поле **Ресурс** введите [путь до объекта](#path-to-object) со страницей ошибки с расширением `.html`. 7. Нажмите **Сохранить**. ### Выполнять переадресацию запроса \{#redirect} 1. В [панели управления](https://my.selectel.ru/storage/) в верхнем меню нажмите **Продукты** и выберите **S3**. 2. Перейдите в раздел **Бакеты**. 3. Откройте страницу бакета → вкладка **Веб-сайт**. 4. В блоке **Страница ошибки** включите тумблер. 5. Выберите код ответа 307. 6. В поле **Ресурс** введите валидный внешний URL, на который будет выполнена переадресация, если запрашиваемый объект отсутствует. 7. Нажмите **Сохранить**. ## Пути до объектов \{#path-to-object} При [размещении статического веб-сайта](#configure-website) или [настройке страницы ошибки](#configure-error-page) потребуется ввести путь до объекта в бакете — абсолютный или относительный. ### Абсолютный путь \{#absolute-path} Абсолютный путь всегда начинается с символа `/` и указывается в формате `//`, где: * `` — [префикс](/s3/objects/manage-folder.mdx) (путь до объекта) — при наличии; * `` — имя объекта с расширением. Если указан абсолютный путь, при запросе объекта логика хранилища будет всегда искать его относительно корня бакета — по адресу `.selstorage.ru/`. Если в запросе после имени бакета есть префикс, он будет проигнорирован. Если указать некорректный путь, объект не будет возвращен. :::note Например, если полный адрес объекта `.selstorage.ru/bucket/prefix/file.html`, в качестве пути вы указали `/prefix/file.html` и запрос выполняется по адресу `.selstorage.ru/bucket/prefix/`, объект будет возвращен. ::: ### Относительный путь \{#relative-path} Относительный путь никогда не начинается с символа `/` и указывается в формате `/` или ``, где: * `/` — опционально: [префикс](/s3/objects/manage-folder.mdx) (путь до объекта); * `` — имя объекта с расширением. Если указан относительный путь, при запросе объекта логика хранилища будет искать его с учетом префикса, указанного в запросе к бакету. :::note Например, если полный адрес объекта `.selstorage.ru/bucket/prefix/file.html`, в качестве пути вы указали `file.html` и запрос выполняется по адресу `.selstorage.ru/bucket/prefix/`, объект будет возвращен. ::: :::note Например, если полный адрес объекта `.selstorage.ru/bucket/prefix/file.html`, в качестве пути вы указали `prefix/file.html` и запрос выполняется по адресу `.selstorage.ru/bucket/prefix/`, объект не будет возвращен, потому что логика хранилища будет искать объект по несуществующему адресу `.selstorage.ru/bucket/prefix/prefix/file.html`. :::