Skip to main content

Host a static website

Last update:

In the S3 public baquette you can:

  • host a static Web site for quick access to files and reduced storage costs;
  • customize error page. If the user requests a non-existent object, the request will be processed according to the settings: another object will be returned or a redirect to an external URL will take place.

Host a static website

Static sites consist of a set of files (HTML, JS, graphics, fonts) that can be stored as objects in a bucket. The site will open at the address of the public domain of the bucket or a custom domain if added to the bucket.

There are two ways to host a website:

  • hosting — you specify the home page of a website, which is stored as an object in a public backend;
  • web listing — Instead of displaying the main page, you enable the return of the list of objects in the bucket and set your CSS styles.

Set up hosting

  1. In the bucket , load an object — an HTML file, which will be the main page.
  2. In the control panel, on the top menu, click Products and select S3.
  3. Go to the Buckets section.
  4. Open the baket page → Website tab.
  5. In the Website block, turn on the toggle switch.
  6. Open the Hosting tab.
  7. Enter the path to the homepage object with a .html extension.
  8. Click Save.

Customize web listing

  1. If you want to keep the CSS styles file in the baket, upload it.

  2. In the control panel, on the top menu, click Products and select S3.

  3. Go to the Buckets section.

  4. Open the baket page → Website tab.

  5. In the Website block, turn on the toggle switch.

  6. Open the Web Listing tab.

  7. Enter the address of the CSS styles file. The format of the address depends on where the file is stored:

    • in baket — enter the path to the object with CSS styles;
    • on a third-party resource — enter the URL of the file with CSS styles.

  8. Click Save.

Customize the error page

If users access a non-existent object, an error will occur, which can be handled in two ways:

Return an object from the tank

  1. In the control panel, on the top menu, click Products and select S3.
  2. Go to the Buckets section.
  3. Open the baket page → Website tab.
  4. In the Error Page block, turn on the toggle switch.
  5. Optional: If you want the object to return with code 200, select it as the response code. By default, the response to the request will be code 400.
  6. In the Resource field, enter the path to the object with the error page with the .html extension.
  7. Click Save.

Perform request forwarding

  1. In the control panel, on the top menu, click Products and select S3.
  2. Go to the Buckets section.
  3. Open the baket page → Website tab.
  4. In the Error Page block, turn on the toggle switch.
  5. Select answer code 307.
  6. In the Resource field, enter a valid external URL to which to redirect if the requested object does not exist.
  7. Click Save.

Paths to facilities

When hosting a static website or customizing an error page, you will need to enter the path to the object in the bucket — absolute or relative.

The Absolute Way

The absolute path always starts with a / character and is specified in the format /<prefix>/<object_name>, where:

  • <prefix> — prefix (path to the object) — if available;
  • <object_name> — name of the object with the extension.

If an absolute path is specified, when querying an object, the storage logic will always search for it relative to the root of the bucket — at <uuid>.selstorage.ru/<bucket_name>. If there is a prefix after the bucket name in the query, it will be ignored.

If you specify an invalid path, the object will not be returned.

note

For example, if the full address of the object is<uuid>.selstorage.ru/bucket/prefix/file.html, you specify /prefix/file.html as the path, and the request is executed at <uuid>.selstorage.ru/bucket/prefix/, the object will be returned.

Relative path

A relative path never starts with a / character and is specified in the format <prefix>/<object_name> or <object_name>, where:

  • <prefix>/ — optional: prefix (path to the object);
  • <object_name> — name of the object with the extension.

If a relative path is specified, when requesting an object, the storage logic will search for it with the prefix specified in the bucket request.

note

For example, if the full address of the object is<uuid>.selstorage.ru/bucket/prefix/file.html, you specify file.html as the path, and the query is executed at <uuid>.selstorage.ru/bucket/prefix/, the object will be returned.

note

For example, if the full address of the object is<uuid>.selstorage.ru/bucket/prefix/file.html, you specify prefix/file.html as the path, and the query is performed at <uuid>.selstorage.ru/bucket/prefix/, the object will not be returned because the storage logic will search for the object at the non-existent address <uuid>.selstorage.ru/bucket/prefix/prefix/file.html.