Почему ajax возвращает «undefined»?

Question

[Владислав Васильев]

Здравствуйте! Никак не могу решить проблему с ajax - постоянно возвращает "undefined". Хочу сразу отметить, что даже если пробовать вывести json через console.log - получается тоже самое.

Код:

$.ajax({
        type: 'GET',
        url: '../Data/Scripts/GetTrackInfo.php',
        async: true,
        data:'track_hash=760e07bb98d02f0887f20f7ba75e7581',
        contentType: "application/json",
        dataType: 'json',
 success: function(json) {
         var track_name = json['track_name'];
         var track_author = json['track_author'];
         $('#latest-tracks').html('<div class="list-group"><a class="list-group-item"><strong>Название:</strong>'+track_author+' - '+track_name+'</a></div>');
  },
  error: function(e) {
         console.log(e.message)
   }
})

Json на сервере формирую при помощи json_encode. Если обратиться к php скрипту напрямую, через адресную строку, json успешно выводится:

{
	"track_name": "Smoke Gang Costra Nostra [Feat El Pablo]",
	"track_hash": "760e07bb98d02f0887f20f7ba75e7581",
	"track_url": "DJ Smokey - Smoke Gang Costra Nostra [Feat El Pablo]",
	"track_bitrate": "245",
	"track_author": "DJ Smokey",
	"cover": "..\/Data\/Covers\/Template\/none.jpg",
	"track_url2": "DJ+Smokey+-+Smoke+Gang+Costra+Nostra",
	"track_album": "Single",
	"album_hash": "",
	"track_downloads": "0",
	"track_playtime": "04:52",
	"track_genre": "Relax"
}

Comments

[OVK2015]

JSON.parse ?

[Kovalsky]

Ну вы попробуйте убрать dataType и тогда уже смотрите, что вам пришло в ответ.

[Владислав Васильев]

Никита Полевой: В ответ пришел json точно в таком же виде, в котором его отправляю в php скрипте - уже хоть что-то. Однако получить его значения я всё равно не могу.

[Kovalsky]

Владислав Васильев: не понял, это как?

То есть вы убрали dataType, вывели в консоль ответ запроса и увидели что это ваш JSON. Если всё так, то что тогда значит "получить его значения я всё равно не могу" ?

[Владислав Васильев]

Владислав Васильев: Значения переменных, которые я объявил - "track_name" содержат "undefined" вместо реальных значений. Может быть, это и глупо, но пробовал так еще сделать "var track_name = json[0].track_name;", но должного результата это не принесло.

[Владислав Васильев]

Никита Полевой: Значения переменных, которые я объявил - "track_name" содержат "undefined" вместо реальных значений. Может быть, это и глупо, но пробовал так еще сделать "var track_name = json[0].track_name;", но должного результата это не принесло.

[Владислав Васильев]

Никита Полевой: Кстати, меня удивляет одна вещь - точно такой же код хорошо работает, но на другой странице сайта. Они идентичны полностью, как на серверной стороне, так и клиентской. Есть только одно отличие - в коде, который я тут написал, имеется параметр "data" в которой я передаю параметр.

[Kovalsky]

Владислав Васильев: а можете показать что именно вам приходит в ответ на запрос?

Я весь ваш пример локально воспроизвел, всё ок, никаких проблем.

[Владислав Васильев]

Никита Полевой: Смотрите, как Вы и просили, я убрал dataType. Потом я в консоль вывел json и получил: {"track_name":"Sword of vermilion steal","track_author":"The Messiah"}
Т.е то, что я и отправил своим php-скриптом. Как вы могли заметить, из json я получаю значения(track_name, track_author) следующим образом: var track_name = json['track_name']; и var track_author = json['track_author ']; и при попытке вывести их "$('#latest-tracks').html('Название:'+track_author+' - '+track_name+'');" я получаю следующий ответ: "Название:undefined - undefined".
Я не знаю, почему вообще так происходит, но факт того, что такой же код нормально работает у Вас, меня еще больше ввел в замешательство. Кстати, в самом начале, когда я только начал писать этот код и потом его проверил, всё работало нормально(но я получал и выводил всего две переменные), в дальнейшем, я расширил массив с данными и всё сломалось. Я потом откатил все изменения к самому началу, но код не работал больше. Я не знаю или я дурак полный, или это магия какая-то.

[Владислав Васильев]

Так формируется json:
while($track_data = mysqli_fetch_assoc($id_check)) {
$json = array('track_name' => $track_data['track_name'], 'track_author' => $track_data['track_author']);
}
echo json_encode($json);

[Kovalsky]

Владислав Васильев: понятно.

Ну смотрите, я сделал даже демку, как это у меня происходит:



Я не знаю какой у вас уровень, но первое что пришло в голову, это что вы пытаетесь использовать переменную объявленную внутри функции success в другом месте в коде. Это так?

[Kovalsky]

Владислав Васильев: и ещё - если вы убрали дататайп, то вам придётся вызывать JSON.parse().
Если вы используете JSON дататайп, в вашу функцию success уже передаётся объект.

Вот два варианта, первый без типа, второй с типом, оба у меня работают:

$.ajax({
  type: 'GET',
  url: 'localhost?a',
  async: true,
  data: 'track_hash=760e07bb98d02f0887f20f7ba75e7581',
  contentType: "application/json",
  success: function(response) {
    object = JSON.parse(response)

    var track_name = object['track_name'],
        track_author = object['track_author'];
    
    console.log(track_author + ' - ' + track_name);
  },
  error: function(e) {
    console.log(e.message)
  }
})

$.ajax({
  type: 'GET',
  url: 'localhost?a',
  async: true,
  data: 'track_hash=760e07bb98d02f0887f20f7ba75e7581',
  dataType: 'json',
  contentType: "application/json",
  success: function(object) {
    var track_name = object['track_name'],
        track_author = object['track_author'];
    
    console.log(track_author + ' - ' + track_name);
  },
  error: function(e) {
    console.log(e.message)
  }
})

[Владислав Васильев]

Никита Полевой: Вариант с JSON.parse пробовал сразу же, когда вы попросили убрать dataType, но получаю следующую ошибку: "Uncaught SyntaxError: Unexpected token  in JSON at position 0"

[Владислав Васильев]

Никита Полевой: Я, походу, понял в чем искать проблему. Я заметил, что хром жалуется на пробел, перед массивом json, который я вывожу. А именно - ufeff, он находится перед самой первой фигурной скобкой массива json {

[Владислав Васильев]

Никита Полевой: Проблема решена. Я по глупости и невнимательности в Sublime Text сохранил php-файл в UTF-8 WITH BOM. Очень глупая ошибка, а стоила столько времени. Спасибо Вам большое за помощь!

Answer 1

[Владислав Васильев]

Проблема решена. Я по глупости и невнимательности в Sublime Text сохранил php-файл, который генерировал json, в UTF-8 WITH BOM. Очень глупая ошибка, а стоила столько времени. Всем большое спасибо за помощь!

Answer 2

[Кирилл Жиляев]

Вы обращайтесь как к массиву, а надо как к объекту.

$.ajax({
        type: 'GET',
        url: '../Data/Scripts/GetTrackInfo.php',
        async: true,
        data:'track_hash=760e07bb98d02f0887f20f7ba75e7581',
        contentType: "application/json",
        dataType: 'json',
 success: function(json) {
         var track_name = json.track_name;
         var track_author = json.track_author;
         $('#latest-tracks').html('<div class="list-group"><a class="list-group-item"><strong>Название:</strong>'+track_author+' - '+track_name+'</a></div>');
  },
  error: function(e) {
         console.log(e.message)
   }
})

Попробуйте это. Js код.