Actualiza tu servicio web

En esta sección de la guía, aprenderás a escribir, probar y, luego, implementar actualizaciones en el servicio web de ejemplo que implementaste en la sección anterior, Implementa tu servicio web.

Antes de comenzar

Si aún no completaste las secciones anteriores de la guía “Cómo compilar una aplicación”, haz lo siguiente:

  1. Crea un proyecto de Google Cloud Platform con una aplicación de App Engine.
  2. Escribe un servicio web nodejs simple.
  3. Implementa el servicio web en App Engine.

Actualiza el servicio web de ejemplo

En las siguientes secciones, se actualiza el servicio web de ejemplo con un formulario y un controlador que responden cuando un usuario envía dicho formulario.

Crea un formulario de entrada del usuario

Para permitir que un usuario envíe datos a tu servidor, utiliza un formulario HTML.

  1. En tu carpeta my-nodejs-service, crea una carpeta llamada views para almacenar tus archivos HTML.

  2. En la carpeta views, crea un archivo llamado form.html y agrega el siguiente código:

    <!DOCTYPE html>
    <html>
      <head>
        <title>My App Engine App</title>
      </head>
      <body>
        <h2>Create a new post</h2>
        <form method="POST" action="/submit">
          <div>
            <input type="text" name="name" placeholder="Name">
          </div>
          <div>
            <textarea name="message" placeholder="Message"></textarea>
          </div>
          <div>
            <button type="submit">Submit</button>
          </div>
        </form>
      </body>
    </html>

Este formulario sencillo permite al usuario ingresar un nombre y un mensaje para enviarlos al servidor. Envía los datos a través de una solicitud HTTP POST a /submit, según lo especifican los atributos method y action en el elemento <form>.

En este punto, debes tener una estructura de archivos como la que se muestra a continuación:

my-nodejs-service/
  views/
    form.html
  app.yaml
  package.json
  server.js

Muestra el formulario

  1. Agrega la siguiente línea a la parte superior de tu archivo server.js para importar el módulo path:

    const path = require(`path`);
    
  2. Agrega el siguiente controlador de Express para mostrar el formulario cuando un usuario navegue a /submit:

    app.get('/submit', (req, res) => {
      res.sendFile(path.join(__dirname, '/views/form.html'));
    });

Crea un controlador para los datos enviados

Cuando un usuario envía un mensaje al servidor, se envía una solicitud POST con los datos a /submit. Para leer los datos del cuerpo de la solicitud, usa el módulo body-parser de la Administración de socios de red y crea un nuevo controlador de solicitud.

  1. Desde tu carpeta my-nodejs-service, ejecuta el siguiente comando para agregar body-parser como dependencia:

    npm install body-parser
    
  2. Al comienzo de tu archivo server.js, agrega el siguiente texto para importar body-parser:

    const bodyParser = require('body-parser');
    
  3. Agrega la siguiente línea para configurar tu aplicación Express a fin de usar body-parser:

    app.use(bodyParser.urlencoded({ extended: true }));
  4. Agrega un controlador POST a tu archivo server.js para leer los datos:

    app.post('/submit', (req, res) => {
      console.log({
        name: req.body.name,
        message: req.body.message
      });
      res.send('Thanks for your message!');
    });

Este controlador de muestra registra el nombre y el mensaje del usuario en la consola, pero también puede realizar operaciones en los datos o almacenarlos en una base de datos.

Realiza pruebas del formulario de manera local

Prueba tu formulario nuevo de manera local antes de implementar cambios.

  1. Inicia tu servidor Node.js:

    npm start
    
  2. Consulta tu formulario en http://localhost:8080/submit.

    Envía un mensaje con el formulario. Debes ver que tu nombre y el mensaje aparezcan en la terminal.

Implementa cambios

Cuando implementas una actualización, se crea una versión nueva del servicio predeterminado y el tráfico se enruta automáticamente a la última versión. Para implementar, sigue estos pasos:

  1. Desde tu carpeta my-nodejs-service, ejecuta el siguiente comando:

    gcloud app deploy
    

    Este es el mismo comando que aprendiste en Implementa tu servicio web.

  2. Confirma que haya una versión nueva en GCP Console:

    Ver versiones

    Debes ver dos versiones correspondientes a la implementación anterior y actual.

Después de la implementación, puedes acceder a tu formulario nuevo en https://YOUR_PROJECT_ID.appspot.com/submit. Úsalo para enviar un mensaje o dos.

Puedes borrar la versión anterior si ya no la necesitas desde la página de versiones en GCP Console.

Próximos pasos

Ahora que tu aplicación tiene un formulario para que los usuarios envíen datos, aprende a visualizar los registros de la aplicación en GCP Console.

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

Enviar comentarios sobre...

Documentación del entorno estándar de App Engine para Node.js