JavaScript-Clientbibliothek verwenden

Auf dieser Seite wird gezeigt, wie Sie die Bibliothek google-apis-javascript-client mit Compute Engine verwenden. Verwenden Sie für diese Übung die JavaScript-Clientbibliothek, um Anfragen zu autorisieren und Compute Engine-Ressourcen außerhalb einer VM-Instanz zu erstellen, aufzulisten oder zu löschen.

Eine vollständige Liste der verfügbaren Clientbibliotheken, einschließlich weiterer Google-Clientbibliotheken und Open-Source-Bibliotheken von Drittanbietern, finden Sie auf der Seite "Clientbibliotheken".

Um diese Anleitung durchzuarbeiten, müssen Sie etwas Erfahrung mit HTML und JavaScript haben.

Vorbereitung

  • Wenn Sie neu bei Compute Engine sind, probieren Sie eine der Kurzanleitungen aus.
  • Um die JavaScript-Beispiele in dieser Anleitung auszuführen, richten Sie einen Webserver ein. Wenn Sie einen Laptop oder Desktop verwenden, können Sie einen Webserver wie etwa Apache oder Nginx auf Ihrem Computer installieren. Informationen zum Einrichten eines Webservers in einer Compute Engine-Instanz finden Sie unter Einfachen Apache-Webserver ausführen.

Einstieg

In diesem Beispiel wird beschrieben, wie die OAuth 2.0-Autorisierung in einer Webanwendung verwendet wird und wie Sie Instanzen mithilfe der Bibliothek google-api-javascript-client verwalten können. Am Ende dieser Übung sollten Sie in der Lage sein:

  • Ihre Anwendung zu autorisieren, Anfragen an die Compute Engine API zu senden
  • Instanzen einzufügen
  • Instanzen aufzulisten
  • Andere Ressourcen aufzulisten (Images, Maschinentypen, Zonen, Netzwerke, Firewalls und Vorgänge)
  • Instanzen zu löschen

Ein komplexeres Codebeispiel finden Sie auf der GitHub-Seite der GoogleCloudPlatform.

Die Client-Bibliothek laden

Um die JavaScript-Clientbibliothek in Ihrer Anwendung zu verwenden, müssen Sie diese zuerst laden. Die JavaScript-Clientbibliothek finden Sie unter:

https://apis.google.com/js/client.js

Erstellen Sie eine einfache HTML-Datei, mit der die Clientbibliothek geladen wird:

<!DOCTYPE html>
<html>
  <head>
   <meta charset='utf-8' />
   <link rel="stylesheet" src="style.css" />
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
   <script src="https://apis.google.com/js/client.js"></script>
 </head>
  <body>
  </body>
</html>

Anfragen autorisieren

Dieses Beispiel verwendet eine einfache API-Schlüssel- und Client-ID-Autorisierungsmethode. Zu Beginn werden alle Anwendungen von der Google Cloud Console verwaltet. Wenn Sie bereits eine registrierte Anwendung haben, können Sie die Client-ID und den Client-Schlüssel aus dieser Anwendung verwenden. Wenn Sie noch nicht über eine registrierte Anwendung verfügen oder eine neue Anwendung registrieren möchten:

  1. Wechseln Sie in der Google Cloud Console zur Seite "Anmeldedaten".

    Zur Seite "Anmeldedaten"

  2. Klicken Sie auf Anmeldedaten erstellen und wählen Sie OAuth-Client-ID aus.
  3. Wenn dies Ihre erste Anwendung ist, werden Sie aufgefordert, einen Zustimmungsbildschirm zu erstellen, der angezeigt wird, wenn Ihre Anwendungen Zugriff auf die Daten Ihrer Nutzer anfordern. Klicken Sie auf Zustimmungsbildschirm konfigurieren und füllen Sie das Formular mit Informationen zu Ihrer Anwendung aus. Speichern Sie die Änderungen.
  4. Wählen Sie auf der Seite "Client-ID erstellen" die Option Webanwendung und klicken Sie auf Erstellen.
  5. Geben Sie einen Namen für den Schlüssel an und geben Sie im Feld Autorisierte JavaScript-Quellen den Ursprungs-URI Ihrer Anwendung ein. Wenn Sie Ihre Anwendung beispielsweise auf myexampleapplication.com hosten, lautet der Ursprungs-URI http://myexampleapplication.com. Wenn Sie die Anwendung auf Ihrem Desktop oder Laptop testen, können Sie http://localhost verwenden.
  6. Klicken Sie auf Erstellen, um den Schlüssel zu erstellen.
  7. Speichern Sie Ihre Client-ID und den Clientschlüssel, damit Sie diese in Ihrer Anwendung verwenden können.

Verwenden Sie die Methode gapi.auth.authorize() zur Autorisierung Ihrer Anwendung und geben Sie Folgendes an:

  • Client-ID
  • Clientschlüssel in der API_KEY-Variablen
  • Eine Rückruffunktion

Die Methode bietet auch ein Feld immediate. Wenn Sie immediate auf true setzen, wird die Autorisierung im Hintergrund ausgeführt und dem Nutzer keine Aufforderung angezeigt.

Fügen Sie Ihrer HTML-Seite folgenden Code hinzu:

<!DOCTYPE html>
<html>
  <head>
   <meta charset='utf-8' />
   <link rel="stylesheet" src="style.css" />
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
   <script src="https://apis.google.com/js/client.js"></script>
   <script type="text/javascript">
     var PROJECT_ID = 'YOUR_PROJECT_ID';
     var CLIENT_ID = 'YOUR_CLIENT_ID';
     var API_KEY = 'YOUR_API_KEY';
     var SCOPES = 'https://www.googleapis.com/auth/compute';

     /**
      * Authorize Google Compute Engine API.
      */
     function authorization() {
       gapi.client.setApiKey(API_KEY);
       gapi.auth.authorize({
         client_id: CLIENT_ID,
         scope: SCOPES,
         immediate: false
       }, function(authResult) {
            if (authResult && !authResult.error) {
              window.alert('Auth was successful!');
            } else {
              window.alert('Auth was not successful');
            }
          }
       );
     }

     /**
      * Driver for sample application.
      */
     $(window).load(authorization);
    </script>
  </head>
  <body>
  </body>
</html>

Öffnen Sie Ihre Seite in einem Browser. Nach dem Laden der Seite werden Sie aufgefordert, die Anwendung zu autorisieren. Sobald die Anwendung erfolgreich autorisiert wurde, erscheint eine entsprechende Benachrichtigung.

Compute Engine API in der Anwendung initialisieren

Als Nächstes initialisieren Sie die API. Rufen Sie hierfür die Methode gapi.client.load() auf. Diese akzeptiert den API-Namen und die API-Versionsnummer als Parameter. Auf Ihrer HTML-Seite fügen Sie dann die Initialisierungsfunktion hinzu und rufen sie auf, nachdem Ihre Anwendung erfolgreich autorisiert wurde:

<!DOCTYPE html>
<html>
  <head>
   <meta charset='utf-8' />
   <link rel="stylesheet" src="style.css" />
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
   <script src="https://apis.google.com/js/client.js"></script>
   <script type="text/javascript">
     var PROJECT_ID = 'YOUR_PROJECT_ID';
     var CLIENT_ID = 'YOUR_CLIENT_ID';
     var API_KEY = 'YOUR_API_KEY';
     var SCOPES = 'https://www.googleapis.com/auth/compute';
     var API_VERSION = 'v1';

     /**
      * Load the Google Compute Engine API.
      */
     function initializeApi() {
       gapi.client.load('compute', API_VERSION);
     }

     /**
      * Authorize Google Compute Engine API.
      */
     function authorization() {
       gapi.client.setApiKey(API_KEY);
       gapi.auth.authorize({
         client_id: CLIENT_ID,
         scope: SCOPES,
         immediate: false
       }, function(authResult) {
            if (authResult && !authResult.error) {
              initializeApi();
            } else {
              window.alert('Auth was not successful');
            }
          }
       );
     }

     /**
      * Driver for sample application.
      */
     $(window).load(authorization);
    </script>
  </head>
  <body>
  </body>
</html>

Geschafft! Sie können nun anfangen, Requests an die API zu stellen.

Instanzen auflisten

Um sich mit einigen grundlegenden Vorgängen vertraut zu machen, fangen Sie mit der Erstellung von Requests zur Auflistung bestimmter Ressourcen an. Fügen Sie Ihrer Seite Folgendes hinzu:

  </head>
  <body>
    <header>
      <h1>Google Compute Engine JavaScript Client Library Application</h1>
    </header>
    <button onclick="listInstances()">List Instances</button>
  </body>
</html>

Definieren Sie nun die Funktion listInstances(). Verwenden Sie zum Auflisten von Instanzen die Methode gapi.client.compute.instances.list():

/**
 * Google Compute Engine API request to retrieve the list of instances in
 * your Google Compute Engine project.
 */
function listInstances() {
  var request = gapi.client.compute.instances.list({
    'project': DEFAULT_PROJECT,
    'zone': DEFAULT_ZONE
  });
  request.execute(function(resp) {
    // Code to handle response
  });
}

Zusätzlich zu den Feldern project und zone können Sie Felder für die maximale Ergebnisgröße, Filterinstanzen und andere Konfigurationen hinzufügen. Eine Liste aller möglichen Felder für diese Methode finden Sie im API Explorer und in der API-Dokumentation.

Die neue listInstances()-Funktion fügen Sie Ihrer Webseite wie folgt hinzu:

<!DOCTYPE html>
<html>
  <head>
   <meta charset='utf-8' />
   <link rel="stylesheet" src="style.css" />
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
   <script src="https://apis.google.com/js/client.js"></script>
   <script type="text/javascript">
     var PROJECT_ID = 'YOUR_PROJECT_ID';
     var CLIENT_ID = 'YOUR_CLIENT_ID';
     var API_KEY = 'YOUR_API_KEY';
     var SCOPES = 'https://www.googleapis.com/auth/compute';
     var API_VERSION = 'v1';
     
     var DEFAULT_PROJECT = PROJECT_ID;
     var DEFAULT_ZONE = 'ZONE_NAME'; // For example, us-central1-a
     

     /**
      * Load the Google Compute Engine API.
      */
     function initializeApi() {
       gapi.client.load('compute', API_VERSION);
     }

     /**
      * Authorize Google Compute Engine API.
      */
     function authorization() {
       gapi.client.setApiKey(API_KEY);
       gapi.auth.authorize({
         client_id: CLIENT_ID,
         scope: SCOPES,
         immediate: false
       }, function(authResult) {
            if (authResult && !authResult.error) {
              initializeApi();
            } else {
              window.alert('Auth was not successful');
            }
          }
       );
     }

     /**
      * Google Compute Engine API request to retrieve the list of instances in
      * your Google Compute Engine project.
      */
     function listInstances() {
       var request = gapi.client.compute.instances.list({
         'project': DEFAULT_PROJECT,
         'zone': DEFAULT_ZONE
       });
       executeRequest(request, 'listInstances');
     }

     /**
      * Executes your Google Compute Engine request object and, subsequently,
      * prints the response.
      * @param {gapi.client.request} request A Google Compute Engine request
      *     object issued from the Google APIs JavaScript client library.
      * @param {string} apiRequestName The name of the example API request.
      */
     function executeRequest(request, apiRequestName) {
       request.execute(function(resp) {
         newWindow = window.open(apiRequestName, '',
           'width=600, height=600, scrollbars=yes');
         newWindow.document.write('<h1>' + apiRequestName + '</h1> <br />' +
           '<pre>' + JSON.stringify(resp.result, null, ' ') + '</pre>');
         if (resp.error) {
           newWindow.document.write('<h1>Error:</h1>');
           newWindow.document.write('<pre>' +
             JSON.stringify(resp.error, null, ' ') + '</pre>');
         }
       });
     }

     /**
      * Driver for sample application.
      */
     $(window).load(authorization);
    </script>
  </head>
  <body>
    <header>
      <h1>Google Compute Engine JavaScript Client Library Application</h1>
    </header>
    <button onclick="listInstances()">List Instances</button>
  </body>
</html>

Aktualisieren Sie die Seite und klicken Sie auf die neue Schaltfläche Instanzen auflisten, die eine Liste von Instanzen anzeigt, die zu dem von Ihnen angegebenen Projekt gehören.

Ergebnisliste filtern

Ein nützliches Feature für das Auflisten von Ressourcen ist das Feld filter, das Ihre Ergebnisse anhand eines Ausdrucks filtert. So lassen sich beispielsweise beendete Instanzen mithilfe des folgenden Filterausdrucks ausschließen:

/**
 * Google Compute Engine API request to retrieve a filtered list
 *  of instances in  your Google Compute Engine project.
 */
function listInstancesWithFilter() {
  var request = gapi.client.compute.instances.list({
    'project': DEFAULT_PROJECT,
    'zone': DEFAULT_ZONE,
    'filter': 'status ne TERMINATED'
  });
  var apiRequestName = 'listInstancesWithFilter';
  executeRequest(request, apiRequestName);
}

Auflistung anderer Ressourcen

Verwenden Sie zum Auflisten anderer Ressourcen die folgenden Methoden:

Typ Methode
Zonen auflisten gapi.client.compute.zones.list()
Maschinentypen auflisten gapi.client.compute.machinetypes.list()
Globale Vorgänge auflisten gapi.client.compute.globalOperations.list()
Vorgänge pro Zone auflisten gapi.client.compute.zoneOperations.list()
Images auflisten gapi.client.compute.images.list()
Firewalls auflisten gapi.client.compute.firewalls.list()

Vorgänge auflisten

Es besteht die Möglichkeit, die folgenden Arten von Vorgängen aufzulisten:

  • Vorgänge pro Zone sind Vorgänge, die mit Ressourcen ausgeführt werden, die sich in einer bestimmten Zone befinden. Beispielsweise gehören Vorgänge an Festplatten und Instanzen zu den Vorgängen pro Zone.
  • Globale Vorgänge sind Vorgänge, die mit globalen Ressourcen durchgeführt werden, wie zum Beispiel Maschinentypen und Images.
  • .

Weitere Informationen zu zonenspezifischen und globalen Ressourcen finden Sie in der Übersicht der Regionen und Zonen.

Auflistung von Vorgängen pro Zone

Mit der Methode gapi.client.compute.zoneOperations.list() können Sie Vorgänge pro Zone auflisten:

/**
 * Google Compute Engine API request to retrieve the list of operations
 * (inserts, deletes, etc.) for your Google Compute Engine project.
 */
function listZoneOperations() {
  var request = gapi.client.compute.zoneOperations.list({
    'project': DEFAULT_PROJECT,
    'zone': DEFAULT_ZONE
  });
  executeRequest(request, 'listZoneOperations');
}

Fügen Sie Ihrer Webseite folgende Zeilen hinzu:

<!DOCTYPE html>
<html>
  <head>
   <meta charset='utf-8' />
   <link rel="stylesheet" src="style.css" />
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
   <script src="https://apis.google.com/js/client.js"></script>
   <script type="text/javascript">

     [...snip...]

     /**
      * Google Compute Engine API request to retrieve the list of operations
      * (inserts, deletes, etc.) for your Google Compute Engine project.
      */
     function listZoneOperations() {
       var request = gapi.client.compute.zoneOperations.list({
         'project': DEFAULT_PROJECT,
         'zone': DEFAULT_ZONE
       });
       executeRequest(request, 'listZoneOperations');
     }

     /**
      * Driver for sample application.
      */
     $(window).load(authorization);
    </script>
  </head>
  <body>
    <header>
      <h1>Google Compute Engine JavaScript Client Library Application</h1>
    </header>
    <button onclick="listInstances()">List Instances</button>
    <button onclick="listZoneOperations()">List Zone Operations</button>
  </body>
</html>
Globale Vorgänge auflisten

Mit der Methode gapi.client.compute.globalOperations.list() können Sie globale Vorgänge auflisten:

/**
 * Google Compute Engine API request to retrieve the list of global
 * operations (inserts, deletes, etc.) for your Google Compute Engine
 * project.
 */
function listGlobalOperations() {
  var request = gapi.client.compute.globalOperations.list({
    'project': DEFAULT_PROJECT
  });
  executeRequest(request, 'listGlobalOperations');
}

Fügen Sie Ihrer Seite folgende Zeilen hinzu:

<!DOCTYPE html>
<html>
  <head>
   <meta charset='utf-8' />
   <link rel="stylesheet" src="style.css" />
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
   <script src="https://apis.google.com/js/client.js"></script>
   <script type="text/javascript">

     [...snip...]
    
     /**
      * Google Compute Engine API request to retrieve the list of global
      * operations (inserts, deletes, etc.) for your Google Compute Engine
      * project.
      */
     function listGlobalOperations() {
       var request = gapi.client.compute.globalOperations.list({
         'project': DEFAULT_PROJECT
       });
       executeRequest(request, 'listGlobalOperations');
     }

     /**
      * Driver for sample application.
      */
     $(window).load(authorization);
    </script>
  </head>
  <body>
    <header>
      <h1>Google Compute Engine JavaScript Client Library Application</h1>
    </header>
    <button onclick="listInstances()">List Instances</button>
    <button onclick="listZoneOperations()">List Zone Operations</button>
    <button onclick="listGlobalOperations()">List Global Operations</button>
  </body>
</html>

Laufwerke hinzufügen

Bevor Sie eine Instanz erstellen können, müssen Sie einen bootfähigen nichtflüchtigen Speicher als Root-Laufwerk für die Instanz angeben. Verwenden Sie zum Hinzufügen eines Laufwerks die Methode gapi.client.compute.disks.insert() und geben Sie zusammen mit Ihrer Anfrage den Namen, die Größe, die Zone und das Quell-Image an:

/**
 * Google Compute Engine API request to insert a disk into your cluster.
 */
function insertDisk() {
  var request = gapi.client.compute.disks.insert({
    'project': DEFAULT_PROJECT,
    'zone': DEFAULT_ZONE,
    'sourceImage': DEFAULT_IMAGE_URL,
    'resource': {
      'name': DEFAULT_DISK_NAME
    }
  });
  executeRequest(request, 'insertDisk');
}

Fügen Sie Ihrer Webseite folgende Zeilen hinzu:

<!DOCTYPE html>
<html>
  <head>
   <meta charset='utf-8' />
   <link rel="stylesheet" src="style.css" />
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
   <script src="https://apis.google.com/js/client.js"></script>
   <script type="text/javascript">

     [...snip...]
     
     var DEFAULT_NAME = 'test-node';
     var GOOGLE_PROJECT = 'debian-cloud'; // project hosting a shared image
     var DEFAULT_DISK_NAME = DEFAULT_NAME;
     var DEFAULT_IMAGE_FAMILY = 'debian-9';

     var BASE_URL = 'https://www.googleapis.com/compute/' + API_VERSION;
     var PROJECT_URL = BASE_URL + '/projects/' + DEFAULT_PROJECT;
     var GOOGLE_PROJECT_URL = BASE_URL + '/projects/' + GOOGLE_PROJECT;
     var DEFAULT_DISK_URL = PROJECT_URL + '/zones/' + DEFAULT_ZONE +
       '/disks/' + DEFAULT_DISK_NAME;
     var DEFAULT_IMAGE_URL = GOOGLE_PROJECT_URL + '/global/images/family/' +
       DEFAULT_IMAGE_FAMILY;

     [...snip...]

     /**
      * Google Compute Engine API request to insert a disk into your cluster.
      */
     function insertDisk() {
       var request = gapi.client.compute.disks.insert({
         'project': DEFAULT_PROJECT,
         'zone': DEFAULT_ZONE,
         'sourceImage': DEFAULT_IMAGE_URL,
         'resource': {
           'name': DEFAULT_DISK_NAME
         }
       });
       executeRequest(request, 'insertDisk');
     }
     
     /**
      * Driver for sample application.
      */
     $(window).load(authorization);
    </script>
  </head>
  <body>
    <header>
      <h1>Google Compute Engine JavaScript Client Library Application</h1>
    </header>
    <button onclick="listInstances()">List Instances</button>
    <button onclick="listZoneOperations()">List Zone Operations</button>
    <button onclick="listGlobalOperations()">List Global Operations</button>
    <button onclick="insertDisk()">Add a Disk</button>
  </body>
</html>

Aktualisieren Sie Ihre Seite im Browser und klicken Sie auf die Schaltfläche Ein Laufwerk einfügen, um Ihre neue Festplatte zu erstellen.

Instanz hinzufügen

Verwenden Sie zum Hinzufügen einer Instanz die Methode gapi.client.compute.instances.insert() und geben Sie zusammen mit Ihrer Anfrage ein Image, eine Zone, einen Maschinentyp und ein Netzwerkschnittstellenobjekt an:

/**
 * Google Compute Engine API request to insert your instance
 */
function insertInstance() {
  resource = {
    'image': DEFAULT_IMAGE_URL,
    'name': DEFAULT_IMAGE_NAME,
    'machineType': DEFAULT_MACHINE_URL,
    'disks': [{
     'source': DEFAULT_DISK_URL,
     'type': 'PERSISTENT',
     'boot': true
    }],
    'networkInterfaces': [{
      'network': DEFAULT_NETWORK
    }]
  };
  var request = gapi.client.compute.instances.insert({
    'project': DEFAULT_PROJECT,
    'zone': DEFAULT_ZONE,
    'resource': resource
  });
  request.execute(function(resp) {
    // Code to handle response
  });
}
Jede Ressourcenseite gibt die verfügbaren Zonen, Images und Maschinentypen an, die Sie verwenden können. Führen Sie bei der Angabe bestimmter Ressourcen die vollständige URL für die Ressource an. Um beispielsweise ein Image anzugeben, müssen Sie wie im folgenden Beispiel die vollständige URL für das Image anführen:

https://www.googleapis.com/compute/v1/projects/debian-cloud/global/images/<image-name>

Die Links zu anderen Ressourcen umfassen:

Ressource Link
Maschinentypen https://www.googleapis.com/compute/v1/projects/<project-id>/global/machineTypes/<machine-name>
Zonen https://www.googleapis.com/compute/v1/projects/<project-id>/zones/<zone-name>
Netzwerk https://www.googleapis.com/compute/v1/projects/<project-id>/global/networks/<network-name>

Fügen Sie Ihrer Webseite folgende Zeilen hinzu:

<!DOCTYPE html>
<html>
  <head>
   <meta charset='utf-8' />
   <link rel="stylesheet" src="style.css" />
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
   <script src="https://apis.google.com/js/client.js"></script>
   <script type="text/javascript">

     [...snip...]
     
     var DEFAULT_IMAGE_NAME = DEFAULT_NAME;
     var DEFAULT_MACHINE_TYPE = 'e2-standard-2';

     var DEFAULT_MACHINE_URL = PROJECT_URL + '/zones/' + DEFAULT_ZONE +
       '/machineTypes/' + DEFAULT_MACHINE_TYPE;
     var DEFAULT_NETWORK = PROJECT_URL + '/global/networks/default';

     [...snip...]

     /**
      * Google Compute Engine API request to insert your instance
      */
     function insertInstance() {
       resource = {
         'image': DEFAULT_IMAGE_URL,
         'name': DEFAULT_IMAGE_NAME,
         'machineType': DEFAULT_MACHINE_URL,
         'disks': [{
          'source': DEFAULT_DISK_URL,
          'type': 'PERSISTENT',
          'boot': true
         }],
         'networkInterfaces': [{
           'network': DEFAULT_NETWORK
         }]
       };
       var request = gapi.client.compute.instances.insert({
         'project': DEFAULT_PROJECT,
         'zone': DEFAULT_ZONE,
         'resource': resource
       });
       executeRequest(request, 'insertInstance');
     }
     
     /**
      * Driver for sample application.
      */
     $(window).load(authorization);
    </script>
  </head>
  <body>
    <header>
      <h1>Google Compute Engine JavaScript Client Library Application</h1>
    </header>
    <button onclick="listInstances()">List Instances</button>
    <button onclick="listZoneOperations()">List Zone Operations</button>
    <button onclick="listGlobalOperations()">List Global Operations</button>
    <button onclick="insertDisk()">Add a Disk</button>
    <button onclick="insertInstance()">Add an Instance</button>
  </body>
</html>

Aktualisieren Sie Ihre Webseite im Browser und klicken Sie auf die Schaltfläche Instanz einfügen, um Ihre neue Instanz zu erstellen. Klicken Sie auf die Schaltfläche Instanzen auflisten, um Ihre neue Instanz in der Instanzenliste anzusehen.

Instanzen mit Metadaten hinzufügen

Beim Erstellen einer Instanz können Sie auch benutzerdefinierte Metadaten übergeben. Sie können alle Arten von benutzerdefinierten Metadaten definieren, aber besonders nützlich sind benutzerdefinierte Metadaten für die Ausführung von Startskripts. Fügen Sie wie unten gezeigt das Feld metadata Ihrem Code hinzu, um eine Instanz mit benutzerdefinierten Metadaten zu erstellen:

/**
 * Google Compute Engine API request to insert your instance with metadata
 */
function insertInstanceWithMetadata() {
  resource = {
    'image': DEFAULT_IMAGE_URL,
'name': 'node-with-metadata',
'machineType': DEFAULT_MACHINE_URL,
'disks': [{
 'source': DEFAULT_DISK_URL,
 'type': 'PERSISTENT',
 'boot': true
}],
'networkInterfaces': [{
  'network': DEFAULT_NETWORK
}],
'metadata': {
  'items': [{
    'value': 'apt -y install apache2',
    'key': 'startup-script'
  }]
}
  };
  var request = gapi.client.compute.instances.insert({
    'project': DEFAULT_PROJECT,
    'zone': DEFAULT_ZONE,
    'resource': resource
  });
  executeRequest(request, 'insertInstance');
}

Die Metadaten für diese Instanz definieren ein Startskript, das apache2 installiert.

Instanz abrufen

Verwenden Sie zum Abrufen von Informationen zu einer Instanz die Methode gapi.client.compute.instances.get() und geben Sie die Felder instance und project an:

/**
 * Google Compute Engine API request to get your instance
 */
function getInstance() {
  var request = gapi.client.compute.instances.get({
    'project': DEFAULT_PROJECT,
    'zone': DEFAULT_ZONE,
    'instance': DEFAULT_IMAGE_NAME
  });
  request.execute(function(resp) {
    // Code to handle response
  });
}

Fügen Sie Ihrer Seite folgende Zeilen hinzu:

<!DOCTYPE html>

  <head>
   <meta charset='utf-8' />
   <link rel="stylesheet" src="style.css" />
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
   <script src="https://apis.google.com/js/client.js"></script>
   <script type="text/javascript">

     [...snip...]
    
     /**
      * Google Compute Engine API request to get your instance
      */
     function getInstance() {
       var request = gapi.client.compute.instances.get({
         'project': DEFAULT_PROJECT,
         'zone': DEFAULT_ZONE,
         'instance': DEFAULT_IMAGE_NAME
       });
       executeRequest(request, 'getInstance');
     }
    
     /**
      * Driver for sample application.
      */
     $(window).load(authorization);
    </script>
  </head>
  <body>
    <header>
      <h1>Google Compute Engine JavaScript Client Library Application</h1>
    </header>
    <button onclick="listInstances()">List Instances</button>
    <button onclick="listZoneOperations()">List Zone Operations</button>
    <button onclick="listGlobalOperations()">List Global Operations</button>
    <button onclick="insertDisk()">Insert a Disk</button>
    <button onclick="insertInstance()">Insert an Instance</button>
    <button onclick="getInstance()">Get an Instance</button>
  </body>
</html>

Aktualisieren Sie Ihre Seite und klicken Sie auf die Schaltfläche Eine Instanz erhalten.

Instanz löschen

Verwenden Sie zum Löschen einer Instanz die Methode gapi.client.compute.instances.delete() und geben Sie den Instanznamen und die Projekt-ID an:

/**
 * Google Compute Engine API request to delete your instance
 */
function deleteInstance() {
  var request = gapi.client.compute.instances.delete({
    'project': DEFAULT_PROJECT,
    'zone': DEFAULT_ZONE,
    'instance': DEFAULT_IMAGE_NAME
  });
  request.execute(function(resp) {
    // Code to handle response
  });
}

Fügen Sie Ihrer Seite folgende Zeilen hinzu:

<!DOCTYPE html>
<html>
  <head>
   <meta charset='utf-8' />
   <link rel="stylesheet" src="style.css" />
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
   <script src="https://apis.google.com/js/client.js"></script>
   <script type="text/javascript">

     [...snip...]
    
     /**
      * Google Compute Engine API request to delete your instance
      */
     function deleteInstance() {
       var request = gapi.client.compute.instances.delete({
         'project': DEFAULT_PROJECT,
         'zone': DEFAULT_ZONE,
         'instance': DEFAULT_IMAGE_NAME
       });
       executeRequest(request, 'deleteInstance');
     }
    
     /**
      * Driver for sample application.
      */
     $(window).load(authorization);
    </script>
  </head>
  <body>
    <header>
      <h1>Google Compute Engine JavaScript Client Library Application</h1>
    </header>
    <button onclick="listInstances()">List Instances</button>
    <button onclick="listZoneOperations()">List Zone Operations</button>
    <button onclick="listGlobalOperations()">List Global Operations</button>
    <button onclick="insertDisk()">Insert a Disk</button>
    <button onclick="insertInstance()">Insert an Instance</button>
    <button onclick="getInstance()">Get an Instance</button>
    <button onclick="deleteInstance()">Delete an Instance</button>
  </body>
</html>

Aktualisieren Sie Ihre Seite und klicken Sie auf die Schaltfläche Instanz löschen.

Ein Laufwerk löschen

Verwenden Sie zum Löschen eines Laufwerks die Methode gapi.client.compute.disks.delete() und geben Sie den Namen des Laufwerks, die Projekt-ID und die Zone an:

/**
 * Google Compute Engine API request to delete your disk
 */
function deleteDisk() {
  var request = gapi.client.compute.disks.delete({
    'project': DEFAULT_PROJECT,
    'zone': DEFAULT_ZONE,
    'disk': DEFAULT_DISK_NAME
  });
  executeRequest(request, 'deleteDisk');
}

Fügen Sie auf Ihrer Webseite den folgenden Code hinzu:

<!DOCTYPE html>
<html>
  <head>
   <meta charset='utf-8' />
   <link rel="stylesheet" src="style.css" />
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
   <script src="https://apis.google.com/js/client.js"></script>
   <script type="text/javascript">

     [...snip...]
    
     /**
      * Google Compute Engine API request to delete your disk
      */
     function deleteDisk() {
       var request = gapi.client.compute.disks.delete({
         'project': DEFAULT_PROJECT,
         'zone': DEFAULT_ZONE,
         'disk': DEFAULT_DISK_NAME
       });
       executeRequest(request, 'deleteDisk');
     }
    
     /**
      * Driver for sample application.
      */
     $(window).load(authorization);
    </script>
  </head>
  <body>
    <header>
      <h1>Google Compute Engine JavaScript Client Library Application</h1>
    </header>
    <button onclick="listInstances()">List Instances</button>
    <button onclick="listZoneOperations()">List Zone Operations</button>
    <button onclick="listGlobalOperations()">List Global Operations</button>
    <button onclick="insertDisk()">Insert a Disk</button>
    <button onclick="insertInstance()">Insert an Instance</button>
    <button onclick="getInstance()">Get an Instance</button>
    <button onclick="deleteInstance()">Delete an Instance</button>
    <button onclick="deleteDisk()">Delete a disk</button>
  </body>
</html>

Aktualisieren Sie Ihre Seite und klicken Sie auf die Schaltfläche Laufwerk löschen.

Komplettes Beispiel

Hier ist das komplette Code-Beispiel für diese Übung:

<!DOCTYPE html>
<html>
  <head>
   <meta charset='utf-8' />
   <link rel="stylesheet" src="style.css" />
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
   <script src="https://apis.google.com/js/client.js"></script>
   <script type="text/javascript">
var PROJECT_ID = 'YOUR_PROJECT_ID';
var CLIENT_ID = 'YOUR_CLIENT_ID';
var API_KEY = 'YOUR_API_KEY';
var SCOPES = 'https://www.googleapis.com/auth/compute';
var API_VERSION = 'v1';

var DEFAULT_PROJECT = PROJECT_ID;
var DEFAULT_ZONE = 'ZONE_NAME'; // For example, us-central1-a

var DEFAULT_NAME = 'test-node';
var GOOGLE_PROJECT = 'debian-cloud'; // project hosting a shared image
var DEFAULT_DISK_NAME = DEFAULT_NAME;
var DEFAULT_IMAGE_FAMILY = 'debian-9';

var BASE_URL = 'https://www.googleapis.com/compute/' + API_VERSION;
var PROJECT_URL = BASE_URL + '/projects/' + DEFAULT_PROJECT;
var GOOGLE_PROJECT_URL = BASE_URL + '/projects/' + GOOGLE_PROJECT;
var DEFAULT_DISK_URL = PROJECT_URL + '/zones/' + DEFAULT_ZONE +
  '/disks/' + DEFAULT_DISK_NAME;
var DEFAULT_IMAGE_URL = GOOGLE_PROJECT_URL + '/global/images/family/' +
  DEFAULT_IMAGE_FAMILY;

var DEFAULT_IMAGE_NAME = DEFAULT_NAME;
var DEFAULT_MACHINE_TYPE = 'e2-standard-2';

var DEFAULT_MACHINE_URL = PROJECT_URL + '/zones/' + DEFAULT_ZONE +
  '/machineTypes/' + DEFAULT_MACHINE_TYPE;
var DEFAULT_NETWORK = PROJECT_URL + '/global/networks/default';

/**
 * Authorize Google Compute Engine API.
 */
function authorization() {
  gapi.client.setApiKey(API_KEY);
  gapi.auth.authorize({
    client_id: CLIENT_ID,
    scope: SCOPES,
    immediate: false
  }, function(authResult) {
       if (authResult && !authResult.error) {
         initializeApi();
       } else {
         window.alert('Auth was not successful');
       }
     }
  );
}

/**
 * Load the Google Compute Engine API.
 */
function initializeApi() {
  gapi.client.load('compute', API_VERSION);
}

/**
 * Executes your Google Compute Engine request object and, subsequently,
 * prints the response.
 * @param {gapi.client.request} request A Google Compute Engine request
 *     object issued from the Google APIs JavaScript client library.
 * @param {string} apiRequestName The name of the example API request.
 */
function executeRequest(request, apiRequestName) {
  request.execute(function(resp) {
    newWindow = window.open(apiRequestName, '',
      'width=600, height=600, scrollbars=yes');
    newWindow.document.write('<h1>' + apiRequestName + '</h1> <br />' +
      '<pre>' + JSON.stringify(resp.result, null, ' ') + '</pre>');
    if (resp.error) {
      newWindow.document.write('<h1>Error:</h1>');
      newWindow.document.write('<pre>' +
        JSON.stringify(resp.error, null, ' ') + '</pre>');
    }
  });
}

/**
 * Google Compute Engine API request to delete your instance
 */
function deleteInstance() {
  var request = gapi.client.compute.instances.delete({
    'project': DEFAULT_PROJECT,
    'zone': DEFAULT_ZONE,
    'instance': DEFAULT_IMAGE_NAME
  });
  executeRequest(request, 'deleteInstance');
}

/**
 * Google Compute Engine API request to delete your disk
 */
function deleteDisk() {
  var request = gapi.client.compute.disks.delete({
    'project': DEFAULT_PROJECT,
    'zone': DEFAULT_ZONE,
    'disk': DEFAULT_DISK_NAME
  });
  executeRequest(request, 'deleteDisk');
}

/**
 * Google Compute Engine API request to get your instance
 */
function getInstance() {
  var request = gapi.client.compute.instances.get({
    'project': DEFAULT_PROJECT,
    'zone': DEFAULT_ZONE,
    'instance': DEFAULT_IMAGE_NAME
  });
  executeRequest(request, 'getInstance');
}

/**
 * Google Compute Engine API request to insert a disk into your cluster.
 */
function insertDisk() {
  var request = gapi.client.compute.disks.insert({
    'project': DEFAULT_PROJECT,
    'zone': DEFAULT_ZONE,
    'sourceImage': DEFAULT_IMAGE_URL,
    'resource': {
      'name': DEFAULT_DISK_NAME
    }
  });
  executeRequest(request, 'insertDisk');
}

/**
 * Google Compute Engine API request to insert your instance with metadata
 */
function insertInstanceWithMetadata() {
  resource = {
    'image': DEFAULT_IMAGE_URL,
    'name': 'node-with-metadata',
    'machineType': DEFAULT_MACHINE_URL,
    'disks': [{
     'source': DEFAULT_DISK_URL,
     'type': 'PERSISTENT',
     'boot': true
    }],
    'networkInterfaces': [{
      'network': DEFAULT_NETWORK
    }],
    'metadata': {
      'items': [{
        'value': 'apt -y install apache2',
        'key': 'startup-script'
      }]
    }
  };
  var request = gapi.client.compute.instances.insert({
    'project': DEFAULT_PROJECT,
    'zone': DEFAULT_ZONE,
    'resource': resource
  });
  executeRequest(request, 'insertInstance');
}

/**
 * Google Compute Engine API request to insert your instance
 */
function insertInstance() {
  resource = {
    'image': DEFAULT_IMAGE_URL,
    'name': DEFAULT_IMAGE_NAME,
    'machineType': DEFAULT_MACHINE_URL,
    'disks': [{
     'source': DEFAULT_DISK_URL,
     'type': 'PERSISTENT',
     'boot': true
    }],
    'networkInterfaces': [{
      'network': DEFAULT_NETWORK
    }]
  };
  var request = gapi.client.compute.instances.insert({
    'project': DEFAULT_PROJECT,
    'zone': DEFAULT_ZONE,
    'resource': resource
  });
  executeRequest(request, 'insertInstance');
}

/**
 * Google Compute Engine API request to retrieve the list of global
 * operations (inserts, deletes, etc.) for your Google Compute Engine
 * project.
 */
function listGlobalOperations() {
  var request = gapi.client.compute.globalOperations.list({
    'project': DEFAULT_PROJECT
  });
  executeRequest(request, 'listGlobalOperations');
}

/**
 * Google Compute Engine API request to retrieve the list of operations
 * (inserts, deletes, etc.) for your Google Compute Engine project.
 */
function listZoneOperations() {
  var request = gapi.client.compute.zoneOperations.list({
    'project': DEFAULT_PROJECT,
    'zone': DEFAULT_ZONE
  });
  executeRequest(request, 'listZoneOperations');
}

/**
 * Google Compute Engine API request to retrieve a filtered list
 *  of instances in  your Google Compute Engine project.
 */
function listInstancesWithFilter() {
  var request = gapi.client.compute.instances.list({
    'project': DEFAULT_PROJECT,
    'zone': DEFAULT_ZONE,
    'filter': 'status ne TERMINATED'
  });
  var apiRequestName = 'listInstancesWithFilter';
  executeRequest(request, apiRequestName);
}

/**
 * Google Compute Engine API request to retrieve the list of instances in
 * your Google Compute Engine project.
 */
function listInstances() {
  var request = gapi.client.compute.instances.list({
    'project': DEFAULT_PROJECT,
    'zone': DEFAULT_ZONE
  });
  executeRequest(request, 'listInstances');
}

/**
 * Driver for sample application.
 */
$(window).load(authorization);
    </script>
  </head>
  <body>
   <header>
      <h1>Google Compute Engine JavaScript Client Library Application</h1>
    </header>
    <button onclick="listInstances()">List Instances</button>
    <button onclick="listInstancesWithFilter()">List Instances with Filter</button>
    <button onclick="listZoneOperations()">List Zone Operations</button>
    <button onclick="listGlobalOperations()">List Global Operations</button>
    <button onclick="insertDisk()">Insert a Disk</button>
    <button onclick="insertInstance()">Insert an Instance</button>
    <button onclick="insertInstanceWithMetadata()">Insert Instance with Metadata</button>
    <button onclick="getInstance()">Get an Instance</button>
    <button onclick="deleteInstance()">Delete an Instance</button>
    <button onclick="deleteDisk()">Delete a disk</button>
  </body>
</html>

Weitere Informationen

Nachdem Sie diese Übung abgeschlossen haben, können Sie:

  • Ein erweitertes Beispiel herunterladen und weitere Beispiele auf der GitHub-Seite googlecloudplatform ansehen. Das erweiterte Beispiel umfasst komplexere Verteilungsmethoden und ist genauer als unser Beispiel hier.
  • Informationen zur Verwendung der Python-Clientbibliothek finden Sie unter Python-Clientbibliothek verwenden.
  • Informationen zur Ausführung anderer Aufgaben mit der API finden Sie in der API-Referenz.
  • Eigene Anwendungen erstellen