静的ウェブサイトのホスト

このチュートリアルでは、所有するドメインの静的ウェブサイトをホストするように Cloud Storage バケットを設定します。静的ウェブページには HTML、CSS、JavaScript などのクライアント側の技術を使用できます。設定例やヒントなど、静的ウェブページの詳細については、静的ウェブサイト ページをご覧ください。

このチュートリアルは、動的ウェブサイトの静的アセットのホストにも適用されます。

注意: このチュートリアルは HTTP を使用している場合を対象としたものです。機密データやプライベート データが含まれているコンテンツは Cloud Storage バケットから配信しないでください。HTTPS 経由でカスタム ドメインのコンテンツを配信するオプションについては、関連するトラブルシューティングのトピックをご覧ください。

目標

このチュートリアルの内容は次のとおりです。

• CNAME レコードを使用して、ドメインを Cloud Storage に指定する。
• ドメインにリンクするバケットを作成する。
• サイトのファイルをアップロードして共有する。
• ウェブサイトをテストする。

料金

このチュートリアルでは、Cloud Platform の課金可能な次のコンポーネントを使用します。

• Cloud Storage

静的ウェブサイトのホスティングで発生する可能性がある料金の詳細については、ストレージ料金のモニタリングに関するヒントをご覧ください。Cloud Storage のコストの詳細については、料金体系のページをご覧ください。

始める前に

1. Google アカウントにログインします。

   Google アカウントをまだお持ちでない場合は、新しいアカウントを登録します。

2. GCP プロジェクトを選択または作成します。

   [リソースの管理] ページに移動

3. プロジェクトに対する課金を有効にします。

   課金を有効にする

4. 自分がオーナーまたは管理者になっているドメインが必要です。ドメインをまだお持ちでない場合は、Google Domains など、新しいドメインを登録できるサービスが数多くあります。

   このチュートリアルでは、ドメイン example.com を使用します。

5. 自分が使用するドメインのオーナーまたは管理者になっていることを確認します。example.com などのサブドメインではなく、www.example.com などのトップレベル ドメインを検証していることを確認します。

   注: バケットに関連付けているドメインを所有している場合は、以前にこの手順をすでに実行している可能性があります。Google Domains でドメインを購入した場合、確認は自動的に行われます。

CNAME レコードの作成

CNAME レコードは、DNS レコードの一種です。これは、ドメインからの URL をリクエストするトラフィックを、配信するリソース（この場合は Cloud Storage バケットのオブジェクト）に振り向けます。www.example.com の場合、CNAME レコードには次の情報が含まれている場合があります。

NAME                  TYPE     DATA
www.example.com       CNAME    c.storage.googleapis.com.

CNAME リダイレクトの詳細については、CNAME エイリアス設定の URL をご覧ください。

ドメインを Cloud Storage に接続するには:

1. CNAME を指す c.storage.googleapis.com. レコードを作成します。

   ドメイン登録サービスでは、CNAME レコードの追加など、ドメインを管理する方法が必要です。たとえば、Google Domains を使用する場合は、Google Domains ヘルプページの [リソース レコード] プルダウン セクションで、CNAME などのリソース レコードの追加手順を確認できます。

   注: ドメイン登録サービスによっては、CNAME レコードを使用して www.example.com や myblog.example.com などのサブドメインにマッピングできても、example.com などのルートドメインには直接マッピングできない場合があります。

バケットの作成

ドメインに作成した CNAME に一致する名前のバケットを作成します。

たとえば、www.example.com が c.storage.googleapis.com. を指す CNAME レコードを追加した場合は、"www.example.com" という名前のバケットを作成します。

バケットを作成するには:

Console

1. Google Cloud Platform Console で Cloud Storage ブラウザを開きます。
   Cloud Storage ブラウザを開く

2. [バケットを作成] をクリックします。

3. [バケットの作成] ダイアログで、以下を指定します。

   • バケットの [名前]。

   • バケットのストレージ クラス: Multi-Regional。

   • バケットの [ロケーション]: [米国]。

4. [作成] をクリックします。

成功した場合、バケットのページに移動し、「このバケットにはオブジェクトがありません」というテキストが表示されます。

gsutil

次の gsutil mb コマンドを使用します。

gsutil mb gs://www.example.com

成功した場合、次の内容が返されます。

Creating gs://www.example.com/...

コードサンプル

C#

Cloud Storage クライアントのインストールと作成の詳細については、Cloud Storage クライアント ライブラリをご覧ください。

GitHub で表示 フィードバック

private void CreateBucket(string bucketName)
{
    var storage = StorageClient.Create();
    storage.CreateBucket(s_projectId, bucketName);
    Console.WriteLine($"Created {bucketName}.");
}

Go

Cloud Storage クライアントのインストールと作成の詳細については、Cloud Storage クライアント ライブラリをご覧ください。

GitHub で表示 フィードバック

bucket := client.Bucket(bucketName)
if err := bucket.Create(ctx, projectID, &storage.BucketAttrs{
	StorageClass: "COLDLINE",
	Location:     "asia",
}); err != nil {
	return err
}

Java

Cloud Storage クライアントのインストールと作成の詳細については、Cloud Storage クライアント ライブラリをご覧ください。

GitHub で表示 フィードバック

Bucket bucket = storage.create(BucketInfo.newBuilder(bucketName)
    // See here for possible values: http://g.co/cloud/storage/docs/storage-classes
    .setStorageClass(StorageClass.COLDLINE)
    // Possible values: http://g.co/cloud/storage/docs/bucket-locations#location-mr
    .setLocation("asia")
    .build());

Node.js

Cloud Storage クライアントのインストールと作成の詳細については、Cloud Storage クライアント ライブラリをご覧ください。

GitHub で表示 フィードバック

// Imports the Google Cloud client library
const Storage = require('@google-cloud/storage');

// Creates a client
const storage = new Storage();

/**
 * TODO(developer): Uncomment the following line before running the sample.
 */
// const bucketName = 'Name of a bucket, e.g. my-bucket';

// Creates a new bucket
storage
  .createBucket(bucketName, {
    location: 'ASIA',
    storageClass: 'COLDLINE',
  })
  .then(() => {
    console.log(`Bucket ${bucketName} created.`);
  })
  .catch(err => {
    console.error('ERROR:', err);
  });

PHP

Cloud Storage クライアントのインストールと作成の詳細については、Cloud Storage クライアント ライブラリをご覧ください。

GitHub で表示 フィードバック

use Google\Cloud\Storage\StorageClient;

/**
 * Create a Cloud Storage Bucket.
 *
 * @param string $bucketName name of the bucket to create.
 * @param string $options options for the new bucket.
 *
 * @return Google\Cloud\Storage\Bucket the newly created bucket.
 */
function create_bucket($bucketName, $options = [])
{
    $storage = new StorageClient();
    $bucket = $storage->createBucket($bucketName, $options);
    printf('Bucket created: %s' . PHP_EOL, $bucket->name());
}

Python

Cloud Storage クライアントのインストールと作成の詳細については、Cloud Storage クライアント ライブラリをご覧ください。

GitHub で表示 フィードバック

def create_bucket(bucket_name):
    """Creates a new bucket."""
    storage_client = storage.Client()
    bucket = storage_client.create_bucket(bucket_name)
    print('Bucket {} created'.format(bucket.name))

Ruby

Cloud Storage クライアントのインストールと作成の詳細については、Cloud Storage クライアント ライブラリをご覧ください。

GitHub で表示 フィードバック

# project_id    = "Your Google Cloud project ID"
# bucket_name   = "Name of Google Cloud Storage bucket to create"
# location      = "Location of where to create Cloud Storage bucket"
# storage_class = "Storage class of Cloud Storage bucket"

require "google/cloud/storage"

storage = Google::Cloud::Storage.new project: project_id
bucket  = storage.create_bucket bucket_name,
                                location:      location,
                                storage_class: storage_class

puts "Created bucket #{bucket.name} in #{location}" +
     " with #{storage_class} class"

REST API

JSON API

1. OAuth 2.0 Playground から承認アクセス トークンを取得します。固有の OAuth 認証情報を使用するように Playground を構成します。
2. .json ファイルを作成して name プロパティをウェブサイトの名前に割り当てます。

{
 "name": "www.example.com"
}

3. cURL を使用して、JSON API を呼び出します。www.example.com の場合:

   curl -X POST --data-binary @website-bucket-name.json \
    -H "Authorization: Bearer ya29.AHES6ZRVmB7fkLtd1XTmq6mo0S1wqZZi3-Lh_s-6Uw7p8vtgSwg" \
    -H "Content-Type: application/json" \
    "https://www.googleapis.com/storage/v1/b?project=my-static-website"

XML API

1. OAuth 2.0 Playground から承認アクセス トークンを取得します。固有の OAuth 認証情報を使用するように Playground を構成します。
2. cURL を使用して XML API を呼び出し、ウェブサイト名でバケットを作成します。www.example.com の場合:

   curl -X PUT \
    -H "Authorization: Bearer ya29.AHES6ZRVmB7fkLtd1XTmq6mo0S1wqZZi3-Lh_s-6Uw7p8vtgSwg" \
    -H "x-goog-project-id: my-static-website" \
    "https://storage.googleapis.com/www.example.com"

サイトのファイルのアップロード

ウェブサイトで配信するファイルをバケットに追加するには:

Console

1. Google Cloud Platform Console で Cloud Storage ブラウザを開きます。
   Cloud Storage ブラウザを開く

2. バケットのリストで、作成したバケットをクリックします。

3. [オブジェクト] タブの [ファイルをアップロード] ボタンをクリックします。

4. ファイル ダイアログで、目的のファイルを参照して選択します。

アップロードの完了後、バケット内のファイルの名前、サイズ、種類、最終更新日が表示されます。

たとえば、index.html と 404.html の 2 つのファイルがあるバケットの場合、GCP Console で次のように表示されます。

ウェブサイトとして設定されたバケットの例。

gsutil

ファイルをバケットにコピーするには、gsutil cp コマンドを使用します。たとえば、ファイル index.html をその現在の場所 Desktop からコピーするには、次のコマンドを使用します。

gsutil cp Desktop/index.html gs://www.example.com

成功した場合、次の内容が返されます。

Copying file://Desktop/index.html [Content-Type=text/html]...
Uploading   gs://www.example.com/index.html:       0 B/2.58 KiB
Uploading   gs://www.example.com/index.html:       2.58 KiB/2.58 KiB

コードサンプル

C#

Cloud Storage クライアントのインストールと作成の詳細については、Cloud Storage クライアント ライブラリをご覧ください。

GitHub で表示 フィードバック

private void UploadFile(string bucketName, string localPath,
    string objectName = null)
{
    var storage = StorageClient.Create();
    using (var f = File.OpenRead(localPath))
    {
        objectName = objectName ?? Path.GetFileName(localPath);
        storage.UploadObject(bucketName, objectName, null, f);
        Console.WriteLine($"Uploaded {objectName}.");
    }
}

Go

Cloud Storage クライアントのインストールと作成の詳細については、Cloud Storage クライアント ライブラリをご覧ください。

GitHub で表示 フィードバック

f, err := os.Open("notes.txt")
if err != nil {
	return err
}
defer f.Close()

wc := client.Bucket(bucket).Object(object).NewWriter(ctx)
if _, err = io.Copy(wc, f); err != nil {
	return err
}
if err := wc.Close(); err != nil {
	return err
}

Java

Cloud Storage クライアントのインストールと作成の詳細については、Cloud Storage クライアント ライブラリをご覧ください。

GitHub で表示 フィードバック

InputStream content = new ByteArrayInputStream("Hello, World!".getBytes(UTF_8));
Blob blob = bucket.create(blobName, content, "text/plain");

Node.js

Cloud Storage クライアントのインストールと作成の詳細については、Cloud Storage クライアント ライブラリをご覧ください。

GitHub で表示 フィードバック

// Imports the Google Cloud client library
const Storage = require('@google-cloud/storage');

// Creates a client
const storage = new Storage();

/**
 * TODO(developer): Uncomment the following lines before running the sample.
 */
// const bucketName = 'Name of a bucket, e.g. my-bucket';
// const filename = 'Local file to upload, e.g. ./local/path/to/file.txt';

// Uploads a local file to the bucket
storage
  .bucket(bucketName)
  .upload(filename)
  .then(() => {
    console.log(`${filename} uploaded to ${bucketName}.`);
  })
  .catch(err => {
    console.error('ERROR:', err);
  });

PHP

Cloud Storage クライアントのインストールと作成の詳細については、Cloud Storage クライアント ライブラリをご覧ください。

GitHub で表示 フィードバック

use Google\Cloud\Storage\StorageClient;

/**
 * Upload a file.
 *
 * @param string $bucketName the name of your Google Cloud bucket.
 * @param string $objectName the name of the object.
 * @param string $source the path to the file to upload.
 *
 * @return Psr\Http\Message\StreamInterface
 */
function upload_object($bucketName, $objectName, $source)
{
    $storage = new StorageClient();
    $file = fopen($source, 'r');
    $bucket = $storage->bucket($bucketName);
    $object = $bucket->upload($file, [
        'name' => $objectName
    ]);
    printf('Uploaded %s to gs://%s/%s' . PHP_EOL, basename($source), $bucketName, $objectName);
}

Python

Cloud Storage クライアントのインストールと作成の詳細については、Cloud Storage クライアント ライブラリをご覧ください。

GitHub で表示 フィードバック

def upload_blob(bucket_name, source_file_name, destination_blob_name):
    """Uploads a file to the bucket."""
    storage_client = storage.Client()
    bucket = storage_client.get_bucket(bucket_name)
    blob = bucket.blob(destination_blob_name)

    blob.upload_from_filename(source_file_name)

    print('File {} uploaded to {}.'.format(
        source_file_name,
        destination_blob_name))

Ruby

Cloud Storage クライアントのインストールと作成の詳細については、Cloud Storage クライアント ライブラリをご覧ください。

GitHub で表示 フィードバック

# project_id        = "Your Google Cloud project ID"
# bucket_name       = "Your Google Cloud Storage bucket name"
# local_file_path   = "Path to local file to upload"
# storage_file_path = "Path to store the file in Google Cloud Storage"

require "google/cloud/storage"

storage = Google::Cloud::Storage.new project: project_id
bucket  = storage.bucket bucket_name

file = bucket.create_file local_file_path, storage_file_path

puts "Uploaded #{file.name}"

REST API

JSON API

1. OAuth 2.0 Playground から承認アクセス トークンを取得します。固有の OAuth 認証情報を使用するように Playground を構成します。
2. ファイルのデータをリクエストの本文に追加します。
3. cURL を使用して、JSON API を POST Object リクエストで呼び出します。www.example.com のインデックス ページの場合:

   curl -X POST --data-binary @index.html \
       -H "Content-Type: text/html" \
       -H "Authorization: Bearer ya29.AHES6ZRVmB7fkLtd1XTmq6mo0S1wqZZi3-Lh_s-6Uw7p8vtgSwg" \
       "https://www.googleapis.com/upload/storage/v1/b/www.example.com/o?uploadType=media&name=index.html"

JSON API を使用したオブジェクトのアップロードの詳細は、単純なアップロードの実行をご覧ください。

XML API

1. OAuth 2.0 Playground から承認アクセス トークンを取得します。固有の OAuth 認証情報を使用するように Playground を構成します。
2. オブジェクトのデータをリクエストの本文に追加します。
3. cURL を使用して、XML API を PUT Object リクエストで呼び出します。www.example.com のインデックス ページの場合:

   curl -X PUT --data-binary @index.html \
       -H "Authorization: Bearer ya29.AHES6ZRVmB7fkLtd1XTmq6mo0S1wqZZi3-Lh_s-6Uw7p8vtgSwg" \
       -H "Content-Type: text/html" \
       "https://storage.googleapis.com/www.example.com/index.html"

注: 既存のウェブサイトを移行する場合や、大量のファイルをコピーする場合は、gsutil rsync を使用してコンテンツを移動します。-R オプションを使用するとディレクトリ ツリーを再帰的にコピーできます。たとえば、local-dir という名前のローカル ディレクトリをバケットと同期させるには、次のコマンドを使用します。

gsutil rsync -R local-dir gs://www.example.com

ファイルの共有

配信するファイルを一般公開で共有するには:

Console

1. Google Cloud Platform Console で Cloud Storage ブラウザを開きます。
   Cloud Storage ブラウザを開く

2. バケットのリストで、アップロードしたオブジェクトが含まれているバケットをクリックします。

3. 一般公開で共有するオブジェクトごとに、[一般公開で共有する] 列のチェックボックスをクリックします。

成功した場合、チェックボックスの横に [公開リンク] というリンクが表示されます。

gsutil

バケットに保存されている配信予定の各ファイルの読み取り権限をすべてのユーザーに付与するには、gsutil acl ch コマンドを使用します。次に例を示します。

gsutil acl ch -u AllUsers:R gs://www.example.com/index.html

成功した場合、次の内容が返されます。

Updated ACL on gs://www.example.com/index.html

コードサンプル

C#

Cloud Storage クライアントのインストールと作成の詳細については、Cloud Storage クライアント ライブラリをご覧ください。

GitHub で表示 フィードバック

private void MakePublic(string bucketName, string objectName)
{
    var storage = StorageClient.Create();
    var storageObject = storage.GetObject(bucketName, objectName);
    storageObject.Acl = storageObject.Acl ?? new List<ObjectAccessControl>();
    storage.UpdateObject(storageObject, new UpdateObjectOptions
    {
        PredefinedAcl = PredefinedObjectAcl.PublicRead
    });
    Console.WriteLine(objectName + " is now public and can be fetched from " +
        storageObject.MediaLink);
}

Go

Cloud Storage クライアントのインストールと作成の詳細については、Cloud Storage クライアント ライブラリをご覧ください。

GitHub で表示 フィードバック

acl := client.Bucket(bucket).Object(object).ACL()
if err := acl.Set(ctx, storage.AllUsers, storage.RoleReader); err != nil {
	return err
}

Java

Cloud Storage クライアントのインストールと作成の詳細については、Cloud Storage クライアント ライブラリをご覧ください。

GitHub で表示 フィードバック

BlobId blobId = BlobId.of(bucketName, blobName, blobGeneration);
Acl acl = storage.createAcl(blobId, Acl.of(User.ofAllUsers(), Role.READER));

Node.js

Cloud Storage クライアントのインストールと作成の詳細については、Cloud Storage クライアント ライブラリをご覧ください。

GitHub で表示 フィードバック

// Imports the Google Cloud client library
const Storage = require('@google-cloud/storage');

// Creates a client
const storage = new Storage();

/**
 * TODO(developer): Uncomment the following lines before running the sample.
 */
// const bucketName = 'Name of a bucket, e.g. my-bucket';
// const filename = 'File to make public, e.g. file.txt';

// Makes the file public
storage
  .bucket(bucketName)
  .file(filename)
  .makePublic()
  .then(() => {
    console.log(`gs://${bucketName}/${filename} is now public.`);
  })
  .catch(err => {
    console.error('ERROR:', err);
  });

PHP

Cloud Storage クライアントのインストールと作成の詳細については、Cloud Storage クライアント ライブラリをご覧ください。

GitHub で表示 フィードバック

use Google\Cloud\Storage\StorageClient;

/**
 * Make an object publically accessible.
 *
 * @param string $bucketName the name of your Cloud Storage bucket.
 * @param string $objectName the name of your Cloud Storage object.
 *
 * @return void
 */
function make_public($bucketName, $objectName)
{
    $storage = new StorageClient();
    $bucket = $storage->bucket($bucketName);
    $object = $bucket->object($objectName);
    $object->update(['acl' => []], ['predefinedAcl' => 'PUBLICREAD']);
    printf('gs://%s/%s is now public' . PHP_EOL, $bucketName, $objectName);
}

Python

Cloud Storage クライアントのインストールと作成の詳細については、Cloud Storage クライアント ライブラリをご覧ください。

GitHub で表示 フィードバック

def make_blob_public(bucket_name, blob_name):
    """Makes a blob publicly accessible."""
    storage_client = storage.Client()
    bucket = storage_client.get_bucket(bucket_name)
    blob = bucket.blob(blob_name)

    blob.make_public()

    print('Blob {} is publicly accessible at {}'.format(
        blob.name, blob.public_url))

Ruby

Cloud Storage クライアントのインストールと作成の詳細については、Cloud Storage クライアント ライブラリをご覧ください。

GitHub で表示 フィードバック

# project_id  = "Your Google Cloud project ID"
# bucket_name = "Your Google Cloud Storage bucket name"
# file_name   = "Name of file in Google Cloud Storage to make public"

require "google/cloud/storage"

storage = Google::Cloud::Storage.new project: project_id
bucket  = storage.bucket bucket_name
file    = bucket.file file_name

file.acl.public!

puts "#{file.name} is publicly accessible at #{file.public_url}"

REST API

JSON API

1. OAuth 2.0 Playground から承認アクセス トークンを取得します。固有の OAuth 認証情報を使用するように Playground を構成します。
2. 次の情報が含まれる .json ファイルを作成します。

{
  "entity": "allUsers",
  "role": "READER"
}

3. cURL を使用して、JSON API を Insert ACL リクエストで呼び出します。www.example.com のインデックス ページの場合:

   curl -X POST --data-binary @public-read.json \
       -H "Authorization: Bearer ya29.AHES6ZRVmB7fkLtd1XTmq6mo0S1wqZZi3-Lh_s-6Uw7p8vtgSwg" \
       -H "Content-type: application/json" \
       "https://www.googleapis.com/storage/v1/b/www.example.com/o/index.html/acl"

XML API

1. OAuth 2.0 Playground から承認アクセス トークンを取得します。固有の OAuth 認証情報を使用するように Playground を構成します。
2. 次の情報を含む .xml ファイルを作成します。

<AccessControlList>
  <Entries>
<Entry>
  <Scope type="AllUsers"/>
  <Permission>READ</Permission>
</Entry>
  </Entries>
</AccessControlList>

3. cURL を使用して、XML API を Set Object ACL リクエストで呼び出します。www.example.com のインデックス ページの場合:

   curl -X PUT --data-binary @[XML_FILE_NAME].xml \
       -H "Authorization: Bearer ya29.AHES6ZRVmB7fkLtd1XTmq6mo0S1wqZZi3-Lh_s-6Uw7p8vtgSwg" \
       "https://storage.googleapis.com/www.example.com/index.html?acl"

注: バケットのデフォルト オブジェクト ACL を設定すると、バケットにアップロードする後続のファイルを自動的に共有できます。

注: 非公開または存在しないファイルの URL をリクエストすると、訪問者は http 403 レスポンス コードを受け取ります。http 404 レスポンス コードを使用するエラーページを追加する方法については、次のセクションをご覧ください。

（省略可）特殊ページの割り当て

インデックス ページの接尾辞やカスタム エラーページを割り当てることができます。インデックス ページの接尾辞は MainPageSuffix プロパティで、カスタム エラーページは NotFoundPage プロパティで制御します。これらの割り当てはオプションです。

インデックス ページ

インデックス ページ（ウェブサーバー ディレクトリ インデックスともいいます）は、訪問者が関連ファイルのない URL をリクエストしたときに返されるファイルです。MainPageSuffix を割り当てると、Cloud Storage は、訪問者からリクエストされた URL と名前の接頭辞が一致するファイルを探します。

たとえば、静的ウェブサイトの MainPageSuffix を index.html に設定したとします。また、バケット www.example.com に directory という名前のファイルがないとします。このような状況でユーザーが URL http://www.example.com/directory をリクエストすると、Cloud Storage はファイル www.example.com/directory/index.html を提供しようとします。このファイルも存在しない場合、Cloud Storage はエラーページを返します。

MainPageSuffix は、ユーザーがトップレベルのサイトをリクエストした場合に提供されるファイルも制御します。上の例の場合、ユーザーが http://www.example.com をリクエストすると、Cloud Storage はファイル www.example.com/index.html を提供しようとします。

エラー ページ

エラーページは、既存のファイルに対応しない URL をリクエストした静的サイトの訪問者に返されるファイルです。MainPageSuffix を割り当てた場合、リクエストされた名前のファイルがなく、該当するインデックス ページもない場合にのみ、Cloud Storage はエラーページを返します。

エラーページを返す場合、http レスポンス コードは 404 になります。エラーページとして機能するファイルを制御するプロパティは NotFoundPage です。NotFoundPage を設定しない場合、ユーザーに一般的なエラーページが表示されます。

MainPageSuffix と NotFoundPage の設定

次のサンプルでは、MainPageSuffix を index.html に設定し、NotFoundPage を 404.html に設定します。

Console

1. Google Cloud Platform Console で Cloud Storage ブラウザを開きます。
   Cloud Storage ブラウザを開く

2. バケットのリストで、作成したバケットを見つけます。

3. バケットの横にあるその他アイコン をクリックし、[ウェブサイトの設定を編集] を選択します。

   注: このオプションは、名前が有効なウェブサイト パターンに一致するバケットでのみ使用できます。

4. [ウェブサイトの設定] ダイアログで、[メインページ] と [404（ページが見つかりません）ページ] を指定します。

5. [保存] をクリックします。

注: これらの設定の表示、変更、削除は [ウェブサイトの設定を編集] メニューで行います。

gsutil

gsutil web set コマンドを使用して、MainPageSuffix プロパティに -m フラグを設定し、NotFoundPage に -e フラグを設定します。

gsutil web set -m index.html -e 404.html gs://www.example.com

成功した場合、次の内容が返されます。

Setting website config on gs://www.example.com/...

注: これらの設定を変更または削除するには、追加の gsutil web set コマンドを使用します。これらの設定を表示するには、gsutil web get コマンドを使用します。

REST API

JSON API

1. OAuth 2.0 Playground から承認アクセス トークンを取得します。固有の OAuth 認証情報を使用するように Playground を構成します。
2. .json ファイルを作成して、website オブジェクトの mainPageSuffix プロパティと notFoundPage プロパティを目的のページに設定します。

   {
     "website":{
   "mainPageSuffix": "index.html",
   "notFoundPage": "404.html"
     }
   }

3. cURL を使用して、JSON API を PATCH Bucket リクエストで呼び出します。www.example.com の場合:

   curl -X PATCH --data-binary @web-config.json \
    -H "Authorization: Bearer ya29.AHES6ZRVmB7fkLtd1XTmq6mo0S1wqZZi3-Lh_s-6Uw7p8vtgSwg" \
    -H "Content-Type: application/json" \
    "https://www.googleapis.com/storage/v1/b/www.example.com"

XML API

1. OAuth 2.0 Playground から承認アクセス トークンを取得します。固有の OAuth 認証情報を使用するように Playground を構成します。
2. .xml ファイルを作成して、WebsiteConfiguration 要素の MainPageSuffix 要素と NotFoundPage 要素を目的のページに設定します。

   <WebsiteConfiguration>
     <MainPageSuffix>index.html</MainPageSuffix>
     <NotFoundPage>404.html</NotFoundPage>
   </WebsiteConfiguration>

3. cURL を使用して、XML API を PUT Bucket リクエストと websiteConfig クエリ文字列パラメータで呼び出します。www.example.com の場合:

   curl -X PUT --data-binary @web-config.xml \
       -H "Authorization: Bearer ya29.AHES6ZRVmB7fkLtd1XTmq6mo0S1wqZZi3-Lh_s-6Uw7p8vtgSwg" \
       https://storage.googleapis.com/www.example.com?websiteConfig

注: これらの設定を変更または削除するには、追加の PUT リクエストを使用します。これらの設定を表示するには、GET リクエストを使用します。

ウェブサイトのテスト

ブラウザでドメイン名をリクエストして、コンテンツがバケットから配信されていることを確認します。確認するときに、オブジェクトのパスを指定します。MainPageSuffix プロパティを設定している場合は、ドメイン名だけで実行できます。

たとえば、www.example.com という名前のバケットに test.html という名前のオブジェクトを保存している場合、ブラウザで www.example.com/test.html にアクセスしてアクセス可能かどうかを確認します。

クリーンアップ

静的ウェブサイトのホストのチュートリアルが終了したら、Google Cloud Platform で作成したリソースについて料金が発生しないようにクリーンアップすることができます。次のセクションでは、これらのリソースを削除またはオフにする方法について説明します。

プロジェクトの削除

課金を停止する最も簡単な方法は、チュートリアル用に作成したプロジェクトを削除することです。

プロジェクトを削除する手順は次のとおりです。

警告: プロジェクトを削除すると、以下のようになります。

• 既存のプロジェクトを使った場合、プロジェクトで行っていた、他の作業も削除されます。
• 削除されたプロジェクトのプロジェクト ID は再使用できません。将来使用する予定のカスタム プロジェクト ID を作成していた場合は、代わりに、プロジェクト内のリソースを削除してください。これにより、appspot.com URL のようなプロジェクト ID を使用する URL をそのまま使用できます。

複数のチュートリアルとクイックスタートを使用しているときは、プロジェクトを削除するのではなく、再利用することで、プロジェクトの割り当て制限を超過しないようにすることができます。

1. GCP Console で [プロジェクト] ページに移動します。

   プロジェクト ページに移動

2. プロジェクト リストで、削除するプロジェクトを選択し、[プロジェクトの削除] をクリックします。
3. ダイアログでプロジェクト ID を入力し、[シャットダウン] をクリックしてプロジェクトを削除します。

バケットの削除

プロジェクト全体を削除する場合は、ウェブサイトのホストに使用したバケットを削除します。

Console

1. Google Cloud Platform Console で Cloud Storage ブラウザを開きます。
   Cloud Storage ブラウザを開く

2. 削除するバケットのチェックボックスをオンにします。

3. [削除] をクリックします。

4. 上に重なったウィンドウで、[削除] をクリックして、バケットのそのコンテンツを削除することを確認します。

gsutil

バケットとその内容を削除するには、gsutil rm コマンドを -r フラグとともに使用します。

gsutil rm -r gs://www.example.com

次の例のようなレスポンスになります。

Removing gs://www.example.com/...

コードサンプル

C#

Cloud Storage クライアントのインストールと作成の詳細については、Cloud Storage クライアント ライブラリをご覧ください。

GitHub で表示 フィードバック

private void DeleteBucket(string bucketName)
{
    var storage = StorageClient.Create();
    storage.DeleteBucket(bucketName);
    Console.WriteLine($"Deleted {bucketName}.");
}

Go

Cloud Storage クライアントのインストールと作成の詳細については、Cloud Storage クライアント ライブラリをご覧ください。

GitHub で表示 フィードバック

if err := client.Bucket(bucketName).Delete(ctx); err != nil {
	return err
}

Java

Cloud Storage クライアントのインストールと作成の詳細については、Cloud Storage クライアント ライブラリをご覧ください。

GitHub で表示 フィードバック

boolean deleted = bucket.delete(BucketSourceOption.metagenerationMatch());
if (deleted) {
  // the bucket was deleted
} else {
  // the bucket was not found
}

Node.js

Cloud Storage クライアントのインストールと作成の詳細については、Cloud Storage クライアント ライブラリをご覧ください。

GitHub で表示 フィードバック

// Imports the Google Cloud client library
const Storage = require('@google-cloud/storage');

// Creates a client
const storage = new Storage();

/**
 * TODO(developer): Uncomment the following line before running the sample.
 */
// const bucketName = 'Name of a bucket, e.g. my-bucket';

// Deletes the bucket
storage
  .bucket(bucketName)
  .delete()
  .then(() => {
    console.log(`Bucket ${bucketName} deleted.`);
  })
  .catch(err => {
    console.error('ERROR:', err);
  });

PHP

Cloud Storage クライアントのインストールと作成の詳細については、Cloud Storage クライアント ライブラリをご覧ください。

GitHub で表示 フィードバック

use Google\Cloud\Storage\StorageClient;

/**
 * Delete a Cloud Storage Bucket.
 *
 * @param string $bucketName the name of the bucket to delete.
 *
 * @return void
 */
function delete_bucket($bucketName)
{
    $storage = new StorageClient();
    $bucket = $storage->bucket($bucketName);
    $bucket->delete();
    printf('Bucket deleted: %s' . PHP_EOL, $bucket->name());
}

Python

Cloud Storage クライアントのインストールと作成の詳細については、Cloud Storage クライアント ライブラリをご覧ください。

GitHub で表示 フィードバック

def delete_bucket(bucket_name):
    """Deletes a bucket. The bucket must be empty."""
    storage_client = storage.Client()
    bucket = storage_client.get_bucket(bucket_name)
    bucket.delete()
    print('Bucket {} deleted'.format(bucket.name))

Ruby

Cloud Storage クライアントのインストールと作成の詳細については、Cloud Storage クライアント ライブラリをご覧ください。

GitHub で表示 フィードバック

# project_id  = "Your Google Cloud project ID"
# bucket_name = "Name of your Google Cloud Storage bucket to delete"

require "google/cloud/storage"

storage = Google::Cloud::Storage.new project: project_id
bucket  = storage.bucket bucket_name

bucket.delete

puts "Deleted bucket: #{bucket.name}"

REST API

JSON API

空でないバケットは削除できないことに注意してください。

1. OAuth 2.0 Playground から承認アクセス トークンを取得します。固有の OAuth 認証情報を使用するように Playground を構成します。
2. cURL を使用して JSON API を呼び出します。[VALUES_IN_BRACKETS] は適切な値に置き換えます。

   curl -X DELETE -H "Authorization: Bearer [OAUTH2_TOKEN]" \
       "https://www.googleapis.com/storage/v1/b/www.example.com"

成功すると、レスポンスに 204 ステータス コードが含まれます。

詳しくは、Buckets: delete の JSON リファレンス ページをご覧ください。

XML API

空でないバケットは削除できないことに注意してください。

1. OAuth 2.0 Playground から承認アクセス トークンを取得します。固有の OAuth 認証情報を使用するように Playground を構成します。
2. cURL を使用して XML API を呼び出します。[VALUES_IN_BRACKETS] は適切な値に置き換えます。

   curl -X DELETE -H "Authorization: Bearer [OAUTH2_TOKEN]" \
       "https://storage.googleapis.com/www.example.com"

詳しくは、Delete Bucket の XML リファレンス ページをご覧ください。

次のステップ

• バケットを使用して静的ウェブサイトをホストする場合の設定例とヒントを確認する。
• 静的ウェブサイトをホストするためのトラブルシューティング セクションにアクセスする。
• 動的ウェブサイトの静的アセットのホストについて学習する。
• 「Cloud Storage Office Hours」で静的ウェブサイトのホスティングについて詳しく学習する。
• すべてのウェブサービス オプションを学習する。
• Google Cloud Platform のその他の機能を試す。チュートリアルをご覧ください。