:Configure static website hosting

Scenarios

In this topic, a bucket named examplebucket is used in the following example to show how to enable static website hosting for a bucket. The following structure shows the objects and directories in examplebucket:

examplebucket
 ├── index.html
 ├── error.html
 ├── example.txt
 └── subdir/
      └── index.html

The first example shows how to disable subdirectory homepage when you configure static website hosting for examplebucket. In this case, when you access the subdir/ directory of examplebucket, the default homepage object named index.html in the root directory of examplebucket is returned instead of the object named index.html in the subdir/ directory. In addition, if you access an object that does not exist in examplebucket, the specified default 404 page is returned. For more information, see Configure static website hosting and disable subdirectory homepage.

The second example shows how to enable subdirectory homepage and configure a subdirectory 404 rule when you configure static website hosting for examplebucket. In this case, when you access the subdir/ directory of examplebucket, the default homepage object named index.html in the /subdir directory of examplebucket is returned. In addition, if you access an object that does not exist in examplebucket, a result is returned based on the specified subdirectory 404 rule together with the specified default 404 page. For more information, see Configure static website hosting and enable subdirectory homepage.

Configure static website hosting and disable subdirectory homepage

1. Log on to the OSS console.
2. In the left-side navigation pane, click Buckets. On the Buckets page, click the name of the bucket on which you want to host the static website.
3. In the left-side navigation tree, choose Data Management > Static Pages.
4. In the Static Pages section, click Configure and configure the parameters. The following table describes the parameters.
   

   Parameter	Description
   Default Homepage	The default homepage that appears when you use a browser to access the static website hosted on the OSS bucket. In this example, this parameter is set to index.html.
   Subfolder Homepage	Specifies whether to enable the subdirectory homepage feature for the bucket. In this example, Disable is selected. In this case, when you access the root directory of the bucket or a subdirectory whose URL ends with a forward slash (/), the default homepage object in the root directory of the bucket is returned.
   Default 404 Page	The error page that is returned if the object that you want to access does not exist in the bucket and HTTP status code 404 is returned. Only an object in the root directory of the bucket can be specified as the default 404 page. In this example, this parameter is set to error.html.
   Error Page Status Code	The HTTP status code that is returned with the error page. Valid values: 404 and 200.

5. Click Save.

Configure static website hosting and enable subdirectory homepage

1. In the left-side navigation tree, choose Data Management > Static Pages.
2. In the Static Pages section, click Configure and configure the parameters. The following table describes the parameters.
   

   Parameter	Description
   Default Homepage	The default homepage that appears when you use a browser to access the static website hosted on the OSS bucket. In this example, this parameter is set to index.html.
   Subfolder Homepage	Specifies whether to enable the subdirectory homepage feature for the bucket. In this example, Enable is selected. If you enable the subdirectory homepage feature for a bucket and access the root directory of the bucket, the default homepage object in the root directory is returned. If you enable the subdirectory homepage feature for a bucket and access a subdirectory whose URL ends with a forward slash (/), the default homepage object in the subdirectory is returned. For example, if you access https://examplebucket.oss-cn-hangzhou.aliyuncs.com/subdir/, the default homepage object index.html in the subdir/ directory is returned.
   Subfolder 404 Rule	The subdirectory 404 rule for the bucket when the subdirectory homepage feature is enabled. When you access an object that does not exist in the bucket, OSS returns different results based on the specified subdirectory 404 rule. For example, if you use the URL https://examplebucket.oss-cn-hangzhou.aliyuncs.com/exampledir to access an object named exampledir that does not exist in the bucket, OSS returns different results based on the value that you specified for this parameter. Default value: Redirect. Valid values: Redirect: OSS checks whether the exampledir/index.html object exists. If the object exists, OSS returns HTTP status code 302 and redirects the request to https://examplebucket.oss-cn-hangzhou.aliyuncs.com/exampledir/index.html. If the object does not exist, OSS returns HTTP status code 404 and checks whether the https://examplebucket.oss-cn-hangzhou.aliyuncs.com/error.html object exists. If the object does not exist, OSS returns HTTP status code 404. NoSuchKey: OSS returns HTTP status code 404 and checks whether the https://examplebucket.oss-cn-hangzhou.aliyuncs.com/error.html object exists. Index: OSS checks whether the exampledir/index.html object exists. If the object exists, OSS returns HTTP status code 200 and the content of the object. If the object does not exist, OSS checks whether the https://examplebucket.oss-cn-hangzhou.aliyuncs.com/error.html object exists.
   Default 404 Page	The error page that is returned if the object that you want to access does not exist in the bucket and HTTP status code 404 is returned. Only an object in the root directory of the bucket can be specified as the default 404 page. In this example, this parameter is set to error.html.
   Error Page Status Code	The HTTP status code that is returned with the error page. Valid values: 404 and 200.

3. Click Save.

Create and upload a default homepage object

If you set the default homepage to index.html when you configure static website hosting for the examplebucket bucket, you must upload an object named index.html to the root directory of the bucket. If you enable Subfolder Homepage for the bucket, you must also upload index.html to the subdir/ subdirectory of the bucket.

1. Create a file named index.html. The content of the index.html file is similar to the following example:

   <html>
   <head>
       <title>My Website Home Page</title>
       <meta charset="utf-8">
   </head>
   <body>  
     <p>Now hosted on OSS.</p>
   </body>
   </html>

2. Save index.html to a local path.
3. Upload index.html to the root directory and subdir/ subdirectory of examplebucket. You must set the ACL of the index.html object to public-read.
   For more information about how to upload an object, see Upload objects.

Create and upload a default 404 page

If you set the default 404 page to error.html when you configure static website hosting for examplebucket, you must upload an object named error.html to the root directory of examplebucket.

1. Create a file named error.html. The content of the error.html file is similar to the following example:

   <html>
   <head>
       <title>Hello OSS!</title>
       <meta charset="utf-8">
   </head>
   <body>  
     <p>This is error 404 page.</p>
   </body>
   </html>

2. Save error.html to a local path.
3. Upload error.html to the root directory of examplebucket. You must set the ACL of the error.html object to public-read.
   For more information about how to upload an object, see Upload objects.

Disable static website hosting

If you no longer need to use the configurations of static website hosting, perform the following steps to disable the static website hosting feature:

1. In the left-side navigation tree, choose Data Management > Static Pages.
2. In the Static Pages section, click Configure.
3. Remove the configurations of the Default Homepage and Default 404 Page parameters and click Save.
   If the following page is displayed, the static website hosting feature is disabled.