I have a facial recognition webapp in django, and I’m trying to show the user through a variable "face_names"
which names are being captured on the screen, but it is always empty even when it has values inside.
I’ve already tried just putting the value, you always have to search for a different value and it still didn’t work, I just wanted to show it in text form.
Views.py
class FaceRecognition:
...
def run_recognition(self, request, frame):
...
response_data = {
"face_names": face_names,
}
print("response_data:", response_data)
# Vamos retornar esse dicionário.
return JsonResponse (response_data)
HTML
<h1 class="titulo">Camera</h1>
<div id="error-message" style="display: none;">
<p>Error aaccessing Camera </p>
</div>
<video id="video" autoplay></video>
<canvas id="canvas" width="640" height="480" style="display: none;"></canvas>
<div id="processing-message" style="display: none;">Running</div>
<div id="face-names"></div>
<button id="capture-button" onclick="captureFrame()">Capture Frame</button>
JavaScript
function sendFrameToServer(blob) {
showProcessingMessage();
hideButton();
const data = new FormData();
data.append('frame_data', blob, 'frame.jpg');
fetch('/processar_reconhecimento_facial/', {
method: 'POST',
headers: {
'X-CSRFToken': getCookie('csrftoken') // Adicione o token CSRF
},
body: data
}).then(response => {
if (response.ok) {
// Se a resposta for bem-sucedida, capture o próximo frame
console.log(response);
captureFrame();
}
if (response.headers.get('Content-Type') === 'application/json') {
console.log("json response");
console.log(data);
return response.json();
} else {
console.log("blob response");
return response.blob();
}
})
.then(data => {
if (data.message === 'redirecionamento') {
window.location.href = data.url;
}
if (data.face_names) {
document.getElementById('face-names').innerText = data.face_names;
} else {
document.getElementById('face-names').innerText = 'Nome detectado: Nao sei porque nao deu certo';
console.log('face_names is undefined');
console.log('data:', data);
console.log('face_names:', data.face_names);
}
showButton();
hideProcessingMessage();
})
.catch(error => {
console.error('Error sending frame to server:', error);
});
}
Logs
Django Termnial: response_data: {'face_names': ['andre']}
Web Console:
Response {type: 'basic', url: 'http://127.0.0.1:8000/processar_reconhecimento_facial/', redirected: false, status: 200, ok: true, …}
reconhecimento_facial/:79 json response
reconhecimento_facial/:80 FormData {}
reconhecimento_facial/:96 face_names is undefined
reconhecimento_facial/:97 data: {message: Array(0)}
reconhecimento_facial/:98 face_names: undefined