Statische Website hosten

In dieser Anleitung wird beschrieben, wie Sie einen Cloud Storage-Bucket konfigurieren, um eine statische Website für eine Domain, die Ihnen gehört, zu hosten. Statische Webseiten können clientseitige Technologien wie HTML, CSS und JavaScript enthalten, jedoch keine dynamischen Inhalte wie serverseitige Skripts (z. B. PHP). Weitere Informationen zu statischen Webseiten erhalten Sie unter Statische Website. Auf dieser Seite finden Sie auch Beispiele und Tipps.

Diese Anleitung gilt auch für das Hosten statischer Inhalte für eine dynamische Website.

Achtung: In dieser Anleitung wird HTTP verwendet. Wir empfehlen jedoch, keine Inhalte mit vertraulichen oder privaten Daten über HTTP aus Ihrem Cloud Storage-Bucket bereitzustellen. Informationen zum Bereitstellen von Inhalten in einer benutzerdefinierten Domain über HTTPS finden Sie im entsprechenden Thema zur Fehlerbehebung.

Ziele

In dieser Anleitung werden Sie:

• Ihre Domain mithilfe eines CNAME-Eintrags auf Cloud Storage ausrichten.
• einen Bucket erstellen, der mit Ihrer Domain verknüpft ist.
• Dateien in Ihre Website hochladen und freigeben.
• die Website testen.

Kosten

In dieser Anleitung wird die folgende kostenpflichtige Komponente von Google Cloud verwendet:

• Cloud Storage

Informationen zu den Gebühren, die beim Hosting einer statischen Website anfallen können, finden Sie im Tipp "Speicherkosten im Blick behalten". Informationen zu Cloud Storage-Kosten erhalten Sie in der Preisübersicht.

Hinweise

1. Melden Sie sich bei Ihrem Google-Konto an.

   Wenn Sie noch kein Konto haben, registrieren Sie sich hier für ein neues Konto.

2. Wählen Sie in der Cloud Console auf der Projektauswahlseite ein Cloud-Projekt aus oder erstellen Sie eines.

   Hinweis: Wenn Sie die Ressourcen, die Sie in diesem Verfahren erstellen, nicht behalten möchten, erstellen Sie ein Projekt, anstatt ein vorhandenes Projekt auszuwählen. Wenn Sie fertig sind, können Sie das Projekt löschen und dadurch alle mit dem Projekt verknüpften Ressourcen entfernen.

   Zur Projektauswahl

3. Die Abrechnung für das Google Cloud-Projekt muss aktiviert sein. So prüfen Sie, ob die Abrechnung für Ihr Projekt aktiviert ist.

4. Haben oder verwalten Sie eine Domain? Wenn Sie noch keine Domain haben, können Sie eine neue registrieren. Dazu stehen Ihnen viele Dienste wie Google Domains zur Verfügung.

   In dieser Anleitung wird die Domain example.com verwendet.

5. Sie müssen der Inhaber oder Verwalter der Domain sein, die Sie verwenden möchten. Verifizieren Sie unbedingt die Top-Level-Domain wie example.com und keine Subdomain wie www.example.com.

   Hinweis: Wenn Sie Inhaber der Domain sind, die Sie einem Bucket zuordnen, haben Sie diesen Schritt möglicherweise bereits in der Vergangenheit durchgeführt. Wenn Sie Ihre Domain über Google Domains erworben haben, erfolgt die Überprüfung automatisch.

Domain mit Cloud Storage verbinden

Erstellen Sie zum Verbinden der Domain mit Cloud Storage einen CNAME-Eintrag über Ihren Domainregistrierungsdienst. Ein CNAME-Eintrag ist ein DNS-Datensatztyp. Mit diesem Eintrag wird Traffic, mit dem eine URL Ihrer Domain angefordert wird, an die Ressourcen, die Sie bereitstellen möchten, weitergeleitet, in diesem Fall Objekte in Ihren Cloud Storage-Buckets. Für www.example.com könnte der CNAME-Eintrag die folgenden Informationen enthalten:

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

Weitere Informationen zu CNAME-Weiterleitungen finden Sie unter URI für CNAME-Aliasing.

So stellen Sie die Verbindung Ihrer Domain mit Cloud Storage her:

1. Erstellen Sie einen CNAME-Eintrag, der auf c.storage.googleapis.com. verweist.

   Ihr Domainregistrierungsdienst sollte Ihnen die Möglichkeit bieten, Ihre Domain zu verwalten und unter anderem auch einen CNAME-Eintrag hinzuzufügen. Wenn Sie beispielsweise Google Domains verwenden, lesen Sie die Anleitung zum Hinzufügen eines CNAME-Eintrags auf der Hilfeseite von Google Domains.

   Hinweis: Im DNS wird das Erstellen eines CNAME-Eintrags für eine Stammdomain wie example.com nicht unterstützt. Sie müssen daher in den meisten Fällen den CNAME-Eintrag für eine Subdomain wie www.example.com oder myblog.example.com erstellen. Einige DNS-Anbieter bieten ein nicht standardmäßiges Feature an, mit dem eine Stammdomain per Alias einem anderen Namen ohne Verwendung von CNAME zugewiesen werden kann. Informieren Sie sich in der Dokumentation Ihres DNS-Anbieters, ob ein solches Feature verfügbar ist.

Bucket erstellen

Erstellen Sie einen Bucket, dessen Name mit dem CNAME übereinstimmt, den Sie für Ihre Domain erstellt haben.

Wenn Sie beispielsweise einen CNAME-Eintrag hinzugefügt haben, der www.example.com auf c.storage.googleapis.com. verweist, erstellen Sie einen Bucket mit dem Namen "www.example.com".

So erstellen Sie einen Bucket:

Console

1. Öffnen Sie den Cloud Storage-Browser in der Google Cloud Console.
   Zum Cloud Storage-Browser

2. Klicken Sie auf Bucket erstellen, um das Formular zum Erstellen eines Buckets zu öffnen.

3. Geben Sie die Bucket-Informationen ein und klicken Sie zum Ausführen der einzelnen Schritte auf Weiter:

   • Der Name Ihres Buckets, der dem CNAME entspricht, den Sie für Ihre Domain erstellt haben.

   • Die Speicherklasse und den Standort des Buckets.

   • Das Zugriffssteuerungsmodell des Buckets.

4. Klicken Sie auf Erstellen.

Wenn der Vorgang erfolgreich war, werden Sie zur Seite des Buckets mit dem Text "Es befinden sich keine Liveobjekte in diesem Bucket." weitergeleitet.

gsutil

Führen Sie folgenden gsutil mb-Befehl aus:

gsutil mb gs://www.example.com

Wenn der Vorgang erfolgreich ist, gibt der Befehl Folgendes zurück:

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

Codebeispiele

C++

Weitere Informationen finden Sie in der Referenzdokumentation zur Cloud Storage C++ API.

Auf GitHub ansehen Feedback

namespace gcs = google::cloud::storage;
using ::google::cloud::StatusOr;
[](gcs::Client client, std::string bucket_name) {
  StatusOr<gcs::BucketMetadata> bucket_metadata =
      client.CreateBucket(bucket_name, gcs::BucketMetadata());

  if (!bucket_metadata) {
    throw std::runtime_error(bucket_metadata.status().message());
  }

  std::cout << "Bucket " << bucket_metadata->name() << " created."
            << "\nFull Metadata: " << *bucket_metadata << "\n";
}

C#

Weitere Informationen finden Sie in der Referenzdokumentation zur Cloud Storage C# API.

Auf GitHub ansehen Feedback

public static Bucket StorageCreateBucket(string projectId, string bucketName)
{
    var storage = StorageClient.Create();
    var bucket = storage.CreateBucket(projectId, bucketName);
    Console.WriteLine($"Created {bucketName}.");
    return bucket;
}

Go

Weitere Informationen finden Sie in der Referenzdokumentation zur Cloud Storage Go API.

Auf GitHub ansehen Feedback

ctx := context.Background()
bucket := client.Bucket(bucketName)

ctx, cancel := context.WithTimeout(ctx, time.Second*10)
defer cancel()
if err := bucket.Create(ctx, projectID, &storage.BucketAttrs{
	StorageClass: "COLDLINE",
	Location:     "asia",
}); err != nil {
	return err
}

Java

Weitere Informationen finden Sie in der Referenzdokumentation zur Cloud Storage Java API.

Auf GitHub ansehen Feedback

import com.google.cloud.storage.Bucket;
import com.google.cloud.storage.BucketInfo;
import com.google.cloud.storage.Storage;
import com.google.cloud.storage.StorageClass;
import com.google.cloud.storage.StorageOptions;

public class CreateBucketWithStorageClassAndLocation {
  public static void createBucketWithStorageClassAndLocation(String projectId, String bucketName) {
    // The ID of your GCP project
    // String projectId = "your-project-id";

    // The ID to give your GCS bucket
    // String bucketName = "your-unique-bucket-name";

    Storage storage = StorageOptions.newBuilder().setProjectId(projectId).build().getService();

    // See the StorageClass documentation for other valid storage classes:
    // https://googleapis.dev/java/google-cloud-clients/latest/com/google/cloud/storage/StorageClass.html
    StorageClass storageClass = StorageClass.COLDLINE;

    // See this documentation for other valid locations:
    // http://g.co/cloud/storage/docs/bucket-locations#location-mr
    String location = "asia";

    Bucket bucket =
        storage.create(
            BucketInfo.newBuilder(bucketName)
                .setStorageClass(storageClass)
                .setLocation(location)
                .build());

    System.out.println(
        "Created bucket "
            + bucket.getName()
            + " in "
            + bucket.getLocation()
            + " with storage class "
            + bucket.getStorageClass());
  }
}

Node.js

Weitere Informationen finden Sie in der Referenzdokumentation zur Cloud Storage Node.js API.

Auf GitHub ansehen Feedback

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

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

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

async function createBucket() {
  // Creates a new bucket in the Asia region with the coldline default storage
  // class. Leave the second argument blank for default settings.
  //
  // For default values see: https://cloud.google.com/storage/docs/locations and
  // https://cloud.google.com/storage/docs/storage-classes

  const [bucket] = await storage.createBucket(bucketName, {
    location: 'ASIA',
    storageClass: 'COLDLINE',
  });

  console.log(`Bucket ${bucket.name} created.`);
}

createBucket().catch(console.error);

PHP

Weitere Informationen finden Sie in der Referenzdokumentation zur Cloud Storage PHP API.

Auf GitHub ansehen Feedback

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.
 *
 */
function create_bucket($bucketName, $options = [])
{
    $storage = new StorageClient();
    $bucket = $storage->createBucket($bucketName, $options);
    printf('Bucket created: %s' . PHP_EOL, $bucket->name());
}

Python

Weitere Informationen finden Sie in der Referenzdokumentation zur Cloud Storage Python API.

Auf GitHub ansehen Feedback

from google.cloud import storage

def create_bucket(bucket_name):
    """Creates a new bucket."""
    # bucket_name = "your-new-bucket-name"

    storage_client = storage.Client()

    bucket = storage_client.create_bucket(bucket_name)

    print("Bucket {} created".format(bucket.name))

Ruby

Weitere Informationen finden Sie in der Referenzdokumentation zur Cloud Storage Ruby API.

Auf GitHub ansehen Feedback

# 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
bucket  = storage.create_bucket bucket_name,
                                location:      location,
                                storage_class: storage_class

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

REST APIs

JSON API

1. Rufen Sie ein Zugriffstoken für die Autorisierung aus dem OAuth 2.0 Playground ab. Konfigurieren Sie den Playground so, dass Ihre eigenen OAuth-Anmeldedaten verwendet werden.

2. Erstellen Sie eine .json-Datei, in der Ihr Websitename dem Attribut name zugewiesen wird:

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

3. Verwenden Sie cURL, um die JSON API aufzurufen: Für 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://storage.googleapis.com/storage/v1/b?project=my-static-website"

XML API

1. Rufen Sie ein Zugriffstoken für die Autorisierung aus dem OAuth 2.0 Playground ab. Konfigurieren Sie den Playground so, dass Ihre eigenen OAuth-Anmeldedaten verwendet werden.

2. Verwenden Sie cURL, um die XML API aufzurufen und einen Bucket mit Ihrem Websitenamen zu erstellen. Für 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"

Dateien meiner Website hochladen

So fügen Sie Ihrem Bucket die Dateien hinzu, die auf Ihrer Website bereitgestellt werden sollen:

Console

1. Öffnen Sie den Cloud Storage-Browser in der Google Cloud Console.
   Zum Cloud Storage-Browser

2. Klicken Sie in der Liste der Buckets auf den Namen des Buckets, den Sie erstellt haben.

3. Klicken Sie auf dem Tab Objekte auf die Schaltfläche Dateien hochladen.

4. Gehen Sie im Dateidialogfeld zur gewünschten Datei und wählen Sie sie aus.

Wenn der Upload abgeschlossen ist, sollten Sie im Bucket den Dateinamen und Informationen zur Datei sehen.

gsutil

Verwenden Sie den Befehl gsutil cp, um Dateien in den Bucket zu kopieren. Kopieren Sie beispielsweise die Datei index.html aus ihrem aktuellen Speicherort Desktop:

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

Wenn der Vorgang erfolgreich ist, gibt der Befehl Folgendes zurück:

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

Codebeispiele

C++

Weitere Informationen finden Sie in der Referenzdokumentation zur Cloud Storage C++ API.

Auf GitHub ansehen Feedback

namespace gcs = google::cloud::storage;
using ::google::cloud::StatusOr;
[](gcs::Client client, std::string file_name, std::string bucket_name,
   std::string object_name) {
  // Note that the client library automatically computes a hash on the
  // client-side to verify data integrity during transmission.
  StatusOr<gcs::ObjectMetadata> metadata = client.UploadFile(
      file_name, bucket_name, object_name, gcs::IfGenerationMatch(0));
  if (!metadata) throw std::runtime_error(metadata.status().message());

  std::cout << "Uploaded " << file_name << " to object " << metadata->name()
            << " in bucket " << metadata->bucket()
            << "\nFull metadata: " << *metadata << "\n";
}

C#

Weitere Informationen finden Sie in der Referenzdokumentation zur Cloud Storage C# API.

Auf GitHub ansehen Feedback

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

Weitere Informationen finden Sie in der Referenzdokumentation zur Cloud Storage Go API.

Auf GitHub ansehen Feedback

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

ctx, cancel := context.WithTimeout(ctx, time.Second*50)
defer cancel()
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

Weitere Informationen finden Sie in der Referenzdokumentation zur Cloud Storage Java API.

Auf GitHub ansehen Feedback

import com.google.cloud.storage.BlobId;
import com.google.cloud.storage.BlobInfo;
import com.google.cloud.storage.Storage;
import com.google.cloud.storage.StorageOptions;
import java.io.IOException;
import java.nio.file.Files;
import java.nio.file.Paths;

public class UploadObject {
  public static void uploadObject(
      String projectId, String bucketName, String objectName, String filePath) throws IOException {
    // The ID of your GCP project
    // String projectId = "your-project-id";

    // The ID of your GCS bucket
    // String bucketName = "your-unique-bucket-name";

    // The ID of your GCS object
    // String objectName = "your-object-name";

    // The path to your file to upload
    // String filePath = "path/to/your/file"

    Storage storage = StorageOptions.newBuilder().setProjectId(projectId).build().getService();
    BlobId blobId = BlobId.of(bucketName, objectName);
    BlobInfo blobInfo = BlobInfo.newBuilder(blobId).build();
    storage.create(blobInfo, Files.readAllBytes(Paths.get(filePath)));

    System.out.println(
        "File " + filePath + " uploaded to bucket " + bucketName + " as " + objectName);
  }
}

Node.js

Weitere Informationen finden Sie in der Referenzdokumentation zur Cloud Storage Node.js API.

Auf GitHub ansehen Feedback

/**
 * 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';

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

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

async function uploadFile() {
  // Uploads a local file to the bucket
  await storage.bucket(bucketName).upload(filename, {
    // Support for HTTP requests made with `Accept-Encoding: gzip`
    gzip: true,
    // By setting the option `destination`, you can change the name of the
    // object you are uploading to a bucket.
    metadata: {
      // Enable long-lived HTTP caching headers
      // Use only if the contents of the file will never change
      // (If the contents will change, use cacheControl: 'no-cache')
      cacheControl: 'public, max-age=31536000',
    },
  });

  console.log(`${filename} uploaded to ${bucketName}.`);
}

uploadFile().catch(console.error);

PHP

Weitere Informationen finden Sie in der Referenzdokumentation zur Cloud Storage PHP API.

Auf GitHub ansehen Feedback

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

Weitere Informationen finden Sie in der Referenzdokumentation zur Cloud Storage Python API.

Verwenden Sie die Methode Blob.upload_from_file(), Blob.upload_from_filename() oder Blob.upload_from_string(), um ein Objekt hochzuladen.

Auf GitHub ansehen Feedback

from google.cloud import storage

def upload_blob(bucket_name, source_file_name, destination_blob_name):
    """Uploads a file to the bucket."""
    # bucket_name = "your-bucket-name"
    # source_file_name = "local/path/to/file"
    # destination_blob_name = "storage-object-name"

    storage_client = storage.Client()
    bucket = storage_client.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

Weitere Informationen finden Sie in der Referenzdokumentation zur Cloud Storage Ruby API.

Auf GitHub ansehen Feedback

# 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
bucket  = storage.bucket bucket_name

file = bucket.create_file local_file_path, storage_file_path

puts "Uploaded #{file.name}"

REST APIs

JSON API

1. Rufen Sie ein Zugriffstoken für die Autorisierung aus dem OAuth 2.0 Playground ab. Konfigurieren Sie den Playground so, dass Ihre eigenen OAuth-Anmeldedaten verwendet werden.

2. Verwenden Sie cURL, um die JSON API mit einer POST-Objektanfrage aufzurufen. Für die Indexseite von www.example.com:

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

XML API

1. Rufen Sie ein Zugriffstoken für die Autorisierung aus dem OAuth 2.0 Playground ab. Konfigurieren Sie den Playground so, dass Ihre eigenen OAuth-Anmeldedaten verwendet werden.

2. Verwenden Sie cURL, um die XML API mit einer PUT-Objektanfrage aufzurufen. Für die Indexseite von 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"

Hinweis: Wenn Sie eine vorhandene Website migrieren oder eine große Anzahl von Dateien kopieren, sollten Sie den Inhalt mit gsutil rsync verschieben. Sie können die Option -R verwenden, um Verzeichnisbäume rekursiv zu kopieren. Zum Synchronisieren eines lokalen Verzeichnisses mit dem Namen local-dir mit einem Bucket verwenden Sie beispielsweise:

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

Dateien freigeben

Mit der speziellen Kennung allUsers können Sie jedem im Internet Zugriff auf Ihre Dateien gewähren.

• Um alle Dateien in Ihrem Bucket öffentlich zugänglich zu machen, führen Sie die Schritte unter Alle Objekte in einem Bucket öffentlich lesbar machen aus.

  Achtung: Bevor Sie den Bucket öffentlich zugänglich machen, sollten Sie dafür sorgen, dass die Dateien im Bucket keine vertraulichen oder privaten Informationen enthalten.

• Wenn Sie einzelne Dateien im Bucket öffentlich zugänglich machen möchten, folgen Sie den Schritten unter Einzelne Objekte öffentlich lesbar machen.

  Hinweis: Sie können die Standard-Objekt-ACL für den Bucket festlegen, damit die Dateien, die zukünftig in den Bucket hochgeladen werden, standardmäßig öffentlich zugänglich sind.

Generell geht es einfacher und schneller, alle Dateien im Bucket öffentlich zugänglich zu machen.

Besucher erhalten einen http 403-Antwortcode, wenn sie die URL für eine nicht öffentliche oder nicht vorhandene Datei anfordern. Informationen zum Einfügen einer Fehlerseite mit einem http 404-Antwortcode finden Sie im nächsten Abschnitt.

Empfohlen: Spezialseiten zuweisen

Sie können ein Indexseitensuffix zuweisen, das vom Attribut MainPageSuffix und einer benutzerdefinierten Fehlerseite gesteuert wird, die wiederum vom Attribut NotFoundPage gesteuert wird. Beide Zuweisungen sind optional. Ohne eine Indexseite wird jedoch nichts angezeigt, wenn Nutzer auf Ihre Top-Level-Website (z. B. http://www.example.com) zugreifen.

Indexseiten

Eine Indexseite (auch als Webserververzeichnisindex bezeichnet) ist eine Datei, die Besuchern bereitgestellt wird, wenn diese eine URL ohne zugehörige Datei anfordern. Wenn Sie ein MainPageSuffix zuweisen, sucht Cloud Storage nach einer Datei mit diesem Namen, dessen Präfix der URL entspricht, die der Besucher angefordert hat.

Beispiel: Sie legen das MainPageSuffix Ihrer statischen Website auf index.html fest. Außerdem ist in Ihrem Bucket www.example.com keine Datei mit dem Namen directory vorhanden. Wenn ein Nutzer in dieser Situation die URL http://www.example.com/directory anfordert, versucht Cloud Storage, die Datei www.example.com/directory/index.html bereitzustellen. Ist diese Datei ebenfalls nicht vorhanden, gibt Cloud Storage eine Fehlerseite zurück.

Das MainPageSuffix steuert auch die Datei, die bereitgestellt wird, wenn Nutzer die Top-Level-Website anfordern. Wenn das oben genannte Beispiel weitergeführt wird und ein Nutzer http://www.example.com anfordert, versucht Cloud Storage, die Datei www.example.com/index.html bereitzustellen.

Weitere Informationen zu den Fällen, in denen die Indexseite bereitgestellt wird, finden Sie unter Website-Konfigurationsbeispiele. Wenn Sie beim Versuch, auf http://www.example.com/dir/ zuzugreifen, eine 301-HTTP-Antwort erhalten, lesen Sie die Seite zur Fehlerbehebung.

Fehlerseite

Die Fehlerseite ist die Datei, die an Besucher Ihrer statischen Website zurückgegeben wird, die eine URL anfordern, die keiner vorhandenen Datei entspricht. Wenn Sie ein MainPageSuffix zugewiesen haben, gibt Cloud Storage die Fehlerseite nur dann zurück, wenn weder eine Datei mit dem angeforderten Namen noch eine anwendbare Indexseite vorhanden ist.

Wenn eine Fehlerseite zurückgegeben wird, lautet der HTTP-Antwortcode 404. Das Attribut, das steuert, welche Datei als Fehlerseite dient, ist NotFoundPage. Wenn Sie NotFoundPage nicht festlegen, erhalten Nutzer eine generische Fehlerseite.

MainPageSuffix und NotFoundPage festlegen

Im folgenden Beispiel ist MainPageSuffix auf index.html und NotFoundPage auf 404.html festgelegt:

Console

1. Öffnen Sie den Cloud Storage-Browser in der Google Cloud Console.
   Zum Cloud Storage-Browser

2. Suchen Sie in der Liste der Buckets den Bucket, den Sie erstellt haben.

3. Klicken Sie auf das Dreipunkt-Menü () des Buckets und wählen Sie Websitekonfiguration bearbeiten aus.

   Hinweis: Diese Option ist nur für Buckets verfügbar, deren Name mit einem gültigen Websitemuster übereinstimmt.

4. Geben Sie im Dialogfeld zur Websitekonfiguration die Hauptseite und die Fehlerseite an.

5. Klicken Sie auf Speichern.

Hinweis: Sie können diese Einstellungen im Menü Websitekonfiguration bearbeiten ansehen, ändern oder entfernen.

gsutil

Verwenden Sie den Befehl gsutil web set, um das Attribut MainPageSuffix mit dem Flag -m und NotFoundPage mit dem Flag -e festzulegen:

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

Wenn der Vorgang erfolgreich ist, gibt der Befehl Folgendes zurück:

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

Hinweis: Sie können diese Einstellungen mit zusätzlichen gsutil web set-Befehlen ändern oder entfernen und mit dem gsutil web get-Befehl ansehen.

Codebeispiele

C++

Weitere Informationen finden Sie in der Referenzdokumentation zur Cloud Storage C++ API.

Auf GitHub ansehen Feedback

namespace gcs = google::cloud::storage;
using ::google::cloud::StatusOr;
[](gcs::Client client, std::string bucket_name, std::string main_page_suffix,
   std::string not_found_page) {
  StatusOr<gcs::BucketMetadata> original =
      client.GetBucketMetadata(bucket_name);

  if (!original) throw std::runtime_error(original.status().message());
  StatusOr<gcs::BucketMetadata> patched_metadata = client.PatchBucket(
      bucket_name,
      gcs::BucketMetadataPatchBuilder().SetWebsite(
          gcs::BucketWebsite{main_page_suffix, not_found_page}),
      gcs::IfMetagenerationMatch(original->metageneration()));

  if (!patched_metadata) {
    throw std::runtime_error(patched_metadata.status().message());
  }

  if (!patched_metadata->has_website()) {
    std::cout << "Static website configuration is not set for bucket "
              << patched_metadata->name() << "\n";
    return;
  }

  std::cout << "Static website configuration successfully set for bucket "
            << patched_metadata->name() << "\nNew main page suffix is: "
            << patched_metadata->website().main_page_suffix
            << "\nNew not found page is: "
            << patched_metadata->website().not_found_page << "\n";
}

Java

Weitere Informationen finden Sie in der Referenzdokumentation zur Cloud Storage Java API.

Auf GitHub ansehen Feedback

import com.google.cloud.storage.Bucket;
import com.google.cloud.storage.Storage;
import com.google.cloud.storage.StorageOptions;

public class SetBucketWebsiteInfo {
  public static void setBucketWesbiteInfo(
      String projectId, String bucketName, String indexPage, String notFoundPage) {
    // The ID of your GCP project
    // String projectId = "your-project-id";

    // The ID of your static website bucket
    // String bucketName = "www.example.com";

    // The index page for a static website bucket
    // String indexPage = "index.html";

    // The 404 page for a static website bucket
    // String notFoundPage = "404.html";

    Storage storage = StorageOptions.newBuilder().setProjectId(projectId).build().getService();
    Bucket bucket = storage.get(bucketName);
    bucket.toBuilder().setIndexPage(indexPage).setNotFoundPage(notFoundPage).build().update();

    System.out.println(
        "Static website bucket "
            + bucketName
            + " is set up to use "
            + indexPage
            + " as the index page and "
            + notFoundPage
            + " as the 404 page");
  }
}

REST APIs

JSON API

1. Rufen Sie ein Zugriffstoken für die Autorisierung aus dem OAuth 2.0 Playground ab. Konfigurieren Sie den Playground so, dass Ihre eigenen OAuth-Anmeldedaten verwendet werden.

2. Erstellen Sie eine .json-Datei, die die Attribute mainPageSuffix und notFoundPage in einem website-Objekt auf die gewünschten Seiten festlegt:

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

3. Verwenden Sie cURL, um die JSON API mit einer PATCH-Bucket-Anfrage aufzurufen. Für 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://storage.googleapis.com/storage/v1/b/www.example.com"

XML API

1. Rufen Sie ein Zugriffstoken für die Autorisierung aus dem OAuth 2.0 Playground ab. Konfigurieren Sie den Playground so, dass Ihre eigenen OAuth-Anmeldedaten verwendet werden.

2. Erstellen Sie eine .xml-Datei, die die Elemente MainPageSuffix und NotFoundPage in einem WebsiteConfiguration-Element auf die gewünschten Seiten festlegt:

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

3. Verwenden Sie cURL, um die XML API mit einer PUT-Bucket-Anfrage und dem Abfragestringparameter websiteConfig aufzurufen. Für 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

Hinweis: Sie können diese Einstellungen mit zusätzlichen PUT-Anfragen ändern oder entfernen und mit einer GET-Anfrage ansehen.

Website testen

Prüfen Sie, ob der Inhalt des Buckets bereitgestellt wird, indem Sie den Domainnamen in einem Browser anfordern. Sie können dazu einen Pfad zu einem Objekt oder nur den Domainnamen verwenden, sofern Sie das Attribut MainPageSuffix festlegen.

Wenn Sie beispielsweise prüfen möchten, ob ein Objekt mit dem Namen test.html in einem Bucket mit dem Namen www.example.com zugänglich ist, rufen Sie www.example.com/test.html in Ihrem Browser auf.

Bereinigen

Nachdem Sie die Anleitung zum Hosten einer statischen Website abgeschlossen haben, können Sie die Ressourcen, die Sie in Google Cloud erstellt haben, bereinigen, damit diese keine kostenpflichtigen Kontingente verbrauchen. In den folgenden Abschnitten erfahren Sie, wie Sie diese Ressourcen löschen oder deaktivieren.

Projekt löschen

Am einfachsten vermeiden Sie weitere Kosten, wenn Sie das zum Ausführen der Anleitung erstellte Projekt löschen.

So löschen Sie das Projekt:

Achtung: Das Löschen von Projekten hat folgende Auswirkungen:

• Alle Inhalte des Projekts werden gelöscht. Wenn Sie für diese Anleitung ein bereits bestehendes Projekt verwendet haben, werden auch alle anderen im Rahmen des Projekts erstellten Daten gelöscht.
• Benutzerdefinierte Projekt-IDs gehen verloren. Beim Erstellen dieses Projekts haben Sie möglicherweise eine benutzerdefinierte Projekt-ID erstellt, die Sie weiterhin verwenden möchten. Damit die URLs, die die Projekt-ID nutzen, z. B. eine appspot.com-URL, erhalten bleiben, sollten Sie ausgewählte Ressourcen innerhalb des Projekts statt das gesamte Projekt löschen.

Wenn Sie mehrere Anleitungen und Kurzanleitungen durcharbeiten möchten, können Sie die Überschreitung von Projektkontingenten verhindern, wenn Sie Projekte wiederverwenden.

1. Wechseln Sie in der Cloud Console zur Seite Ressourcen verwalten.

   Zur Seite "Ressourcen verwalten"

2. Wählen Sie in der Projektliste das Projekt aus, das Sie löschen möchten, und klicken Sie dann auf Löschen .
3. Geben Sie im Dialogfeld die Projekt-ID ein und klicken Sie auf Beenden, um das Projekt zu löschen.

Bucket löschen

Wenn Sie nicht das gesamte Projekt löschen möchten, löschen Sie den Bucket, den Sie für das Hosten Ihrer Website verwendet haben:

Console

1. Öffnen Sie den Cloud Storage-Browser in der Google Cloud Console.
   Zum Cloud Storage-Browser

2. Klicken Sie das Kästchen für den Bucket an, den Sie löschen möchten.

3. Klicken Sie auf Löschen.

4. Bestätigen Sie im eingeblendeten Fenster, dass Sie diesen Bucket und seinen Inhalt löschen möchten, indem Sie auf Löschen klicken.

gsutil

Verwenden Sie den Befehl gsutil rm mit dem Flag -r, um den Bucket und seinen Inhalt zu löschen:

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

Die Antwort sieht in etwa so aus:

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

Codebeispiele

C++

Weitere Informationen finden Sie in der Referenzdokumentation zur Cloud Storage C++ API.

Auf GitHub ansehen Feedback

namespace gcs = google::cloud::storage;
[](gcs::Client client, std::string bucket_name) {
  google::cloud::Status status = client.DeleteBucket(bucket_name);

  if (!status.ok()) throw std::runtime_error(status.message());
  std::cout << "The bucket " << bucket_name << " was deleted successfully.\n";
}

C#

Weitere Informationen finden Sie in der Referenzdokumentation zur Cloud Storage C# API.

Auf GitHub ansehen Feedback

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

Go

Weitere Informationen finden Sie in der Referenzdokumentation zur Cloud Storage Go API.

Auf GitHub ansehen Feedback

ctx := context.Background()

ctx, cancel := context.WithTimeout(ctx, time.Second*10)
defer cancel()
if err := client.Bucket(bucketName).Delete(ctx); err != nil {
	return err
}

Java

Weitere Informationen finden Sie in der Referenzdokumentation zur Cloud Storage Java API.

Auf GitHub ansehen Feedback

import com.google.cloud.storage.Bucket;
import com.google.cloud.storage.Storage;
import com.google.cloud.storage.StorageOptions;

public class DeleteBucket {
  public static void deleteBucket(String projectId, String bucketName) {
    // The ID of your GCP project
    // String projectId = "your-project-id";

    // The ID of the bucket to delete
    // String bucketName = "your-unique-bucket-name";

    Storage storage = StorageOptions.newBuilder().setProjectId(projectId).build().getService();
    Bucket bucket = storage.get(bucketName);
    bucket.delete();

    System.out.println("Bucket " + bucket.getName() + " was deleted");
  }
}

Node.js

Weitere Informationen finden Sie in der Referenzdokumentation zur Cloud Storage Node.js API.

Auf GitHub ansehen Feedback

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

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

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

async function deleteBucket() {
  // Deletes the bucket
  await storage.bucket(bucketName).delete();
  console.log(`Bucket ${bucketName} deleted.`);
}

deleteBucket().catch(console.error);

PHP

Weitere Informationen finden Sie in der Referenzdokumentation zur Cloud Storage PHP API.

Auf GitHub ansehen Feedback

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

Weitere Informationen finden Sie in der Referenzdokumentation zur Cloud Storage Python API.

Auf GitHub ansehen Feedback

from google.cloud import storage

def delete_bucket(bucket_name):
    """Deletes a bucket. The bucket must be empty."""
    # bucket_name = "your-bucket-name"

    storage_client = storage.Client()

    bucket = storage_client.get_bucket(bucket_name)
    bucket.delete()

    print("Bucket {} deleted".format(bucket.name))

Ruby

Weitere Informationen finden Sie in der Referenzdokumentation zur Cloud Storage Ruby API.

Auf GitHub ansehen Feedback

# bucket_name = "Name of your Google Cloud Storage bucket to delete"

require "google/cloud/storage"

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

bucket.delete

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

REST APIs

JSON API

Hinweis: Sie können den Bucket nur löschen, wenn er leer ist.

1. Rufen Sie ein Zugriffstoken für die Autorisierung aus dem OAuth 2.0 Playground ab. Konfigurieren Sie den Playground so, dass Ihre eigenen OAuth-Anmeldedaten verwendet werden.

2. Verwenden Sie cURL, um die JSON API mit einer DELETE-Bucket-Anfrage aufzurufen:

   curl -X DELETE \
     -H "Authorization: Bearer ya29.AHES6ZRVmB7fkLtd1XTmq6mo0S1wqZZi3-Lh_s-6Uw7p8vtgSwg" \
     "https://storage.googleapis.com/storage/v1/b/www.example.com"

Bei Erfolg enthält die Antwort den Statuscode 204.

XML API

Hinweis: Sie können den Bucket nur löschen, wenn er leer ist.

1. Rufen Sie ein Zugriffstoken für die Autorisierung aus dem OAuth 2.0 Playground ab. Konfigurieren Sie den Playground so, dass Ihre eigenen OAuth-Anmeldedaten verwendet werden.

2. Verwenden Sie cURL, um die XML API mit einer DELETE-Bucket-Anfrage aufzurufen:

   curl -X DELETE \
     -H "Authorization: Bearer ya29.AHES6ZRVmB7fkLtd1XTmq6mo0S1wqZZi3-Lh_s-6Uw7p8vtgSwg" \
     "https://storage.googleapis.com/www.example.com"

Weitere Informationen

• Beispiele und Tipps für statische Websites
• Fehlerbehebung beim Hosten einer statischen Website
• Erfahren Sie, wie Sie statische Inhalte für eine dynamische Website hosten.
• Informieren Sie sich bei der Cloud Storage-Sprechstunde genauer über das Hosten einer statischen Website.
• Websites bereitstellen
• Weitere Anleitungen der Google Cloud Platform mit Cloud Storage