Spaces:
Running
Running
| <html lang="es"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Modelo de BERT con TensorFlow.js</title> | |
| <script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs"></script> | |
| <script src="https://cdn.jsdelivr.net/npm/@tensorflow-models/qna"></script> | |
| <!-- Aseguramos que se cargue el worker de pdf.js correctamente --> | |
| <script src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.10.377/pdf.min.js"></script> | |
| <script> | |
| // Especificamos la ubicaci贸n del worker de pdf.js | |
| pdfjsLib.GlobalWorkerOptions.workerSrc = 'https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.10.377/pdf.worker.min.js'; | |
| </script> | |
| <style> | |
| body { | |
| font-family: Arial, sans-serif; | |
| } | |
| .container { | |
| margin: 20px; | |
| } | |
| .file-input { | |
| margin: 10px 0; | |
| } | |
| .query-input { | |
| margin: 10px 0; | |
| } | |
| .response { | |
| margin-top: 20px; | |
| font-size: 1.2em; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <div class="container"> | |
| <h1>Modelo de BERT con TensorFlow.js</h1> | |
| <!-- Subir archivo PDF --> | |
| <input type="file" id="pdf-file" class="file-input" accept=".pdf" /> | |
| <!-- Entrada para consulta --> | |
| <input type="text" id="query" class="query-input" placeholder="Escribe tu consulta..." /> | |
| <button onclick="handleQuery()">Consultar modelo</button> | |
| <div class="response" id="response"></div> | |
| </div> | |
| <script> | |
| let model; | |
| let contextText = ''; | |
| // Funci贸n para cargar el modelo de QA (Pregunta y Respuesta) | |
| async function loadModel() { | |
| model = await qna.load(); | |
| console.log("Modelo cargado"); | |
| } | |
| // Funci贸n para procesar PDF y extraer texto | |
| async function extractTextFromPDF(file) { | |
| const pdf = await pdfjsLib.getDocument(URL.createObjectURL(file)).promise; | |
| let textContent = ''; | |
| for (let pageNum = 1; pageNum <= pdf.numPages; pageNum++) { | |
| const page = await pdf.getPage(pageNum); | |
| const content = await page.getTextContent(); | |
| content.items.forEach(item => { | |
| textContent += item.str + ' '; | |
| }); | |
| } | |
| return textContent; | |
| } | |
| // Funci贸n para agregar el texto de los PDFs y entrenar el modelo | |
| async function processPDF(file) { | |
| const text = await extractTextFromPDF(file); | |
| contextText = text; // Guardamos el texto extra铆do del PDF | |
| console.log("Texto extra铆do del PDF:", contextText); | |
| } | |
| // Manejar la consulta del modelo | |
| async function handleQuery() { | |
| const query = document.getElementById('query').value; | |
| if (!query) { | |
| document.getElementById('response').innerText = "Por favor, escribe una consulta."; | |
| return; | |
| } | |
| if (!contextText) { | |
| document.getElementById('response').innerText = "No se ha cargado ning煤n PDF para consultar."; | |
| return; | |
| } | |
| // Realizar la consulta utilizando el modelo de QA con el m茅todo correcto | |
| const answers = await model.findAnswers(query, contextText); | |
| // Mostrar la respuesta | |
| if (answers.length > 0) { | |
| document.getElementById('response').innerText = `Respuesta: ${answers[0].text}`; | |
| } else { | |
| document.getElementById('response').innerText = "No se encontr贸 una respuesta."; | |
| } | |
| } | |
| // Escuchar el archivo PDF y procesarlo | |
| document.getElementById('pdf-file').addEventListener('change', function(event) { | |
| const file = event.target.files[0]; | |
| if (file) { | |
| processPDF(file); | |
| } | |
| }); | |
| // Cargar el modelo cuando la p谩gina se carga | |
| loadModel(); | |
| </script> | |
| </body> | |
| </html> | |