Actualiza tu servicio web

ID de región

REGION_ID es un código abreviado que Google asigna en función de la región que eliges cuando creas la app. El código no corresponde a un país ni a una provincia, aunque algunos ID de región puedan parecer similares a los códigos de país y provincia que se suelen usar. En el caso de las apps creadas después de febrero de 2020, REGION_ID.r se incluye en las URL de App Engine. En el caso de las apps existentes creadas antes de esta fecha, el ID de región es opcional en la URL.

Obtén más información acerca de los ID de región.

En esta sección de la guía, aprenderás a escribir, probar e 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 “Compila una app”, haz lo siguiente:

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, usa un formulario HTML.

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

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

Agrega la siguiente línea a la parte superior de tu archivo server.js para importar el módulo path:
```
const path = require(`path`);
```
Agrega el siguiente controlador de Express para que se muestre 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 middleware urlencoded de Express y crea un controlador de solicitudes nuevo.

Configura tu app para usar el middleware urlencoded de Express:

// This middleware is available in Express v4.16.0 onwards
app.use(express.urlencoded({extended: true}));

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.

Inicia tu servidor Node.js:
```
npm start
```
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 realizar una implementación, sigue estos pasos:

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.
Confirma que aparece una versión nueva en la lista en la consola de Google Cloud:

Ver versiones

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

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

Si ya no necesitas la versión anterior, puedes borrarla desde la página Versiones en la consola de Google Cloud.

Próximos pasos

Ahora que la app tiene un formulario para que los usuarios envíen datos, obtén información sobre cómo ver los registros de tu aplicación en la consola de Google Cloud.