Das AWS SDK for JavaScript APIV3-Referenzhandbuch beschreibt detailliert alle API Funktionen für die AWS SDK for JavaScript Version 3 (V3).
Die vorliegende Übersetzung wurde maschinell erstellt. Im Falle eines Konflikts oder eines Widerspruchs zwischen dieser übersetzten Fassung und der englischen Fassung (einschließlich infolge von Verzögerungen bei der Übersetzung) ist die englische Fassung maßgeblich.
Erstellen Sie eine App zum Senden von Daten an DynamoDB
Dieses serviceübergreifende Tutorial zu Node.js zeigt, wie Sie eine App erstellen, mit der Benutzer Daten an eine Amazon DynamoDB-Tabelle senden können. Diese App verwendet die folgenden Dienste:
AWS Identity and Access Management(IAM) und Amazon Cognito für Autorisierung und Berechtigungen.
Amazon DynamoDB (DynamoDB), um die Tabellen zu erstellen und zu aktualisieren.
Amazon Simple Notification Service (Amazon SNS), um den App-Administrator zu benachrichtigen, wenn ein Benutzer die Tabelle aktualisiert.
Das Szenario
In diesem Tutorial bietet eine HTML-Seite eine browserbasierte Anwendung zum Senden von Daten an eine Amazon DynamoDB-Tabelle. Die App verwendet Amazon SNS, um den App-Administrator zu benachrichtigen, wenn ein Benutzer die Tabelle aktualisiert.
Um die App zu erstellen:
Voraussetzungen
Führen Sie die folgenden erforderlichen Aufgaben aus:
-
Richten Sie die Projektumgebung ein, um diese TypeScript Node-Beispiele auszuführen, und installieren Sie die erforderlichen Module AWS SDK for JavaScript und Module von Drittanbietern. Folgen Sie den Anweisungen auf GitHub
. Erstellen Sie eine freigegebene Konfigurationsdatei mit Ihren Anmeldeinformationen. Weitere Informationen zur Bereitstellung einer Datei mit gemeinsam genutzten Anmeldeinformationen finden Sie unter Dateien mit gemeinsam genutzten Konfigurationen und Anmeldeinformationen im Referenzhandbuch für AWS SDKs und Tools.
Erstellen Sie die Ressourcen AWS
Diese App benötigt die folgenden Ressourcen:
AWS Identity and Access Management(IAM) Nicht authentifizierte Amazon Cognito Cognito-Benutzerrolle mit den folgenden Berechtigungen:
sns:Publish
Dynamodb: PutItem
Eine DynamoDB-Tabelle.
Sie können diese Ressourcen manuell in der AWS Konsole erstellen, wir empfehlen jedoch, diese Ressourcen AWS CloudFormation wie in diesem Tutorial beschrieben bereitzustellen.
Erstellen Sie die AWS Ressourcen mit AWS CloudFormation
AWS CloudFormation ermöglicht es Ihnen, die AWS-Infrastrukturen vorhersagbar und wiederholt zu erstellen und bereitzustellen. Weitere Informationen zu AWS CloudFormation finden Sie im AWS CloudFormation Benutzerhandbuch.
Um den AWS CloudFormation Stack mit dem zu erstellenAWS CLI:
Installieren und konfigurieren Sie die AWS CLI folgenden Anweisungen im AWS CLIBenutzerhandbuch.
Erstellen Sie eine Datei mit dem Namen
setup.yaml
im Stammverzeichnis Ihres Projektordners und kopieren Sie den Inhalt hier GitHubhinein. Anmerkung
Die AWS CloudFormation Vorlage wurde unter Verwendung der hier AWS CDK verfügbaren Datei
generiert GitHub. Weitere Informationen zum AWS CDK finden Sie im AWS Cloud Development Kit (AWS CDK)Entwicklerhandbuch für. Führen Sie den folgenden Befehl von der Befehlszeile aus und ersetzen Sie
STACK_NAME
durch einen eindeutigen Namen für den Stack undREGION in Ihrer Region
. AWSWichtig
Der Stack-Name muss innerhalb einer AWS Region und eines Kontos eindeutig sein. AWS Sie können bis zu 128 Zeichen angeben. Zahlen und Bindestriche sind zulässig.
aws cloudformation create-stack --stack-name STACK_NAME --template-body file://setup.yaml --capabilities CAPABILITY_IAM --region REGION
Weitere Informationen zu den
create-stack
Befehlsparametern finden Sie in der AWS CLIBefehlsreferenz und im AWS CloudFormationBenutzerhandbuch.Um die erstellten Ressourcen anzuzeigen, öffnen AWS CloudFormation Sie die AWS Verwaltungskonsole, wählen Sie den Stack und dann die Registerkarte Ressourcen aus.
Verwenden Sie bei der Erstellung des Stacks die, AWS SDK for JavaScript um die DynamoDB-Tabelle aufzufüllen, wie unter beschrieben. Auffüllen der Tabelle
Auffüllen der Tabelle
Um die Tabelle zu füllen, erstellen Sie zunächst ein Verzeichnis mit dem Namen libs
und darin eine Datei mit dem NamendynamoClient.js
, und fügen Sie den folgenden Inhalt ein. Ersetzen Sie REGION
durch Ihre AWS Region und ersetzen Sie IDENTITY_POOL_ID durch eine Amazon Cognito Identity Pool-ID
. Dadurch wird das DynamoDB-Clientobjekt erstellt.
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 };
Dieser Code ist hier auf verfügbar. GitHub
Erstellen Sie als Nächstes einen dynamoAppHelperFiles
Ordner in Ihrem Projektordner, erstellen Sie eine Datei update-table.js
darin und kopieren Sie den Inhalt hier 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();
Führen Sie den folgenden Befehl von der Befehlszeile aus.
node update-table.js
Dieser Code ist hier auf
Erstellen Sie eine Front-End-Seite für die App
Hier erstellen Sie die Frontend-HTML-Browserseite für die App.
Erstellen Sie ein DynamoDBApp
Verzeichnis, erstellen Sie eine Datei mit dem Namen index.html
und kopieren Sie von hier an den GitHubscript
Element fügt die main.js
Datei hinzu, die alle JavaScript für das Beispiel erforderlichen Informationen enthält. Sie werden die main.js
Datei später in diesem Tutorial erstellen. Mit dem verbleibenden Code index.html
wird die Browserseite erstellt, auf der die von Benutzern eingegebenen Daten erfasst werden.
Dieser Beispielcode finden Sie hier unter GitHub
Erstellen Sie das Browser-Skript
Erstellen Sie zunächst die für das Beispiel erforderlichen Service-Client-Objekte. Erstellen Sie ein libs
VerzeichnissnsClient.js
, erstellen Sie es und fügen Sie den folgenden Code ein. Ersetzen Sie jeweils REGION
und IDENTITY_POOL_ID
.
Anmerkung
Verwenden Sie die ID des Amazon Cognito Cognito-Identitätspools, in Erstellen Sie die Ressourcen AWS dem Sie ihn erstellt haben.
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 };
Dieser Code ist hier auf GitHub verfügbar.
Um das Browserskript für dieses Beispiel zu erstellenDynamoDBApp
, erstellen Sie in einem Ordner mit dem Namen ein Modul Node.js mit dem Dateinamen add_data.js
und fügen Sie den folgenden Code ein. Die submitData
Funktion sendet Daten an eine DynamoDB-Tabelle und sendet mithilfe von Amazon SNS einen SMS-Text an den App-Administrator.
Deklarieren Sie in der submitData
Funktion Variablen für die Zieltelefonnummer, die auf der App-Oberfläche eingegebenen Werte und für den Namen des Amazon S3 S3-Buckets. Erstellen Sie als Nächstes ein Parameter-Objekt zum Hinzufügen eines Elements zur Tabelle. Wenn keiner der Werte leer ist, submitData
fügt das Element der Tabelle hinzu und sendet die Nachricht. Denken Sie daran, die Funktion für den Browser verfügbar zu machen, mitwindow.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;
Diesen Beispielcode finden Sie hier auf GitHub
Führen Sie abschließend an der Befehlszeile den folgenden Befehl aus, um das JavaScript für dieses Beispiel in einer Datei mit dem Namen zu bündelnmain.js
:
webpack add_data.js --mode development --target web --devtool false -o main.js
Anmerkung
Hinweise zur Installation von Webpack finden Sie unterAnwendungen mit Webpack bündeln.
Um die App auszuführen, öffnen Sie sie index.html
in Ihrem Browser.
Löschen Sie die Ressourcen
Wie zu Beginn dieses Tutorials erwähnt, sollten Sie darauf achten, alle Ressourcen zu beenden, die Sie während der Bearbeitung dieses Tutorials erstellen, um sicherzustellen, dass Ihnen nichts in Rechnung gestellt wird. Sie können dies tun, indem Sie den AWS CloudFormation Stack, den Sie im Erstellen Sie die Ressourcen AWS Thema dieses Tutorials erstellt haben, wie folgt löschen:
-
Öffnen Sie das AWS CloudFormationin der AWS Managementkonsole
. Öffnen Sie die Seite Stacks und wählen Sie den Stack aus.
Wählen Sie Löschen aus.
Weitere AWS dienstübergreifende Beispiele finden Sie unter AWS SDK for JavaScriptserviceübergreifende Beispiele.