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.
Implementación de Amazon Kendra
Cuando llegue el momento de implementar la búsqueda de Amazon Kendra en su sitio web, le proporcionaremos el código fuente que podrá usar con React para empezar con su aplicación. El código fuente se proporciona sin cargo alguno en virtud de una licencia del MIT modificada. Puede usarlo tal cual o cambiarlo según sus propias necesidades. La aplicación React proporcionada es un ejemplo para ayudarlo a comenzar. No es una aplicación lista para producción.
Para implementar una aplicación de búsqueda sin código y generar una URL de punto de conexión para su página de búsqueda con control de acceso, consulte Amazon Kendra Experience Builder.
El siguiente código de ejemplo añade la búsqueda de Amazon Kendra a una aplicación web de React existente:
-
https://kendrasamples.s3.amazonaws.com/kendrasamples-react-app.zip
: archivos de muestra que los desarrolladores pueden usar para crear una experiencia de búsqueda funcional en su aplicación web de React existente.
Los ejemplos se basan en la página de búsqueda de la consola de Amazon Kendra. Tienen las mismas características para buscar y mostrar los resultados de búsqueda. Puede usar el ejemplo completo o elegir solo una de las características para su propio uso.
Para ver los tres componentes de la página de búsqueda en la consola de Amazon Kendra, seleccione el icono de código (</>) en el menú de la derecha. Sitúe el puntero del ratón sobre cada sección para ver una breve descripción del componente y obtener la URL de la fuente del componente.
Temas
Información general
Para activar la búsqueda, agrega el código de ejemplo a una aplicación web de React existente. El código de ejemplo incluye un archivo Readme con los pasos para configurar un nuevo entorno de desarrollo de React. Los datos de ejemplo del código de ejemplo se pueden usar para demostrar una búsqueda. Los archivos y componentes de búsqueda del código de ejemplo se estructuran de la siguiente manera:
-
Página de búsqueda principal (
Search.tsx): es la página principal que contiene todos los componentes. Aquí es donde se integra la aplicación con la API de Amazon Kendra. -
Barra de búsqueda: es el componente en el que el usuario introduce un término de búsqueda y llama a la función de búsqueda.
-
Resultados: este es el componente que muestra los resultados de Amazon Kendra. Tiene tres componentes: respuestas sugeridas, resultados de preguntas frecuentes y documentos recomendados.
-
Facetas: este es el componente que muestra las facetas en los resultados de la búsqueda y permite elegir una faceta para restringir la búsqueda.
-
Paginación: este es el componente desde el que se pagina la respuesta de Amazon Kendra.
Requisitos previos
Antes de comenzar, necesitará lo siguiente:
-
Node.js y npm instalados
. Se requiere la versión 19 o anterior de Node.js. -
Python 3 o Python 2 descargados e instalados
. -
SDK for Java o AWS SDK for JavaScript para realizar llamadas a la API a Amazon Kendra.
-
Una aplicación web de React existente. El código de ejemplo incluye un archivo Readme con los pasos sobre cómo configurar un nuevo entorno de desarrollo de React, incluido utilizar los marcos/bibliotecas necesarios. También puede seguir las instrucciones de inicio rápido de la documentación de React para crear una aplicación web de React
. -
Las bibliotecas y dependencias necesarias configuradas en su entorno de desarrollo. El código de ejemplo incluye un archivo Readme que enumera las bibliotecas y las dependencias de paquetes necesarias. Tenga en cuenta que
sasses obligatorio, ya quenode-sassestá obsoleto. Si instaló anteriormentenode-sass, desinstálelo e instalesass.
Configurar el ejemplo
Un procedimiento completo para añadir una búsqueda de Amazon Kendra a una aplicación de React se encuentra en el archivo Readme incluido en el código de ejemplo.
Para empezar a usar kendrasamples-react-app.zip
-
Asegúrese de haber completado los Requisitos previos, incluida la descarga e instalación de Node.js y npm.
-
Descargue kendrasamples-react-app.zip y descomprímalo.
-
Abra su terminal y vaya a
aws-kendra-example-react-app/src/services/. Abralocal-dev-credentials.jsony proporcione sus credenciales. No añada este archivo a ningún repositorio público. -
Vaya a
aws-kendra-example-react-appe instale las dependencias enpackage.json. Ejecutenpm install. -
Inicie una versión de demostración de la aplicación en su servidor local. Ejecute
npm start. Puede detener el servidor local ingresando en su tecladoCmd/Ctrl + C. -
Para cambiar el puerto o el host (por ejemplo, la dirección IP), vaya a
package.jsony actualice el host y el puerto:"start": "HOST=[host] PORT=[port] react-scripts start". Si utiliza Windows:"start": "set HOST=[host] && set PORT=[port] && react-scripts start". -
Si tiene un dominio de sitio web registrado, puede especificarlo en
package.jsondespués del nombre de su aplicación. Por ejemplo,"homepage": "https://mywebsite.com". Debe volver a ejecutarnpm installpara actualizar las nuevas dependencias y, a continuación, ejecutarnpm start. -
Para compilar la aplicación, ejecute
npm build. Cargue el contenido del directorio de compilación a su proveedor de alojamiento.aviso
La aplicación React no está lista para producción. Es un ejemplo de cómo implementar una aplicación de búsqueda de Amazon Kendra.
Página de búsqueda principal
La página de búsqueda principal (Search.tsx) contiene todos los componentes de búsqueda de ejemplo. Incluye el componente de barra de búsqueda para la salida, los componentes de resultados para mostrar la respuesta de la API Query y un componente de paginación para paginar la respuesta.
Componente de búsqueda
El componente de búsqueda proporciona un cuadro de texto para introducir el texto de la consulta. La función onSearch es un enlace que llama a la función principal en Search.tsx para realizar la llamada a la API de Query de Amazon Kendra.
Componente de resultados
El componente de resultados muestra la respuesta de la API Query. Los resultados se muestran en tres áreas distintas.
-
Respuestas sugeridas: estos son los principales resultados devueltos por la API
Query. Contiene hasta tres respuestas sugeridas. En la respuesta, tienen el tipo de resultadoANSWER. -
Respuestas a preguntas frecuentes: son los resultados de las preguntas frecuentes que arroja la respuesta. Las preguntas frecuentes se añaden al índice por separado. En la respuesta, tienen el tipo
QUESTION_ANSWER. Para obtener más información, consulte Preguntas y respuestas. -
Documentos recomendados: son documentos adicionales que Amazon Kendra devuelve en la respuesta. En la respuesta de la API
Query, tienen el tipoDOCUMENT.
Los componentes de resultados comparten un conjunto de componentes para características como el resaltado, los títulos, los enlaces, etc. Los componentes compartidos deben estar presentes para que los componentes de resultados funcionen.
Componente de facetas
El componente de facetas muestra las facetas disponibles en los resultados de la búsqueda. Cada faceta clasifica la respuesta en función de una dimensión específica, como el autor. Puede restringir la búsqueda a una faceta específica seleccionando una de la lista.
Tras seleccionar una faceta, el componente llama a Query con un filtro de atributos que restringe la búsqueda a los documentos que coincidan con la faceta.
Componente de paginación
El componente de paginación le permite mostrar los resultados de búsqueda de la API Query en varias páginas. Llama a la API Query con los parámetros PageSize y PageNumber para obtener una página de resultados específica.
