eduardmtz/www
0
1<!DOCTYPE html>2<html lang="es">3<head>4 <meta charset="UTF-8">5 <meta name="viewport" content="width=device-width, initial-scale=1.0">6 <title>Preguntas y Respuestas desde PDFs</title>7 <script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs"></script>8 <script src="https://cdn.jsdelivr.net/npm/@tensorflow-models/qna"></script>9 <script src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.11.338/pdf.min.js"></script>10 <script>11 pdfjsLib.GlobalWorkerOptions.workerSrc = 'https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.11.338/pdf.worker.min.js';12 </script>13</head>14<body>15 <h1>Modelo de Preguntas y Respuestas a partir de PDFs</h1>16 17 <!-- Carga de PDFs -->18 <h2>Cargar PDFs</h2>19 <input type="file" id="pdfInput" multiple accept=".pdf" />20 <button onclick="cargarPDFs()">Cargar PDFs</button>21 <div id="statusCarga"></div>22 23 <!-- Preguntas -->24 <h2>Realizar una pregunta</h2>25 <input type="text" id="preguntaInput" placeholder="Escribe tu pregunta aquí" />26 <button onclick="realizarPregunta()">Preguntar</button>27 <div>28 <h3>Respuesta:</h3>29 <p id="respuesta"></p>30 </div>31 32 <script>33 // Variable global para almacenar el texto extraído de los PDFs34 let contextoGlobal = "";35 36 // Carga y procesamiento de PDFs37 async function cargarPDFs() {38 const archivos = document.getElementById("pdfInput").files;39 if (archivos.length === 0) {40 alert("Por favor, selecciona uno o más archivos PDF.");41 return;42 }43 44 const textos = [];45 for (const archivo of archivos) {46 const texto = await extraerTextoPDF(archivo);47 textos.push(texto);48 }49 50 // Unir todo el texto en un contexto global51 contextoGlobal = textos.join(" ");52 document.getElementById("statusCarga").innerText = "PDFs cargados y procesados correctamente.";53 }54 55 // Función para extraer texto de un archivo PDF56 async function extraerTextoPDF(archivo) {57 const lector = new FileReader();58 return new Promise((resolve, reject) => {59 lector.onload = async function (e) {60 const arrayBuffer = e.target.result;61 const pdf = await pdfjsLib.getDocument(arrayBuffer).promise;62 let textoCompleto = "";63 64 for (let i = 1; i <= pdf.numPages; i++) {65 const pagina = await pdf.getPage(i);66 const contenido = await pagina.getTextContent();67 const textoPagina = contenido.items.map(item => item.str).join(" ");68 textoCompleto += textoPagina + "\n";69 }70 resolve(textoCompleto);71 };72 lector.onerror = reject;73 lector.readAsArrayBuffer(archivo);74 });75 }76 77 // Modelo de Preguntas y Respuestas usando TensorFlow.js78 let modelo = null;79 80 // Función para realizar una pregunta81 async function realizarPregunta() {82 const pregunta = document.getElementById("preguntaInput").value;83 if (!contextoGlobal) {84 alert("Primero debes cargar los PDFs para generar el contexto.");85 return;86 }87 if (!pregunta) {88 alert("Por favor, escribe una pregunta.");89 return;90 }91 92 if (!modelo) {93 document.getElementById("respuesta").innerText = "Cargando modelo, por favor espera...";94 modelo = await qna.load(); // Cargar el modelo QnA basado en DistilBERT95 }96 97 // Realizar la pregunta98 const respuestas = await modelo.findAnswers(pregunta, contextoGlobal);99 100 // Mostrar la mejor respuesta o un mensaje si no se encontró ninguna101 if (respuestas.length > 0) {102 document.getElementById("respuesta").innerText = respuestas[0].text;103 } else {104 document.getElementById("respuesta").innerText = "No se encontró una respuesta adecuada.";105 }106 }107 </script>108</body>109</html>110