Issue with Updating User: Uncaught SyntaxError: Unexpected token ‘<' in JSON Response

I’m encountering a persistent issue when trying to update a user profile in my PHP application. Every time I submit the modifications, I get the following error in the browser’s console:

Uncaught SyntaxError: Unexpected token '<', "<br />
<b>"... is not valid JSON
    at JSON.parse (<anonymous>)
    at Object.success (compte.php:773:38)
    at c (jquery-3.5.1.min.js:2:28294)
    at Object.fireWith [as resolveWith] (jquery-3.5.1.min.js:2:29039)
    at l (jquery-3.5.1.min.js:2:79800)
    at XMLHttpRequest.<anonymous> (jquery-3.5.1.min.js:2:82254)
compte.php:1 Uncaught (in promise) Error: A listener indicated an asynchronous response by returning true, but the message channel closed before a response was received

I attempted to fix this by ensuring the PHP code always returns a JSON response. Here’s a snippet of the PHP code I used for updating the user profile:

// PHP code for handling user update
if ($action == 'update' && !$upload_error) {
    $user_id = validate_input($_POST['user_id'] ?? '');
    $sql = "UPDATE users SET civilite = ?, nom = ?, prenom = ?, fonction = ?, telephone = ?, email = ?, societe = ?, activite = ?, siret = ?, adresse = ?, cp = ?, ville = ?, kbis = ?, rc_pro = ?, garantie_decennale = ?, presentation = ?, profile_picture = ?, gallery_pictures = ?, video_url = ?, video = ?, website_url = ? WHERE id = ?";
    $stmt = $conn->prepare($sql);
    if ($stmt) {
        $stmt->bind_param("ssssssssssssssssssssi", $civilite, $nom, $prenom, $fonction, $telephone, $email, $societe, $activite, $siret, $adresse, $cp, $ville, $kbis, $rc_pro, $garantie_decennale, $presentation, $profile_picture, $gallery_pictures_json, $video_url, $video, $website_url, $user_id);
        if ($stmt->execute()) {
            echo json_encode(['success' => true, 'message' => "Profile updated successfully."]);
        } else {
            echo json_encode(['success' => false, 'message' => "Error updating profile: " . $stmt->error]);
        }
        $stmt->close();
    } else {
        echo json_encode(['success' => false, 'message' => "Error preparing statement: " . $conn->error]);
    }
    exit();
}

  1. Added JSON Content-Type Header:

    • To further ensure that the response is interpreted as JSON, I added header('Content-Type: application/json'); at the beginning of the PHP response block. Unfortunately, this didn’t resolve the issue.

  2. Checked for Hidden HTML Errors:

    • I also reviewed the server logs and tried to identify if there were any hidden PHP errors (e.g., warnings or notices) that might be causing the HTML content to be sent back instead of JSON. Despite cleaning up the code, the issue persists.

  3. AJAX Call with Error Handling:

    • On the client side, I tried to improve the error handling in the AJAX call to catch any non-JSON responses. Here’s the relevant part of my AJAX call:
$.ajax({
    url: 'compte.php',
    method: 'POST',
    data: { /* your data */ },
    success: function(response) {
        try {
            var jsonResponse = JSON.parse(response);
            // Handle the JSON response
        } catch (e) {
            console.error('Invalid JSON response', e);
        }
    }
});

Despite these efforts, I still encounter the SyntaxError: Unexpected token '<' when the response is parsed in JavaScript. This suggests that HTML content (likely an error message) is being returned instead of the expected JSON.

Would adding header(‘Content-Type: application/json’); before returning the JSON response in the PHP code be helpful?

Are there any other suggestions to ensure the response is always valid JSON?

If anyone has faced a similar issue, how did you resolve it?

Thank you in advance for your help!