La guía de API referencia de la versión AWS SDK for JavaScript 3 describe en detalle todas las API operaciones de la AWS SDK for JavaScript versión 3 (V3).

Las traducciones son generadas a través de traducción automática. En caso de conflicto entre la traducción y la version original de inglés, prevalecerá la version en inglés.

Crear una aplicación para enviar datos a DynamoDB

Este tutorial de Node.js para servicios cruzados muestra cómo crear una aplicación que permita a los usuarios enviar datos a una tabla de Amazon DynamoDB. Esta aplicación utiliza los siguientes servicios:

El escenario

En este tutorial, una página HTML proporciona una aplicación basada en un navegador para enviar datos a una tabla de Amazon DynamoDB. La aplicación utiliza Amazon SNS para notificar al administrador de la aplicación cuando un usuario actualiza la tabla.

Requisitos previos

Complete los siguientes requisitos previos:

Crear los recursos de AWS

Esta aplicación requiere los siguientes recursos:

Puede crear estos recursos manualmente en la consola de AWS, pero le recomendamos que los aprovisione usando AWS CloudFormation tal y como se describe en este tutorial.

Crear los recursos de AWS usando AWS CloudFormation

AWS CloudFormation le permite crear y aprovisionar implementaciones de infraestructura de AWS de forma predecible y uniforme. Para obtener más información sobre AWS CloudFormation, consulte la Guía del usuario de AWS CloudFormation.

Para crear la pila de AWS CloudFormation usando AWS CLI:

Rellenar la tabla

Para rellenar la tabla, primero cree un directorio llamado libs y, dentro de él, cree un archivo llamado dynamoClient.js, y pegue en él el contenido siguiente. Sustituya REGION por su región de AWS, y sustituya IDENTITY_POOL_ID por un ID de grupo de identidades de Amazon Cognito. Esto crea el objeto de cliente de DynamoDB.

import { CognitoIdentityClient } from "@aws-sdk/client-cognito-identity";
import { fromCognitoIdentityPool } from "@aws-sdk/credential-provider-cognito-identity";
import { DynamoDBClient } from "@aws-sdk/client-dynamodb";

const REGION = "REGION";
const IDENTITY_POOL_ID = "IDENTITY_POOL_ID"; // An Amazon Cognito Identity Pool ID.

// Create an Amazon DynaomDB service client object.
const dynamoClient = new DynamoDBClient({
  region: REGION,
  credentials: fromCognitoIdentityPool({
    client: new CognitoIdentityClient({ region: REGION }),
    identityPoolId: IDENTITY_POOL_ID,
  }),
});

export { dynamoClient };

Este código está disponible aquí en GitHub.

A continuación, cree una carpeta dynamoAppHelperFiles en la carpeta de su proyecto, cree un archivo update-table.js dentro de ella, y copie en él este contenido de GitHub.

// Import required AWS SDK clients and commands for Node.js
import { PutItemCommand } from "@aws-sdk/client-dynamodb";
import { dynamoClient } from "../libs/dynamoClient.js";

// Set the parameters
export const params = {
  TableName: "Items",
  Item: {
    id: { N: "1" },
    title: { S: "aTitle" },
    name: { S: "aName" },
    body: { S: "aBody" },
  },
};

export const run = async () => {
  try {
    const data = await dynamoClient.send(new PutItemCommand(params));
    console.log("success");
    console.log(data);
  } catch (err) {
    console.error(err);
  }
};
run();

En la línea de comandos, ejecute el comando siguiente:

node update-table.js

Este código está disponible aquí en GitHub.

Crear una página front-end para la aplicación

Aquí se crea la página front-end HTML del navegador para la aplicación.

Cree un directorio DynamoDBApp, cree un archivo con el nombre index.html y copie en él este código de GitHub. El elemento script añade el archivo main.js, que contiene todo el JavaScript necesario para el ejemplo. Crearás el archivo main.js más adelante en este tutorial. El código restante de index.html crea la página del navegador que captura los datos que introducen los usuarios.

Este código de ejemplo se puede encontrar aquí en GitHub.

Crear el script del navegador

En primer lugar, cree los objetos del cliente de servicio necesarios para el ejemplo. Cree un directorio libs, cree snsClient.js, y pegue el siguiente código en él. Sustituya REGION e IDENTITY_POOL_ID en cada uno.

import { CognitoIdentityClient } from "@aws-sdk/client-cognito-identity";
import { fromCognitoIdentityPool } from "@aws-sdk/credential-provider-cognito-identity";
import { SNSClient } from "@aws-sdk/client-sns";

const REGION = "REGION";
const IDENTITY_POOL_ID = "IDENTITY_POOL_ID"; // An Amazon Cognito Identity Pool ID.

// Create an Amazon Comprehend service client object.
const snsClient = new SNSClient({
  region: REGION,
  credentials: fromCognitoIdentityPool({
    client: new CognitoIdentityClient({ region: REGION }),
    identityPoolId: IDENTITY_POOL_ID,
  }),
});

export { snsClient };

Este código está disponible aquí en GitHub. .

Para crear el script del navegador para este ejemplo, en una carpeta llamada DynamoDBApp, cree un módulo Node.js con el nombre de archivo add_data.js y pegue en él el código siguiente. La función submitData envía los datos a una tabla de DynamoDB y envía un mensaje de texto SMS al administrador de la aplicación mediante Amazon SNS.

En la función submitData, indique las variables para el número de teléfono objetivo, los valores introducidos en la interfaz de la aplicación y para el nombre del bucket de Amazon S3. A continuación, cree un objeto de parámetros para añadir un elemento a la tabla. Si ninguno de los valores está vacío, submitData agrega el elemento a la tabla y envía el mensaje. Recuerde establecer la función como disponible para del navegador con window.submitData = submitData.

// Import required AWS SDK clients and commands for Node.js
import { PutItemCommand } from "@aws-sdk/client-dynamodb";
import { PublishCommand } from "@aws-sdk/client-sns";
import { snsClient } from "../libs/snsClient.js";
import { dynamoClient } from "../libs/dynamoClient.js";

export const submitData = async () => {
  //Set the parameters
  // Capture the values entered in each field in the browser (by id).
  const id = document.getElementById("id").value;
  const title = document.getElementById("title").value;
  const name = document.getElementById("name").value;
  const body = document.getElementById("body").value;
  //Set the table name.
  const tableName = "Items";

  //Set the parameters for the table
  const params = {
    TableName: tableName,
    // Define the attributes and values of the item to be added. Adding ' + "" ' converts a value to
    // a string.
    Item: {
      id: { N: id + "" },
      title: { S: title + "" },
      name: { S: name + "" },
      body: { S: body + "" },
    },
  };
  // Check that all the fields are completed.
  if (id != "" && title != "" && name != "" && body != "") {
    try {
      //Upload the item to the table
      await dynamoClient.send(new PutItemCommand(params));
      alert("Data added to table.");
      try {
        // Create the message parameters object.
        const messageParams = {
          Message: "A new item with ID value was added to the DynamoDB",
          PhoneNumber: "PHONE_NUMBER", //PHONE_NUMBER, in the E.164 phone number structure.
          // For example, ak standard local formatted number, such as (415) 555-2671, is +14155552671 in E.164
          // format, where '1' in the country code.
        };
        // Send the SNS message
        const data = await snsClient.send(new PublishCommand(messageParams));
        console.log(
          "Success, message published. MessageID is " + data.MessageId,
        );
      } catch (err) {
        // Display error message if error is not sent
        console.error(err, err.stack);
      }
    } catch (err) {
      // Display error message if item is no added to table
      console.error(
        "An error occurred. Check the console for further information",
        err,
      );
    }
    // Display alert if all field are not completed.
  } else {
    alert("Enter data in each field.");
  }
};
// Expose the function to the browser
window.submitData = submitData;

Este código de ejemplo se puede encontrar aquí en GitHub.

Por último, ejecute lo siguiente en la línea de comandos para agrupar el JavaScript de este ejemplo en un archivo llamado main.js:

webpack add_data.js --mode development --target web --devtool false -o main.js

Para ejecutar la aplicación, abra index.html en su navegador.

Eliminación de recursos

Como se indicó al principio de este tutorial, recuerde cancelar todos los recursos que cree mientras realiza este tutorial para asegurarse de que no se le cobre nada. Para ello, puede eliminar la pila de AWS CloudFormation que creó en el tema Crear los recursos de AWS de este tutorial, de la siguiente manera:

Para ver más ejemplos de servicios cruzados de AWS, consulte ejemplos de servicios cruzados de AWS SDK for JavaScript.