www / test5.html
eduardmtz's picture
Update test5.html
ea910d6 verified
raw
history blame
5.46 kB
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Preguntas sobre Documentos</title>
<script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs"></script>
<!-- Incluir pdf.js -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.10.377/pdf.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/mammoth/1.4.2/mammoth.browser.min.js"></script>
</head>
<body>
<h1>Sube un archivo y haz preguntas en espa帽ol o catal谩n</h1>
<input type="file" id="file-input" />
<br><br>
<label for="question">Pregunta:</label>
<input type="text" id="question" placeholder="Escribe tu pregunta aqu铆">
<button onclick="askQuestion()">Hacer Pregunta</button>
<h3>Respuesta:</h3>
<div id="response"></div>
<script>
// Especificar la ruta del worker de PDF.js
pdfjsLib.GlobalWorkerOptions.workerSrc = 'https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.10.377/pdf.worker.min.js';
let documentText = ''; // Para almacenar el texto extra铆do de los documentos
// Funci贸n para leer archivos PDF
async function readPDF(file) {
const reader = new FileReader();
reader.onload = async function(event) {
const loadingTask = pdfjsLib.getDocument(event.target.result);
loadingTask.promise.then(function(pdf) {
let text = '';
const numPages = pdf.numPages;
for (let pageNum = 1; pageNum <= numPages; pageNum++) {
pdf.getPage(pageNum).then(function(page) {
page.getTextContent().then(function(textContent) {
textContent.items.forEach(function(item) {
text += item.str + ' ';
});
documentText = text; // Guardamos el texto
});
});
}
});
};
reader.readAsArrayBuffer(file);
}
// Funci贸n para leer archivos de texto (TXT)
function readTXT(file) {
const reader = new FileReader();
reader.onload = function(event) {
documentText = event.target.result; // Guardamos el texto
};
reader.readAsText(file);
}
// Funci贸n para leer archivos de Word (DOCX)
function readWord(file) {
const reader = new FileReader();
reader.onload = function(event) {
mammoth.convertToHtml({ arrayBuffer: event.target.result })
.then(function(result) {
documentText = result.value; // Guardamos el texto
})
.catch(function(err) {
console.log(err);
});
};
reader.readAsArrayBuffer(file);
}
// L贸gica para cargar el archivo seleccionado
document.getElementById('file-input').addEventListener('change', function(event) {
const file = event.target.files[0];
const fileType = file.type;
if (fileType === 'application/pdf') {
readPDF(file);
} else if (fileType === 'text/plain') {
readTXT(file);
} else if (fileType === 'application/vnd.openxmlformats-officedocument.wordprocessingml.document') {
readWord(file);
} else {
alert('Tipo de archivo no soportado');
}
});
// Funci贸n para hacer preguntas al modelo de Hugging Face
async function askQuestion() {
const question = document.getElementById('question').value;
if (!documentText || !question) {
alert('Aseg煤rate de que se haya cargado un archivo y que hayas ingresado una pregunta.');
return;
}
// Usamos la API de Hugging Face para el modelo multiling眉e de preguntas y respuestas
const modelUrl = 'https://api-inference.huggingface.co/models/distilbert-base-multilingual-cased-distilled-squad';
// Preparamos los datos para la consulta
const data = {
inputs: {
question: question,
context: documentText
}
};
// Hacemos la petici贸n a la API de Hugging Face
//console.log (window.huggingface.variables);
//const cucu = "YOUR_HUGGING_FACE_API_KEY";
const cucu = window.huggingface.variables["API_KEY_1"];
console.log("key es la : " + cucu)
const response = await fetch(modelUrl, {
method: 'POST',
headers: {
'Authorization': 'Bearer ' + cucu , // Sustituye por tu API key de Hugging Face
'Content-Type': 'application/json'
},
body: JSON.stringify(data)
});
const result = await response.json();
const answer = result?.answer || 'No pude encontrar una respuesta.';
document.getElementById('response').innerHTML = answer;
}
</script>
</body>
</html>