静的webサイトは、クライアント上で実行できるJavaScriptコードなどのスクリプトを含む、すべてのwebページが静的コンテンツのみで構成されるwebサイトです。 静的Webサイトホスティング機能を使用して、静的WebサイトをObject Storage Service (OSS) バケットでホストし、バケットのドメイン名を使用してWebサイトにアクセスできます。
使用上の注意
静的Webサイトホスティング機能を有効にする場合は、Webサイトのデフォルトのホームページとデフォルトの404ページを指定する必要があります。
ブラウザを使用してOSSバケットでホストされている静的Webサイトにアクセスすると、デフォルトのホームページが表示されます。
デフォルトのホームページとして指定するオブジェクトは、バケットのルートディレクトリに保存され、匿名アクセスを許可するオブジェクトである必要があります。 サブフォルダホームページを有効にした場合、オブジェクトもサブディレクトリに格納する必要があります。
デフォルトの404ページは、OSSによって返されるエラーページです。 ブラウザを使用してOSSバケットでホストされている静的Webサイトにアクセスし、404エラーが発生すると、OSSはデフォルトの404ページを返します。
既定の404ページとして指定するオブジェクトは、バケットのルートディレクトリに格納され、匿名アクセスを許可するオブジェクトである必要があります。
匿名ユーザーがオブジェクトにアクセスできるようにするには、既定のホームページまたは既定の404ページとして指定されているオブジェクトのアクセス制御リスト (ACL) をpublic-read
に設定する必要があります。 オブジェクトのACLを設定する方法の詳細については、「オブジェクトのACLの設定」をご参照ください。
使用上の注意
データのセキュリティを確保するため、9月28日から中国本土のリージョンの2018、9月25日から中国本土以外のリージョンの2019は、MIMEタイプがtext/htmlで、名前拡張子がHTM、HTML、JSP、PLG、HTX、STMの静的webページオブジェクトにアクセスする場合、次の制限が有効になります。
デフォルトのOSSドメイン名を使用して静的webページオブジェクトにアクセスすると、Content-Disposition:attachmentというヘッダーが自動的にレスポンスに追加されます。 ブラウザを使用してオブジェクトにアクセスすると、オブジェクトは添付ファイルとしてダウンロードされます。
webページオブジェクトを特定の形式でプレビューできるブラウザーを使用して、カスタムドメイン名を使用して静的webページオブジェクトにアクセスすると、オブジェクトのコンテンツがプレビューされます。
課金ルール
ストレージ料金
HTML、CSS、JavaScript、イメージなどの静的webページオブジェクトの保存に使用されるストレージ容量に基づいて課金されます。 詳細については、「ストレージ料金」をご参照ください。
トラフィック料金
デフォルトのホームページ、画像、スクリプトなどのすべての静的リソースを含む、静的Webサイトにアクセスしたときに生成されるアウトバウンドトラフィック、およびデフォルトの404ページが返されたときに生成されるアウトバウンドトラフィック。 詳細については、「トラフィック料金」をご参照ください。
API 呼び出し料金
デフォルトのホームページ、他のページ、静的リソース、およびデフォルトの404ページにアクセスするためのGETリクエストをOSSに送信すると、課金されます。 詳細については、「API操作呼び出し料金」をご参照ください。
例
バケットで静的Webサイトをホストした後、デフォルトのホームページと同じ名前のオブジェクトをバケットにアップロードする必要があります。 例: index.html バケットにsubdir/ という名前のディレクトリがある場合は、index.htmlオブジェクトをディレクトリにアップロードする必要があります。 また、デフォルトの404ページと同じ名前のオブジェクトをバケットにアップロードする必要があります。 例: error.html 次のセクションでは、サンプルバケット内のオブジェクトとディレクトリの構造を示します。
バケット
â ─ ─ index.html
â ─ ─ error.html
â ─ ─ example.txt
└ ─ ─ subdir /
└ ─ ─ index.html
この例では、カスタムドメイン名example.com
はバケットにバインドされ、バケットでホストされている静的Webサイトのデフォルトのホームページはindex.htmlで、Webサイトのデフォルトの404ページはerror.htmlです。 カスタムドメイン名を使用して静的Webサイトにアクセスすると、Webサイトをホストするバケットの静的ページの設定に基づいて、さまざまな応答が返されます。
Subfolderホームページが無効の場合:
https://example.com/ および https://example.com/subdir/ にアクセスすると、OSSは https://example.com/index.html を返します。
https://example.com/example.txt にアクセスすると、example.txtオブジェクトが取得されます。
https://example.com/object にアクセスすると、オブジェクトオブジェクトが存在しない場合は https://example.com/error.html を返します。
Subfolderホームページが有効な場合
https://example.com/ にアクセスすると、OSSは https://example.com/index.html を返します。
https://example.com/subdir/ にアクセスすると、OSSは https://example.com/subdir/index.html を返します。
https://example.com/example.txt にアクセスすると、example.txtオブジェクトが取得されます。
https://example.com/object にアクセスすると、オブジェクトオブジェクトが存在しないため、Subfolder 404 Ruleの設定に基づいて次のいずれかの応答が返されます。
Subfolder 404 Ruleがデフォルト値であるRedirectに設定されている場合、OSSは引き続きobject/index.htmlが存在するかどうかをチェックします。 object/index.htmlが存在する場合、OSSはHTTPステータスコード302を返し、リクエストを https://example.com/object/index.html にリダイレクトします。 object/index.htmlが存在しない場合、OSSはHTTPステータスコード404を返し、https://example.com/error.html が存在するかどうかを確認します。
Subfolder 404 RuleがNoSuchKeyに設定されている場合、OSSはHTTPステータスコード404を返し、https://example.com/error.html が存在するかどうかを確認します。
Subfolder 404 RuleがIndexに設定されている場合、OSSは引き続きobject/index.htmlオブジェクトが存在するかどうかをチェックします。 オブジェクトが存在する場合、OSSはHTTPステータスコード200とオブジェクトのコンテンツを返します。 オブジェクトが存在しない場合、OSSは https://example.com/error.html が存在するかどうかをチェックします。
手順
OSSコンソールの使用
静的Webサイトホスティングを設定します。
Subfolderホームページが無効の場合:
上記の例では、バケットのsubdir /サブディレクトリにアクセスすると、subdir /サブディレクトリのindex.htmlという名前のオブジェクトではなく、バケットのルートディレクトリのindex.htmlという名前のデフォルトのホームページオブジェクトが返されます。 さらに、バケットに存在しないオブジェクトにアクセスすると、指定されたデフォルトの404ページが返されます。 以下の手順を実行します。
OSS コンソールにログインします。
左側のナビゲーションウィンドウで、バケットリスト をクリックします。 [バケット] ページで、目的のバケットを見つけてクリックします。
左側のナビゲーションツリーで、 を選択します。
[静的ページ] ページで、[設定] をクリックし、パラメーターを設定します。 下表に、各パラメーターを説明します。
パラメーター | 説明 |
デフォルトホームページ | ブラウザを使用してOSSバケットでホストされている静的Webサイトにアクセスしたときに表示されるデフォルトのホームページ。 この例では、このパラメーターはindex.htmlに設定されています。 |
Subfolderホームページ | バケットのサブディレクトリホームページ機能を有効にするかどうかを指定します。 この例では、[無効] が選択されています。 この場合、バケットのルートディレクトリ、またはURLがスラッシュ (/) で終わるサブディレクトリにアクセスすると、バケットのルートディレクトリにあるデフォルトのホームページが返されます。 |
デフォルトの404ページ | アクセスするオブジェクトがバケットに存在せず、HTTPステータスコードが404された場合に返されるエラーページ。 バケットのルートディレクトリにあるオブジェクトのみが、デフォルトの404ページとして指定できます。 この例では、このパラメーターはerror.htmlに設定されています。 |
エラーページのステータスコード | エラーページとともに返されるHTTPステータスコード。 有効な値: 404と200。 |
[保存] をクリックします。
Subfolderホームページが有効な場合
上記の例では、バケットのsubdir /サブディレクトリにアクセスすると、バケットのサブディレクトリにあるindex.htmlという名前のデフォルトのホームページオブジェクトが返されます。 さらに、バケットに存在しないオブジェクトにアクセスすると、指定されたデフォルトの404ページと、指定されたサブディレクトリ404ルールに基づく結果が返されます。 以下の手順を実行します。
[静的ページ] ページで、[設定] をクリックし、パラメーターを設定します。 下表に、各パラメーターを説明します。
パラメーター | 説明 |
デフォルトホームページ | ブラウザを使用してOSSバケットでホストされている静的Webサイトにアクセスしたときに表示されるデフォルトのホームページ。 この例では、このパラメーターはindex.htmlに設定されています。 |
Subfolderホームページ | バケットのサブディレクトリホームページ機能を有効にするかどうかを指定します。 この例では、[有効] が選択されています。 バケットのサブフォルダホームページを有効にした後、バケットのルートディレクトリにアクセスすると、ルートディレクトリのデフォルトのホームページが返されます。 URLがスラッシュ (/) で終わるサブディレクトリにアクセスすると、サブディレクトリ内のデフォルトのホームページが返されます。 たとえば、https://examplebucket.oss-cn-hangzhou.aliyuncs.com/subdir/ にアクセスすると、subdir/ ディレクトリ内のindex.html という名前のデフォルトのホームページオブジェクトが返されます。 |
サブフォルダ404ルール | サブフォルダホームページ機能が有効になっている場合のバケットのサブディレクトリ404ルール。 バケットに存在しないオブジェクトにアクセスすると、指定されたサブディレクトリ404ルールに基づいて異なる結果が返されます。 たとえば、https://examplebucket.oss-cn-hangzhou.aliyuncs.com/exampledir を使用してバケットに存在しないexampledirという名前のオブジェクトにアクセスする場合、OSSはこのパラメーターに指定した値に基づいて異なる結果を返します。 有効な値: リダイレクト (デフォルト): exampledir/index.htmlオブジェクトが存在するかどうかを確認します。 オブジェクトが存在する場合、OSSはHTTPステータスコード302を返し、リクエストを https://examplebucket.oss-cn-hangzhou.aliyuncs.com/exampledir/index.html にリダイレクトします。 オブジェクトが存在しない場合、OSSはHTTPステータスコード404を返し、https://examplebucket.oss-cn-hangzhou.aliyuncs.com/error.html オブジェクトが存在するかどうかを確認します。 オブジェクトが存在しない場合、OSSはHTTPステータスコード404を返します。
NoSuchKey: OSSはHTTPステータスコード404を返し、https://examplebucket.oss-cn-hangzhou.aliyuncs.com/error.html オブジェクトが存在するかどうかを確認します。 Index: exampledir/index.htmlオブジェクトが存在するかどうかを確認します。
|
デフォルトの404ページ | アクセスするオブジェクトがバケットに存在せず、HTTPステータスコードが404された場合に返されるエラーページ。 バケットのルートディレクトリにあるオブジェクトのみが、デフォルトの404ページとして指定できます。 この例では、このパラメーターはerror.htmlに設定されています。 |
エラーページのステータスコード | エラーページとともに返されるHTTPステータスコード。 有効な値: 404と200。 |
[保存] をクリックします。
デフォルトのホームページを作成してアップロードします。
examplebucketバケットの静的Webサイトホスティングを設定するときにデフォルトのホームページをindex.htmlに設定した場合、バケットのルートディレクトリにindex.htmlという名前のオブジェクトをアップロードする必要があります。 バケットのサブフォルダホームページを有効にする場合は、index.htmlオブジェクトもバケットのsubdir/ サブディレクトリにアップロードする必要があります。
index.htmlという名前のファイルを作成します。 index.htmlファイルの内容は、次の例に似ています。
<html>
<ヘッド>
<title> 私のウェブサイトのホームページ </title>
<meta charset="utf-8">
</head>
<body>
<p> OSSでホストされました。</p>
</body>
</html>
index.htmlファイルをローカルパスに保存します。
examplebucketバケットのルートディレクトリとsubdir /サブディレクトリにindex.htmlファイルをアップロードします。 index.htmlオブジェクトのACLをpublic-readに設定します。
オブジェクトのアップロード方法の詳細については、「簡易アップロード」をご参照ください。
デフォルトの404ページを作成してアップロードします。
examplebucketバケットの静的Webサイトホスティングを設定するときにデフォルトの404ページをerror.htmlに設定した場合、error.htmlという名前のファイルをexamplebucketバケットのルートディレクトリにアップロードする必要があります。
error.htmlという名前のファイルを作成します。 error.htmlファイルの内容は、次の例に似ています。
<html>
<ヘッド>
<title>Hello OSS!</title>
<meta charset="utf-8">
</head>
<body>
<p> ページ404のエラーです。</p>
</body>
</html>
error.htmlファイルをローカルパスに保存します。
examplebucketバケットのルートディレクトリにerror.htmlファイルをアップロードします。 index.htmlオブジェクトのACLをpublic-readに設定します。
OSS SDKの使用
次のサンプルコードは、一般的なプログラミング言語でOSS SDKを使用して静的Webサイトホスティングを設定する方法の例を示しています。 他のプログラミング言語でOSS SDKを使用して静的Webサイトホスティングを設定する方法の詳細については、「概要」をご参照ください。
com.aliyun.oss.ClientExceptionをインポートします。com.aliyun.oss.OSSをインポートします。impor t com.aliyun.oss.com mon.auth.*;
com.aliyun.oss.OSSClientBuilderをインポートします。com.aliyun.oss.OSSExceptionをインポートします。com.aliyun.oss.mo del.SetBucketWebsiteRequestをインポートします。public classデモ {
public static void main(String[] args) throws Exception {
// この例では、中国 (杭州) リージョンのエンドポイントが使用されます。 実際のエンドポイントを指定します。
String endpoint = " https://oss-cn-hangzhou.aliyuncs.com ";
// 環境変数からアクセス資格情報を取得します。 サンプルコードを実行する前に、OSS_ACCESS_KEY_IDおよびOSS_ACCESS_KEY_SECRET環境変数が設定されていることを確認してください。
EnvironmentVariableCredentialsProvider credentialsProvider = CredentialsProviderFactory.newEnvironmentVariableCredentialsProvider();
// バケットの名前を指定します。 例: examplebucket.
String bucketName = "examplebucket";
// Create an OSSClient instance.
OSS ossClient = new OSSClientBuilder().build(endpoint, credentialsProvider);
try {
// バケットの名前を指定します。
SetBucketWebsiteRequestリクエスト=新しいSetBucketWebsiteRequest(bucketName);
// バケットでホストされている静的Webサイトのデフォルトのホームページを指定します。
request.setIndexDocument("index.html");
// バケットでホストされている静的Webサイトのデフォルトの404ページを指定します。
request.setErrorDocument("error.html");
ossClient.setBucketWebsite(request);
} catch (Exception e) {
System.out.println("Caught an OSSException, which means your request made it to OSS, "
+ "しかし、何らかの理由でエラー応答で拒否されました。");
System.out.println("エラーメッセージ:" + oe.getErrorMessage());
System.out.println("エラーコード:" + oe.getErrorCode());
System.out.println("リクエストID:" + oe.getRequestId());
System.out.println("ホストID:" + oe.getHostId());
} catch (ClientException e) {
System.out.println("Caught an ClientException, which means the client encountered "
+ "a serious internal problem while trying to communicate with OSS, "
+ 「ネットワークにアクセスできないなど」;
System.out.println("エラーメッセージ:" + ce.getMessage());
} 最後に{
if (ossClient != null) {
ossClient.shutdown();
}
}
}
}
<?php
if (is_file(__DIR__) 。 '/../autoload.php')) {
require_once __DIR__ . '/../autoload.php';
}
if (is_file(__DIR__) 。 '/../vendor/autoload.php')) {
require_once __DIR__ . '/../vendor/autoload.php';
}
OSS\Credentials\EnvironmentVariableCredentialsProviderを使用します。OSS\OssClientを使用します。OSS\CoreOssExceptionを使用します。OSS\Model\WebsiteConfigを使用します。// 環境変数からアクセス資格情報を取得します。 サンプルコードを実行する前に、OSS_ACCESS_KEY_IDおよびOSS_ACCESS_KEY_SECRET環境変数が設定されていることを確認してください。
$provider = new EnvironmentVariableCredentialsProvider();
// この例では、中国 (杭州) リージョンのエンドポイントが使用されます。 実際のエンドポイントを指定します。
$end point = " https://oss-cn-hangzhou.aliyuncs.com ";
// バケットの名前を指定します。 例: examplebucket.
$bucket= "examplebucket";
// バケットでホストされている静的Webサイトのデフォルトのホームページをindex.htmlに設定し、デフォルトの404ページをerror.htmlに設定します。
$websiteConfig = new WebsiteConfig("index.html", "error.html");
try {
$config=配列 (
"provider" => $provider、
"endpoint" => $end ポイント、
);
$ossClient = new OssClient($config);
$ossClient->putBucketWebsite($bucket、$websiteConfig);
} catch (OssException $e) {
printf(__FUNCTION__ . ": FAILED\n");
printf($e->getMessage()) 。 "\n");
戻ります。}
print(__FUNCTION__) 。 ": OK" 。 "\n");
#-*-コーディング: utf-8-*-
oss2のインポート
oss2.modelsからBucketWebsiteをインポート
oss2.credentialsからEnvironmentVariableCredentialsProviderをインポート
# 環境変数からアクセス資格情報を取得します。 サンプルコードを実行する前に、OSS_ACCESS_KEY_IDおよびOSS_ACCESS_KEY_SECRET環境変数が設定されていることを確認してください。
auth = oss2.ProviderAuth(EnvironmentVariableCredentialsProvider())
# この例では、中国 (杭州) リージョンのエンドポイントが使用されます。 実際のエンドポイントを指定します。
# バケットの名前を指定します。 例: examplebucket.
bucket = oss2.Bucket(auth, 'https:// oss-cn-hangzhou.aliyuncs.com ', 'examplebucket')
# 静的Webサイトホスティングを有効にし、デフォルトのホームページをindex.htmlに設定してから、デフォルトの404ページをerror.htmlに設定します。
bucket.put_bucket_website (BucketWebsite('index.html ', 'error.html'))
パッケージメイン
import (import (import)
"fmt"
"os"
「github.com/aliyun/aliyun-oss-go-sdk/oss」
)
func main() {
// 環境変数からアクセス資格情報を取得します。 サンプルコードを実行する前に、OSS_ACCESS_KEY_IDおよびOSS_ACCESS_KEY_SECRET環境変数が設定されていることを確認してください。
provider, err := oss.NewEnvironmentVariableCredentialsProvider()
if err! =nil {
fmt.Println("Error:", err)
os.Exit(-1)
}
// Create an OSSClient instance.
// バケットが配置されているリージョンのエンドポイントを指定します。 たとえば、バケットが中国 (杭州) リージョンにある場合、エンドポイントを https://oss-cn-hangzhou.aliyuncs.com に設定します。 実際のエンドポイントを指定します。
client, err := oss.New("yourEndpoint", ", " ", ", oss.SetCredentialsProvider(&provider))
if err! =nil {
fmt.Println("Error:", err)
os.Exit(-1)
}
// バケットの名前を指定します。 例: examplebucket.
bucketName := "examplebucket"
// 静的Webサイトのデフォルトのホームページをindex.htmlに設定し、デフォルトの404ページをerror.htmlに設定します。
err = client.SetBucketWebsite(bucketName, "index.html", "error.html")
if err! =nil {
fmt.Println("Error:", err)
os.Exit(-1)
}
} Aliyun.OSSを使用した
;
Aliyun.OSS.Common; を使用
// バケットが配置されているリージョンのエンドポイントを指定します。 たとえば、バケットが中国 (杭州) リージョンにある場合、エンドポイントを https://oss-cn-hangzhou.aliyuncs.com に設定します。
var endpoint = "yourEndpoint";
// 環境変数からアクセス資格情報を取得します。 サンプルコードを実行する前に、OSS_ACCESS_KEY_IDおよびOSS_ACCESS_KEY_SECRET環境変数が設定されていることを確認してください。
var accessKeyId = Environment.GetEnvironmentVariable("OSS_ACCESS_KEY_ID");
var accessKeySecret = Environment.GetEnvironmentVariable("OSS_ACCESS_KEY_SECRET");
// バケットの名前を指定します。
var bucketName = "examplebucket";
// OSSClientインスタンスを作成します。
var client = new OssClient (エンドポイント、accessKeyId、accessKeySecret);
トライ
{
// バケットでホストされている静的Webサイトのデフォルトのホームページをindex.htmlに設定し、デフォルトの404ページをerror.htmlに設定します。
var request = new SetBucketWebsiteRequest(bucketName, "index.html", "error.html");
client.SetBucketWebsite(request);
Console.WriteLine("Set bucket:{0} Wetbsite successed", bucketName);
}
キャッチ (OssException ex)
{
Console.WriteLine("エラー情報で失敗: {0}; エラー情報: {1} 。 \nRequestID:{2}\tHostID:{3}"、
ex.ErrorCode, ex.Message, ex.RequestId, ex.HostId);
}
キャッチ (例外ex)
{
Console.WriteLine("Failed with error info: {0}" 、メッセージなど);
}
#include <alibabacloud/oss/OssClient.h>
名前空間listaCloud::OSSを使用します。int main(void)
{
/* OSSへのアクセスに使用されるアカウントに関する情報を初期化します。 */
/* バケットが配置されているリージョンのエンドポイントを指定します。 たとえば、バケットが中国 (杭州) リージョンにある場合、エンドポイントを https://oss-cn-hangzhou.aliyuncs.com に設定します。 */
std::string Endpoint = "yourEndpoint";
/* バケットの名前を指定します。 例: examplebucket. */
std::string BucketName = "examplebucket";
/* ネットワークリソースなどのリソースを初期化します。 */
InitializeSdk();
ClientConfiguration conf;
/* 環境変数からアクセス資格情報を取得します。 サンプルコードを実行する前に、OSS_ACCESS_KEY_IDおよびOSS_ACCESS_KEY_SECRET環境変数が設定されていることを確認してください。 */
auto credentialsProvider = std::make_shared<EnvironmentVariableCredentialsProvider>();
OssClientクライアント (Endpoint, credentialsProvider, conf);
/* 静的Webサイトホスティングを設定します。 */
SetBucketWebsiteRequestリクエスト (BucketName);
/* バケットにホストされている静的Webサイトのデフォルトのホームページをindex.htmlに設定します。 */
request.setIndexDocument("index.html");
/* バケットでホストされている静的Webサイトのデフォルトの404ページをerror.htmlに設定します。 */
request.setErrorDocument("error.html");
auto outcome = client.SetBucketWebsite (リクエスト);
if (!outcome.isSuccess()) {
/* 例外を処理します。 */
std::cout << "SetBucketWebsite fail" <<
",code:" << outcome.error().Code() <<
",message:" << outcome.error().Message() <<
",requestId:" << outcome.error().RequestId() << std::endl;
return -1;
}
/* ネットワークリソースなどのリソースを解放します。 */
ShutdownSdk();
0を返します。}
OSS APIの使用
ビジネスで高度なカスタマイズが必要な場合は、RESTful APIを直接呼び出すことができます。 APIを直接呼び出すには、コードに署名計算を含める必要があります。 詳細については、「PutBucketWebsite」をご参照ください。
よくある質問
バケットを有効にした後、静的Webサイトホスティング機能を無効にできますか?
静的Webサイトホスティングの設定を使用する必要がなくなった場合は、次の手順を実行して静的Webサイトホスティング機能を無効にします。
左側のナビゲーションツリーで、 を選択します。
[静的ページ] セクションで、[設定] をクリックします。
デフォルトホームページとデフォルト404ページパラメーターの設定を削除し、[保存] をクリックします。
次のページが表示されている場合、静的Webサイトホスティング機能は無効になります。