O Guia de referência da API do AWS SDK for JavaScript V3 descreve em detalhes todas as operações da API para o AWS SDK for JavaScript versão 3 (V3).
As traduções são geradas por tradução automática. Em caso de conflito entre o conteúdo da tradução e da versão original em inglês, a versão em inglês prevalecerá.
Criar um chatbot do Amazon Lex
Você pode criar um chatbot do Amazon Lex em um aplicativo Web para engajar os visitantes do seu site. Um chatbot do Amazon Lex é uma funcionalidade que realiza conversas de chat online com os usuários sem fornecer contato direto com uma pessoa. Por exemplo, a ilustração a seguir mostra um chatbot do Amazon Lex que envolve um usuário para reservar um quarto de hotel.

O chatbot Amazon Lex criado neste AWS tutorial é capaz de lidar com vários idiomas. Por exemplo, um usuário que fala francês pode inserir um texto em francês e receber uma resposta em francês.

Da mesma forma, um usuário pode se comunicar com o chatbot do Amazon Lex em italiano.

Este AWS tutorial orienta você na criação de um chatbot do Amazon Lex e na integração dele a um aplicativo web Node.js. O AWS SDK for JavaScript (v3) é usado para invocar esses AWS serviços:
-
Amazon Lex
-
Amazon Comprehend
-
Amazon Translate
Custo de conclusão: os AWS serviços incluídos neste documento estão incluídos no nível AWS gratuito
Observação: certifique-se de encerrar todos os recursos que você cria ao passar por este tutorial para garantir que você não seja cobrado.
Para criar o aplicativo:
Pré-requisitos
Para configurar e executar este exemplo, você deve primeiro concluir estas tarefas:
-
Configure o ambiente do projeto para executar esses TypeScript exemplos de Node e instale os módulos necessários AWS SDK for JavaScript e de terceiros. Siga as instruções em GitHub
. -
Crie um arquivo de configurações compartilhado com as credenciais de usuário. Para obter mais informações sobre como fornecer um arquivo de credenciais compartilhado, consulte Arquivos de configuração e credenciais compartilhados no Guia de referência de ferramentas AWS SDKs e ferramentas.
Importante
Este exemplo usa ECMAScript6 (ES6). Isso requer o Node.js versão 13.x ou superior. Para baixar e instalar a versão mais recente do Node.js, consulte Downloads do Node.js
No entanto, se você preferir usar a sintaxe CommonJS, consulte Sintaxe ES6/CommonJS de JavaScript.
Crie os AWS recursos
Este tutorial requer os seguintes recursos:
-
Uma IAM função não autenticada com permissões anexadas para:
Amazon Comprehend
Amazon Translate
Amazon Lex
Você pode criar esses recursos manualmente, mas recomendamos provisionar esses recursos usando AWS CloudFormation conforme descrito neste tutorial.
Crie os AWS recursos usando AWS CloudFormation
AWS CloudFormation permite que você crie e provisione implantações de AWS infraestrutura de forma previsível e repetida. Para obter mais informações sobre AWS CloudFormation, consulte o Guia AWS CloudFormation do usuário.
Para criar a AWS CloudFormation pilha usando o AWS CLI:
Instale e configure as instruções a AWS CLI seguir no Guia AWS CLI do usuário.
Crie um arquivo chamado
setup.yaml
no diretório raiz da pasta do seu projeto e copie o conteúdo aqui GitHubpara dentro dele. nota
O AWS CloudFormation modelo foi gerado usando o AWS CDK disponível aqui em GitHub
. Para obter mais informações sobre o AWS CDK, consulte o Guia do AWS Cloud Development Kit (AWS CDK) desenvolvedor. Execute o seguinte comando na linha de comando, substituindo
STACK_NAME
com um nome exclusivo para a pilha.Importante
O nome da pilha deve ser exclusivo dentro de uma AWS região e AWS conta. Você pode especificar até 128 caracteres. São permitidos números e hifens.
aws cloudformation create-stack --stack-name STACK_NAME --template-body file://setup.yaml --capabilities CAPABILITY_IAM
Para obter mais informações sobre os parâmetros do comando
create-stack
, consulte o Guia de referência de comandos da AWS CLI e o Guia do usuário do AWS CloudFormation.Para visualizar os recursos criados, abra o console do Amazon Lex, escolha a pilha e selecione a guia Recursos.
Criar um bot do Amazon Lex
Importante
Use a V1 do console do Amazon Lex para criar o bot. Este exemplo não funciona com bots criados usando a V2.
A primeira etapa é criar um chatbot do Amazon Lex usando o Console de Gerenciamento da Amazon Web Services. Neste exemplo, o BookTripexemplo do Amazon Lex é usado. Para obter mais informações, consulte Reservar viagem.
-
Faça login no Console de Gerenciamento da Amazon Web Services e abra o console do Amazon Lex no Console da Amazon Web Services
. -
Na página Bots, selecione Criar.
-
Escolha o BookTripblueprint (deixe o nome padrão do bot BookTrip).
-
Preencha as configurações padrão e escolha Criar (o console mostra o BookTripbot). Na guia Editor, analise os detalhes das intenções pré-configuradas.
-
Teste o bot na janela de teste. Comece o teste digitando Quero reservar um quarto de hotel.
-
Escolha Publicar e especifique um nome de alias (você precisará desse valor ao usar o AWS SDK for JavaScript).
nota
Você precisa referenciar o nome e o alias do bot em seu JavaScript código.
Crie o HTML
Crie um arquivo chamado index.html
. Copie e cole o código abaixo emindex.html
. Isso HTML faz referênciamain.js
. Essa é uma versão integrada do index.js, que inclui os AWS SDK for JavaScript módulos necessários. Você criará esse arquivo em Crie o HTML. index.html
também faz referência a style.css
, o qual adiciona os estilos.
<!doctype html> <head> <title>Amazon Lex - Sample Application (BookTrip)</title> <link type="text/css" rel="stylesheet" href="style.css" /> </head> <body> <h1 id="title">Amazon Lex - BookTrip</h1> <p id="intro"> This multiple language chatbot shows you how easy it is to incorporate <a href="https://aws.amazon.com/lex/" title="Amazon Lex (product)" target="_new" >Amazon Lex</a > into your web apps. Try it out. </p> <div id="conversation"></div> <input type="text" id="wisdom" size="80" value="" placeholder="J'ai besoin d'une chambre d'hôtel" /> <br /> <button onclick="createResponse()">Send Text</button> <script type="text/javascript" src="./main.js"></script> </body>
Esse código também está disponível aqui em GitHub
Criar o script do navegador
Crie um arquivo chamado index.js
. Copie e cole o código abaixo em index.js
. Importe os AWS SDK for JavaScript módulos e comandos necessários. Crie clientes para o Amazon Lex, o Amazon Comprehend e o Amazon Translate. Substituir REGION
com a AWS região, e IDENTITY_POOL_ID
com o ID do grupo de identidades que você criou noCrie os AWS recursos . Para recuperar esse ID do banco de identidades, abra o banco de identidades no console do Amazon Cognito, escolha Editar grupo de identidades e selecione Código de exemplo no menu lateral. O ID do banco de identidades é mostrado em vermelho no console.
Primeiro, crie um diretório libs
e crie os objetos de cliente de serviço necessários criando três arquivos: comprehendClient.js
, lexClient.js
e translateClient.js
. Cole o código apropriado abaixo em cada um e substitua REGION
e IDENTITY_POOL_ID
em cada arquivo.
nota
Use o ID do banco de identidades do Amazon Cognito que você criou em Crie os AWS recursos usando AWS CloudFormation.
import { CognitoIdentityClient } from "@aws-sdk/client-cognito-identity"; import { fromCognitoIdentityPool } from "@aws-sdk/credential-provider-cognito-identity"; import { ComprehendClient } from "@aws-sdk/client-comprehend"; const REGION = "REGION"; const IDENTITY_POOL_ID = "IDENTITY_POOL_ID"; // An Amazon Cognito Identity Pool ID. // Create an Amazon Comprehend service client object. const comprehendClient = new ComprehendClient({ region: REGION, credentials: fromCognitoIdentityPool({ client: new CognitoIdentityClient({ region: REGION }), identityPoolId: IDENTITY_POOL_ID, }), }); export { comprehendClient };
import { CognitoIdentityClient } from "@aws-sdk/client-cognito-identity"; import { fromCognitoIdentityPool } from "@aws-sdk/credential-provider-cognito-identity"; import { LexRuntimeServiceClient } from "@aws-sdk/client-lex-runtime-service"; const REGION = "REGION"; const IDENTITY_POOL_ID = "IDENTITY_POOL_ID"; // An Amazon Cognito Identity Pool ID. // Create an Amazon Lex service client object. const lexClient = new LexRuntimeServiceClient({ region: REGION, credentials: fromCognitoIdentityPool({ client: new CognitoIdentityClient({ region: REGION }), identityPoolId: IDENTITY_POOL_ID, }), }); export { lexClient };
import { CognitoIdentityClient } from "@aws-sdk/client-cognito-identity"; import { fromCognitoIdentityPool } from "@aws-sdk/credential-provider-cognito-identity"; import { TranslateClient } from "@aws-sdk/client-translate"; const REGION = "REGION"; const IDENTITY_POOL_ID = "IDENTITY_POOL_ID"; // An Amazon Cognito Identity Pool ID. // Create an Amazon Translate service client object. const translateClient = new TranslateClient({ region: REGION, credentials: fromCognitoIdentityPool({ client: new CognitoIdentityClient({ region: REGION }), identityPoolId: IDENTITY_POOL_ID, }), }); export { translateClient };
Esse código está disponível aqui em GitHub.
Em seguida, crie um arquivo index.js
e cole o código abaixo nele.
Substituir BOT_ALIAS
e BOT_NAME
com o alias e o nome do seu bot Amazon Lex, respectivamente, e USER_ID
com um ID de usuário. A função assíncrona createResponse
faz o seguinte:
Pega o texto inserido pelo usuário no navegador e usa o Amazon Comprehend para determinar seu código de idioma.
Pega o código do idioma e usa o Amazon Translate para traduzir o texto para o inglês.
Pega o texto traduzido e usa o Amazon Lex para gerar uma resposta.
Publica a resposta na página do navegador.
import { DetectDominantLanguageCommand } from "@aws-sdk/client-comprehend"; import { TranslateTextCommand } from "@aws-sdk/client-translate"; import { PostTextCommand } from "@aws-sdk/client-lex-runtime-service"; import { lexClient } from "./libs/lexClient.js"; import { translateClient } from "./libs/translateClient.js"; import { comprehendClient } from "./libs/comprehendClient.js"; let g_text = ""; // Set the focus to the input box. document.getElementById("wisdom").focus(); function showRequest() { const conversationDiv = document.getElementById("conversation"); const requestPara = document.createElement("P"); requestPara.className = "userRequest"; requestPara.appendChild(document.createTextNode(g_text)); conversationDiv.appendChild(requestPara); conversationDiv.scrollTop = conversationDiv.scrollHeight; } function showResponse(lexResponse) { const conversationDiv = document.getElementById("conversation"); const responsePara = document.createElement("P"); responsePara.className = "lexResponse"; const lexTextResponse = lexResponse; responsePara.appendChild(document.createTextNode(lexTextResponse)); responsePara.appendChild(document.createElement("br")); conversationDiv.appendChild(responsePara); conversationDiv.scrollTop = conversationDiv.scrollHeight; } function handletext(text) { g_text = text; const xhr = new XMLHttpRequest(); xhr.addEventListener("load", loadNewItems, false); xhr.open("POST", "../text", true); // A Spring MVC controller xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); //necessary xhr.send(`text=${text}`); } function loadNewItems() { showRequest(); // Re-enable input. const wisdomText = document.getElementById("wisdom"); wisdomText.value = ""; wisdomText.locked = false; } // Respond to user's input. const createResponse = async () => { // Confirm there is text to submit. const wisdomText = document.getElementById("wisdom"); if (wisdomText?.value && wisdomText.value.trim().length > 0) { // Disable input to show it is being sent. const wisdom = wisdomText.value.trim(); wisdomText.value = "..."; wisdomText.locked = true; handletext(wisdom); const comprehendParams = { Text: wisdom, }; try { const data = await comprehendClient.send( new DetectDominantLanguageCommand(comprehendParams), ); console.log( "Success. The language code is: ", data.Languages[0].LanguageCode, ); const translateParams = { SourceLanguageCode: data.Languages[0].LanguageCode, TargetLanguageCode: "en", // For example, "en" for English. Text: wisdom, }; try { const data = await translateClient.send( new TranslateTextCommand(translateParams), ); console.log("Success. Translated text: ", data.TranslatedText); const lexParams = { botName: "BookTrip", botAlias: "mynewalias", inputText: data.TranslatedText, userId: "chatbot", // For example, 'chatbot-demo'. }; try { const data = await lexClient.send(new PostTextCommand(lexParams)); console.log("Success. Response is: ", data.message); const msg = data.message; showResponse(msg); } catch (err) { console.log("Error responding to message. ", err); } } catch (err) { console.log("Error translating text. ", err); } } catch (err) { console.log("Error identifying language. ", err); } } }; // Make the function available to the browser. window.createResponse = createResponse;
Esse código está disponível aqui em GitHub.
Agora use o webpack para agrupar os AWS SDK for JavaScript módulos index.js
e em um único arquivo,. main.js
Caso ainda não tenha feito isso, siga as instruções descritas em Pré-requisitos para este exemplo para instalar o webpack.
nota
Para obter informações sobre o webpack, consulte Agrupe aplicativos com o webpack.
Execute o seguinte na linha de comando para agrupar o deste JavaScript exemplo em um arquivo chamado
main.js
:webpack index.js --mode development --target web --devtool false -o main.js
Próximas etapas
Parabéns! Você criou um aplicativo Node.js que usa o Amazon Lex para criar uma experiência de usuário interativa. Conforme informado no início deste tutorial, certifique-se de encerrar todos os recursos que criar enquanto percorre este tutorial para garantir que você não seja cobrado. Você pode fazer isso excluindo a AWS CloudFormation pilha que você criou no Crie os AWS recursos tópico deste tutorial, da seguinte forma:
-
Abra o console de AWS CloudFormation
. Na página Pilhas, selecione a pilha.
Escolha Excluir.
Para obter mais exemplos AWS de serviços cruzados, consulte exemplos de AWS SDK for JavaScript serviços cruzados.