Передача массива с PHP на Javascript с помощью JQuery & JSON

Question

У меня есть игра, которая обновляет информацию каждые 10 секунд из базы данных MySQL. Там будет функция JS, которая вызывается каждый раз, когда это происходит. Я не могу выполнить функцию успеха, и я понятия не имею, почему. Никаких ошибок на консоли.

Javascript:

function refreshStats() { 
    console.log("number 1"); 
    $.ajax({ 
     url: "refreshData.php", 
     type: "POST", 
     contentType: "application/json; charset=utf-8", 
     dataType : 'json', 
     data: { }, 
     cache: false, 
     async: true, 
     success: function (msg) { 
      if(msg){ 
       console.log("number 2"); 
       var arr = JSON.parse(msg); 
       document.getElementById("interface_stats").innerHTML = 
        "Fatigue: " + arr[0]; 

      } 

     } 
    }); 
} 

PHP:

<?php 

$username = $_POST['user']; 
ini_set('display_errors', 1); 
error_reporting(E_ALL); 

$con = mysql_connect("localhost","redacted","redacted"); 
if (!$con) 
{ 
    die('SQL error! Aborting: ' . mysql_error($con)); 
} 
$db = mysql_select_db("aftertheend",$con) or die("Database error! Aborting. Inform the admin."); 
$query = "SELECT fatigue, food, water, radiation, condition FROM users WHERE username='TheMightyThor'"; 
$result = mysql_query($query, $con); 

$data = mysql_fetch_row($result); 

$stats = [ 
    "fatigue" => $data[0], 
    "food" => $data[1], 
    "water" => $data[2], 
    "radiation" => $data[3], 
    "condition" => $data[4] 
    ]; 

echo json_encode($stats); 


?> 

Answer 1

Я думаю, что ваш PHP возвращает ошибку, а не JSON вы ожидаете. Поскольку у вас есть dataType: 'json', jQuery пытается проанализировать ответ, но не работает. Когда это произойдет, jQuery не вызывает обратный вызов success.

Если вы можете, используйте Firebug, чтобы узнать, что возвращается вызовом ajax. Другим способом было бы временно изменить к dataType: 'html', а затем изменить success обратного вызова:

success: function(msg) { alert(msg); } 

Надеюсь, когда вы видите сообщение возвращается, это поможет выявить проблему. Одна вещь, которую вы должны сделать, это добавить код для обработки случаев, когда запрос не выполняется, и где не выводится строка из базы данных. Вы можете добавить следующий код в файл PHP:

$result = mysql_query($query, $con); 

if (!$result) { 
    die('Could not run query: ' . mysql_error($con)); 
} 

if (mysql_num_rows($result) < 1) { 
    echo 'null'; 
    exit; 
} 

$data = mysql_fetch_row($result); 

Есть также несколько проблем с вызовом Ajax, хотя:

(1) Вы указываете contentType: "application/json; charset=utf-8", но тогда вы не посылаете JSON. Вы должны сделать что-то вроде этого:

data: JSON.stringify({}), 

Но если вы сделаете это, вы не можете получить данные на сервере с помощью функции $_POST. Поэтому вместо этого вы можете избавиться от настройки contentType. См. Это SO answer для получения дополнительной информации.

(2) Когда вы укажете dataType: 'json', JQuery будет анализировать ответ на объект перед вызовом обратного вызова успеха, поэтому параметр msg уже должен быть объектом. Поэтому вы не должны звонить JSON.parse(msg).

(3) Вы возвращаете ассоциативный массив из файла PHP. Это будет преобразовано в объект JavaScript, а не в массив.

Я думаю, вы должны попробовать следующее:

$.ajax('refreshData.php', { 
    type: 'post', 
    dataType: 'json', 
    data: { }, 
    cache: false, 
    success: function (data) { 
     if (data) { 
      $('#interface_stats').html('Fatigue: ' + data.fatigue); 
     } 
    } 
});