fix of the json upload format

This commit is contained in:
2026-08-03 00:52:39 +02:00
parent 54d8d61358
commit 12f7240cd2
+9 -19
View File
@@ -151,61 +151,51 @@
<script> <script>
document.getElementById('uploadForm').addEventListener('submit', async function(e) { document.getElementById('uploadForm').addEventListener('submit', async function(e) {
e.preventDefault(); // Verhindert das Neuladen der Seite e.preventDefault();
const form = e.target; const form = e.target;
const submitBtn = document.getElementById('submitBtn'); const submitBtn = document.getElementById('submitBtn');
const statusDiv = document.getElementById('status-message'); const statusDiv = document.getElementById('status-message');
// UI auf "Laden" setzen
submitBtn.disabled = true; submitBtn.disabled = true;
submitBtn.innerText = 'Wird verarbeitet...'; submitBtn.innerText = 'Wird verarbeitet...';
statusDiv.className = 'loading'; statusDiv.className = 'loading';
statusDiv.style.display = 'block'; statusDiv.style.display = 'block';
statusDiv.innerHTML = '<div class="spinner"></div> Lade Dateien hoch und verarbeite Bilder... Bitte warten.'; statusDiv.innerHTML = '<div class="spinner"></div> Lade Dateien hoch und verarbeite Bilder... Bitte warten.';
// FormData sammelt alle Inputs aus dem Formular (csv_file und images)
const formData = new FormData(form); const formData = new FormData(form);
try { try {
// Sende die Daten an den Flask-Endpoint
const response = await fetch('/upload_csv_batch', { const response = await fetch('/upload_csv_batch', {
method: 'POST', method: 'POST',
body: formData body: formData
}); });
// Antwort einmalig als Text auslesen, um sowohl JSON als auch HTML-Fehler abzufangen
const responseText = await response.text();
let result; let result;
try { try {
// Versuche, die Antwort als JSON zu lesen result = JSON.parse(responseText);
result = await response.json();
} catch (jsonError) { } catch (jsonError) {
// Wenn der Server kein JSON, sondern HTML (z.B. bei einem Python-Crash) sendet console.error("Server hat kein JSON gesendet. Antwort war:", responseText);
const errorText = await response.text(); throw new Error("Der Server hat einen HTML-Fehler zurückgegeben (z.B. Nginx 413 Entity Too Large oder Server-Crash). Siehe F12 Konsole.");
console.error("Server hat kein JSON gesendet. Antwort war:", errorText);
throw new Error("Der Server hat einen HTML-Fehler zurückgegeben (Python-Crash oder falscher Pfad). Siehe Konsole.");
} }
if (response.ok && result.success) { if (response.ok && result.success) {
// Erfolgreicher Upload
statusDiv.className = 'success'; statusDiv.className = 'success';
statusDiv.innerHTML = ` statusDiv.innerHTML = `<strong>Erfolg!</strong><br>${result.message}`;
<strong>Erfolg!</strong><br> form.reset();
${result.message}
`;
form.reset(); // Formular nach Erfolg leeren
} else { } else {
// Fehler vom Server (mit JSON-Fehlermeldung)
statusDiv.className = 'error'; statusDiv.className = 'error';
statusDiv.innerHTML = `<strong>Fehler:</strong> ${result.message || 'Ein unbekannter Fehler ist aufgetreten.'}`; statusDiv.innerHTML = `<strong>Fehler:</strong> ${result.message || 'Ein unbekannter Fehler ist aufgetreten.'}`;
} }
} catch (error) { } catch (error) {
// Netzwerkfehler oder abgefangener Server-Fehler
statusDiv.className = 'error'; statusDiv.className = 'error';
statusDiv.innerHTML = `<strong>Fehler:</strong> ${error.message}`; statusDiv.innerHTML = `<strong>Fehler:</strong> ${error.message}`;
console.error('Upload Error:', error); console.error('Upload Error:', error);
} finally { } finally {
// UI wieder freigeben
submitBtn.disabled = false; submitBtn.disabled = false;
submitBtn.innerText = 'Daten hochladen'; submitBtn.innerText = 'Daten hochladen';
} }