Warum erscheint meine Nachricht nicht auf der Seite, obwohl das Serverprotokoll anzeigt, dass sie erfolgreich in CivetWe ⇐ C++

[Anonymous]

Ich erstelle eine lokale Web-Chat-Funktion mit CivetWeb (C++), SQLite und einem Frontend in einfachem HTML/JS.
Wenn eine Nachricht gesendet wird, zeigt das Serverprotokoll Folgendes an:

Code: Select all

Attempting to send message: product_id=3, sender=1, receiver=Admin, message=1

Der /send_message-Endpunkt wird also korrekt ausgelöst.
Die neue Nachricht wird jedoch nicht auf der Chat-Seite angezeigt (

Code: Select all

message_feature.html

), obwohl ich sehen kann, dass es im Protokoll eingefügt wurde.
Das habe ich:

Frontend (message_feature.html)

Code: Select all

async function loadConversation() {
const res = await fetch(`/api/conversation?product_id=${productId}`);
if (!res.ok) return;
const msgs = await res.json();
const box = document.getElementById('messages');
box.innerHTML = '';
msgs.sort((a, b) => new Date(a.created_at) - new Date(b.created_at));
msgs.forEach(m => {
const div = document.createElement('div');
div.className = 'msg ' + (m.sender === 'Admin' ? 'received' : 'sent');
div.innerHTML = `${m.message}`;
box.appendChild(div);
});
}

Backend (C++ mit CivetWeb)

Code: Select all

mg_set_request_handler(ctx, "/send_message", [](mg_connection *conn, void *) -> int {
char product_id_str[32], sender[128], receiver[128], message[1024];
mg_get_var(...);
fprintf(stderr, "Attempting to send message: product_id=%s, sender=%s, receiver=%s, message=%s\n",
product_id_str, sender, receiver, message);

sqlite3 *db = safe_open(PRODUCTS_DB_PATH);
const char *sql = "INSERT INTO messages (product_id, sender, receiver, message) VALUES (?, ?, ?, ?);";
...
return 201;
}, nullptr);

mg_set_request_handler(ctx, "/api/conversation", [](mg_connection *conn, void *) -> int {
const char *sql = R"(
SELECT sender, receiver, message, strftime('%Y-%m-%d %H:%M:%S', created_at)
FROM messages
WHERE product_id = ?
ORDER BY id ASC;
)";
...
}, nullptr);

Nachrichten werden in derselben products.db-Datei unter einer Nachrichtentabelle gespeichert.
Ich habe auch überprüft, dass „loadConversation()“ nach dem Senden einer Nachricht ausgeführt wird, aber im Chat-Feld wird nichts angezeigt.
Hier ist der relevante Teil meines message_feature.html-Codes:

Code: Select all

document.getElementById('chatForm').addEventListener('submit', async e => {
e.preventDefault();

const fd = new FormData(e.target);
const userRes = await fetch('/api/get_current_user');
const { username } = await userRes.json();
fd.append('sender', username);

const body = new URLSearchParams(fd);

// Send the message to the backend
const res = await fetch('/send_message', {
method: 'POST',
headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
body: body
});

// I wait for the response before refreshing messages
if (res.ok) {
document.getElementById('message').value = '';
loadConversation();   // ✅ Called right after successful response
} else {
alert('Failed to send message.');
}
});

LoadConversation() wird also erst aufgerufen, nachdem die POST-Anfrage erfolgreich zurückgegeben wurde (Status 201).
Aber selbst dann wird das Chat-Feld nicht aktualisiert – es werden immer noch keine Nachrichten angezeigt, obwohl /send_message die Einfügung auf dem Server protokolliert.
Ich habe auch versucht, vor dem Aufruf von loadConversation() eine kleine Verzögerung hinzuzufügen (mit setTimeout(loadConversation, 1000)), aber es machte keinen Unterschied – die Nachrichten werden immer noch nicht angezeigt.

Frage:
Auch wenn Nachrichten eingefügt wurden (das Protokoll zeigt an, dass sie gesendet wurden), werden sie nicht angezeigt, wenn sie von /api/conversation abgerufen werden.
Was könnte die Ursache sein? Frontend, um sie nicht anzuzeigen – liegt es an einem Problem mit der Abfrage, der JSON-Antwort oder dem DOM-Rendering?

Was ich versucht habe

• Ich habe überprüft, dass der Endpunkt /send_message funktioniert – er protokolliert

  Code: Select all

  Attempting to send message: product_id=3, sender=1, receiver=Admin, message=1
  

  Jedes Mal, wenn ich auf Senden klicke.
• Ich habe überprüft, ob die Nachricht in die SQLite-Datenbank eingefügt wurde (

  Code: Select all

  messages

  Tabelle) manuell mit dem DB-Browser.
• Ich habe bestätigt, dass /api/conversation?product_id=3 ein JSON-Array zurückgibt, aber manchmal ist es leer oder die neue Nachricht fehlt.
• Ich habe auch hinzugefügt console.log(msgs) innerhalb von loadConversation() in message_feature.html – die Konsole zeigt ein leeres Array [] an, obwohl die Nachricht in der Datenbank vorhanden ist.
• Ich habe versucht, loadConversation() direkt nach dem Senden aufzurufen (und auch mit einem 3-Sekunden-Intervall), aber die Chatbox wird immer noch nicht aktualisiert.

Was ich erwartet habe
Ich habe erwartet, dass die neue Nachricht nach dem Senden einer Nachricht:

• in die Nachrichtentabelle eingefügt wird.
• Sofort in der angezeigt wird Chatbox unter der richtigen Seite (

  Code: Select all

  sent

  oder empfangen).
• Wird auch in der Admin-Ansicht angezeigt (

  Code: Select all

  messageadmin.html

  ) nach ein paar Sekunden (da es automatisch aktualisiert wird).