Usa la biblioteca cliente de JavaScript

En esta página, se muestra cómo usar la biblioteca google-apis-javascript-client con Compute Engine. En este ejercicio, se usará la biblioteca cliente de JavaScript para autorizar solicitudes y crear, enumerar o borrar recursos de Compute Engine desde fuera de una instancia de VM.

Para obtener una lista completa de las bibliotecas cliente disponibles, incluidas otras bibliotecas cliente de Google y bibliotecas de código abierto de terceros, consulta la página sobre bibliotecas cliente.

Para completar este instructivo, debes tener cierta competencia con HTML y JavaScript.

Antes de comenzar

Comienza ahora

En este ejemplo, se describe cómo usar la autorización OAuth 2.0 en una aplicación web y cómo administrar instancias con la biblioteca google-api-javascript-client. Al final de este ejercicio, deberías poder hacer lo siguiente:

  • Autorizar una aplicación para realizar solicitudes a la API de Compute Engine
  • Insertar instancias
  • Mostrar una lista de instancias
  • Mostrar una lista de otros recursos (imágenes, tipos de máquina, zonas, redes, firewalls y operaciones)
  • Borrar instancias

Para ver un ejemplo de código avanzado, visita la página de GitHub Google Cloud Platform.

Carga la biblioteca cliente

Para usar la biblioteca cliente de JavaScript en tu aplicación, primero debes cargarla. La biblioteca cliente de JavaScript se encuentra en esta ruta:

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

Crea un archivo HTML básico que cargue la biblioteca cliente:

<!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>

Autoriza solicitudes

En este ejemplo, se usa una clave de API simple y un método de autorización de ID de cliente. Google Cloud Platform Console administra todas las aplicaciones. Si ya tienes una aplicación registrada, puedes usar el ID de cliente y el secreto del cliente de esa aplicación. Si no tienes una aplicación registrada o deseas registrar una nueva aplicación, sigue estos pasos:

  1. En Google Cloud Platform Console, ve a la página Credenciales.

    Ir a la página Credenciales

  2. Haz clic en Crear credenciales y, luego, selecciona ID de cliente OAuth.
  3. Si esta es tu primera aplicación, se solicitará que crees una pantalla de consentimiento, que se muestra cuando tus aplicaciones solicitan acceso a los datos de tus usuarios. Haz clic en Configurar pantalla de consentimiento y llena el formulario con información sobre tu aplicación. Luego, guarda los cambios.
  4. En la página Crear ID de cliente, selecciona Aplicación web y haz clic en Crear.
  5. Escribe un nombre para la clave y, en el cuadro Orígenes de JavaScript autorizados, escribe el URI de origen de tu aplicación. Por ejemplo, si alojas la aplicación en myexampleapplication.com, el URI de origen es http://myexampleapplication.com. Si pruebas la aplicación en tu computadora de escritorio o laptop, puedes usar http://localhost.
  6. Para generar la clave, haz clic en Crear.
  7. Guarda el ID de cliente y el secreto del cliente para poder usarlos en tu aplicación.

Para autorizar tu aplicación, usa el método gapi.auth.authorize() y proporciona lo siguiente:

  • ID de cliente
  • Secreto del cliente, en la variable API_KEY
  • Una función de devolución de llamada

El método también proporciona un campo immediate. Si configuras immediate como true, la autorización se realiza en segundo plano y no se presenta ninguna solicitud al usuario.

Agrega el siguiente código a tu página HTML:

<!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>

Abre tu página en un navegador. Después de cargarla, se solicita que autorices la aplicación. Una vez que la autorizas con éxito, se muestra una alerta que te informa que la aplicación se autorizó con éxito.

Inicializa la API de Compute Engine en la aplicación

Luego, inicializa la API mediante una llamada a gapi.client.load(), que acepta el nombre y el número de versión de la API como parámetros. En tu página HTML, agrega una función de inicialización, y, luego, invócala una vez que la aplicación haya sido autorizada con éxito:

<!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>

Listo. Ahora puedes comenzar a realizar solicitudes a la API.

Genera una lista de instancias

Para explorar operaciones básicas, comienza por construir solicitudes a fin de enumerar recursos específicos. Agrega lo siguiente a tu página:

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

Ahora, define la función listInstances(). Para hacer una lista de las instancias, usa el método 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
  });
}

Además de los campos project y zone, puedes agregar campos para el tamaño máximo de resultado, instancias de filtro y otras configuraciones. A fin de obtener una lista de todos los campos posibles para este método, consulta el Explorador de API o revisa la documentación de la API.

Agrega la nueva función listInstances() a tu página web de la siguiente manera:

<!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>

Actualiza tu página y haz clic en el nuevo botón Generar una lista de instancias, que muestra una lista de instancias que pertenecen al proyecto que especificaste.

Filtra los resultados de la lista

Una función útil cuando se hacen listas de recursos es el campo filter, que filtra los resultados en función de una expresión. Por ejemplo, puedes excluir instancias finalizadas mediante la siguiente expresión de filtro:

/**
 * 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);
}

Genera listas de otros recursos

Para generar listas de otros recursos, usa los siguientes métodos:

Tipo Método
Genera una lista de zonas gapi.client.compute.zones.list()
Genera una lista de tipos de máquina gapi.client.compute.machinetypes.list()
Genera una lista de operaciones globales gapi.client.compute.globalOperations.list()
Genera una lista de operaciones por zona gapi.client.compute.zoneOperations.list()
Genera una lista de imágenes gapi.client.compute.images.list()
Genera una lista de firewalls gapi.client.compute.firewalls.list()

Genera listas de operaciones

Puedes generar listas de los siguientes tipos de operaciones:

  • Las operaciones por zona son operaciones que se realizan en recursos que se encuentran en una zona específica. Por ejemplo, las operaciones por zona incluyen operaciones realizadas en instancias y discos.
  • Las operaciones globales son operaciones que se realizan en recursos globales, como imágenes y tipos de máquina.
  • .

Para obtener más información sobre los recursos globales y por zona, consulta la descripción general de regiones y zonas.

Genera listas de operaciones por zona

Para ver una lista de operaciones por zona, usa el método gapi.client.compute.zoneOperations.list():

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

En tu página web, agrega las siguientes líneas:

<!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>
Genera listas de operaciones globales

Para ver una lista de operaciones globales, usa el método gapi.client.compute.globalOperations.list():

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

En tu página, agrega las siguientes líneas:

<!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>

Agrega un disco

Antes de poder crear una instancia, debes proporcionar un disco raíz persistente de arranque para la instancia. Para agregar un disco, usa el método gapi.client.compute.disks.insert() y especifica el nombre, el tamaño, la zona y la imagen de origen con tu solicitud:

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

En tu página web, agrega las siguientes líneas:

<!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>

Actualiza la página en el navegador y haz clic en el botón Agregar un disco para crear tu disco nuevo.

Agrega una instancia

Para agregar una instancia, usa el método gapi.client.compute.instances.insert() y especifica una imagen, zona, tipo de máquina y objeto de interfaz de red con tu solicitud:

/**
 * 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
  });
}
Cada página de recursos describe zonas disponibles, imágenes y tipos de máquinas que se pueden usar. Cuando indiques recursos específicos, proporciona la URL completa del recurso. Por ejemplo, para especificar una imagen, debes proporcionar la URL completa a la imagen, como se muestra en el siguiente ejemplo:

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

Las URL a otros recursos incluyen:

Recurso URL
Tipos de máquina https://www.googleapis.com/compute/v1/projects/<project-id>/global/machineTypes/<machine-name>
Zonas https://www.googleapis.com/compute/v1/projects/<project-id>/zones/<zone-name>
Red https://www.googleapis.com/compute/v1/projects/<project-id>/global/networks/<network-name>

En tu página web, agrega las siguientes líneas:

<!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 = 'n1-standard-1';

     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>

Actualiza tu página web en el navegador y haz clic en el botón Insertar instancia para crear una instancia nueva. Haz clic en el botón Generar lista de instancias para ver que la instancia nueva aparece en tu lista de instancias.

Agrega una instancia con metadatos

Cuando creas una instancia, también puedes pasar metadatos personalizados. Puedes definir cualquier tipo de metadatos personalizados. Son muy útiles para ejecutar secuencias de comandos de inicio. Para crear una instancia con metadatos personalizados, agrega el campo metadata al código, como se muestra a continuación:

/**
 * 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-get install apache2',
    'key': 'startup-script'
  }]
}
  };
  var request = gapi.client.compute.instances.insert({
    'project': DEFAULT_PROJECT,
    'zone': DEFAULT_ZONE,
    'resource': resource
  });
  executeRequest(request, 'insertInstance');
}

Los metadatos para esta instancia definen una secuencia de comandos de inicio que instala apache2.

Obtén una instancia

Para obtener información sobre una instancia, usa el método gapi.client.compute.instances.get() y proporciona los campos instance y project:

/**
 * 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
  });
}

En tu página, agrega las siguientes líneas:

<!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>

Actualiza tu página y haz clic en el botón Obtener una instancia.

Borra una instancia

Para borrar una instancia, usa el método gapi.client.compute.instances.delete() y proporciona el nombre de la instancia y el ID del proyecto:

/**
 * 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
  });
}

En tu página, agrega las siguientes líneas:

<!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>

Actualiza tu página y haz clic en el botón Borrar una instancia.

Borra un disco

Para borrar un disco, usa el método gapi.client.compute.disks.delete() y proporciona el nombre del disco, el ID del proyecto y la zona:

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

En tu página, agrega el siguiente código:

<!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>

Actualiza tu página y haz clic en el botón Borrar un disco.

Ejemplo completo

Aquí está el ejemplo de código completo de este ejercicio:

<!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 = 'n1-standard-1';

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-get 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>

Pasos siguientes

Después de completar este ejercicio, puedes hacer lo siguiente:

¿Te ha resultado útil esta página? Enviar comentarios:

Enviar comentarios sobre...

Documentación de Compute Engine