Help Center/ Terraform/ User Guide/ Object Storage Service (OBS)/ Configuring Static Website Hosting
Updated on 2024-08-08 GMT+08:00

Configuring Static Website Hosting

Application Scenario

OBS allows static websites to be hosted on buckets and supports index page, error page display, and page redirection. You can upload the content files of the static website to your bucket on OBS and configure a read permission to anonymous users for these files, and then configure the static website hosting mode for your bucket to host your static websites on OBS.

Procedure

  1. Create an OBS bucket and configure static website hosting.

    1. Create the main.tf file, enter the following information, and save the file:
      resource "huaweicloud_obs_bucket" "mywebsite" {
        bucket = "mywebsite"
        website {
          index_document = "index.html"
          error_document = "error.html"
        }
      }
    2. Run terraform init to initialize the environment.
    3. Run terraform plan to view resources.
    4. After you confirm that the resource information is correct, run terraform apply to start OBS bucket creation.
    5. Run terraform show to view the created OBS bucket.

  2. Configure a bucket policy to allow anonymous users to access objects in the bucket.

    Add the following information to the main.tf file:

    # Grant the Read-Only permission to anonymous users.
    resource "huaweicloud_obs_bucket_policy" "policy" {
      bucket = huaweicloud_obs_bucket.mywebsite.bucket
      policy = <<POLICY
    {
      "Statement": [
        {
          "Sid": "AddPerm",
          "Effect": "Allow",
          "Principal": {"ID": "*"},
          "Action": ["GetObject"],
          "Resource": "mywebsite/*"
        } 
      ]
    }
    POLICY
    }

  3. Upload static website files.

    1. Edit the index.html and error.html files in the current directory.
    2. Add the following information to the main.tf file and upload the files to the OBS bucket:
      # put index.html
      resource "huaweicloud_obs_bucket_object" "index" {
        bucket = huaweicloud_obs_bucket.mywebsite.bucket
        key    = "index.html"
        source = "index.html"
      }
      # put error.html
      resource "huaweicloud_obs_bucket_object" "error" {
        bucket = huaweicloud_obs_bucket.mywebsite.bucket
        key    = "error.html"
        source = "error.html"
      }
    3. Run terraform plan to view resources.
    4. After you confirm that the resource information is correct, run terraform apply to start file uploading.

  4. Verify the configuration.

    Use a browser to access https://mywebsite.obs-website.cn-north-4.myhuaweicloud.com, that is, to access index.html. mywebsite indicates the OBS bucket name, and cn-north-4 indicates the region to which the bucket belongs.

Table 1 Parameter description

Resource Name

Parameter

Description

huaweicloud_obs_bucket

bucket

(Mandatory) OBS bucket name.

An OBS bucket name:

  • Must be globally unique in OBS.
  • Contains 3 to 63 characters, including lowercase letters, digits, hyphens (-), and periods (.).
  • Cannot start or end with a period (.) or hyphen (-).
  • Cannot contain two consecutive periods (.) or adjacent periods and hyphens (.- or -.).
  • Cannot be an IP address.

website

index_document

(Mandatory) The index page that is returned when you access a static website, that is, the homepage.

error_document

(Optional) The 404 error page that is returned when an incorrect static website path is accessed.

routing_rules

(Optional) Rule for redirecting the static website.

huaweicloud_obs_bucket_policy

bucket

(Mandatory) Bucket name.

policy_format

(Optional) Policy format. The value can be obs or s3. The default value is obs.

policy

(Mandatory) Policy content. For details, see Policy Format.

huaweicloud_obs_bucket_object

bucket

(Mandatory) Bucket name.

key

(Mandatory) Object name.

source

(Optional) Path to the source file of the object.

Follow-up Operation

You can bind a user-defined domain name to the access domain name of an OBS bucket so that you can access files stored in OBS through the user-defined domain name. With the domain name management of OBS, you can also use CDN for service acceleration. For details, see Using a User-Defined Domain Name to Host a Static Website.