У меня проблемы с запросами POST и GET. На моей стороне сервера вплоть до момента перед отправкой у меня есть то, что я ожидал, но затем на моей стороне клиента я получаю что-то не в порядке. Например, эти два должны быть в обратном порядке, который у меня здесь:

Отправка с сервера {"grid": ["", "", "", "", "", "", "", "", ""], "победитель": ""}
Получено на сервере: {"grid": ["X", "", "", "", "", "", "", "", ""], "Winner": ""}

function sendData(json) {
        $.ajax({
           type: "POST",
           url: "/ttt",
           data: json,
           dataType: "json",
           success: receiveData()
        });
    }

function receiveData() {
   
    var response = $.ajax({
        type: "GET",
        url: "/ttt",
        dataType: "json",
        success: function(){
            grid = response.responseJSON;
            console.log("Receved at client: " + JSON.stringify(grid));
        }
    });
   console.log("Also after receiving " + JSON.stringify(grid));
}



-1
Espinal 17 Фев 2018 в 04:38

1 ответ

Лучший ответ

Вы делаете частую ошибку. Здесь для receiveData необходимо использовать ссылку на функцию без скобок. Измените это:

function sendData(json) {
    $.ajax({
       type: "POST",
       url: "/ttt",
       data: json,
       dataType: "json",
       success: receiveData()
    });
}

К этому:

function sendData(json) {
    $.ajax({
       type: "POST",
       url: "/ttt",
       data: json,
       dataType: "json",
       success: receiveData     // no parens here
    });
}

Когда вы включаете скобки, он вызывает функцию НЕМЕДЛЕННО и помещает возвращаемое значение из функции в качестве обработчика успеха, и, таким образом, вы видите, что они работают не по порядку. Вы хотите передать ссылку на функцию, которую можно вызвать позже. Ссылка на функцию - это имя функции без скобок.


Также похоже, что у вас есть еще одна ошибка в receiveData(). Вы используете неправильный ответ для ответа. Ответ не возвращается от $.ajax(). Ответ передается обработчику успеха.

Я не знаю точно, как должен выглядеть ваш ответ, но измените это:

function receiveData() {

    var response = $.ajax({
        type: "GET",
        url: "/ttt",
        dataType: "json",
        success: function(){
            grid = response.responseJSON;
            console.log("Receved at client: " + JSON.stringify(grid));
        }
    });
   console.log("Also after receiving " + JSON.stringify(grid));
}

Примерно так:

function receiveData() {

    $.ajax({
        type: "GET",
        url: "/ttt",
        dataType: "json",
        success: function(response){
            grid = response.responseJSON;
            console.log("Received at client: " + JSON.stringify(grid));
            console.log("Also after receiving " + JSON.stringify(grid));
        }
    });
}

И поскольку ваши вызовы ajax асинхронны, у вас также есть этот оператор console.log("Also after receiving " + JSON.stringify(grid)); не в том месте. Если вы хотите увидеть результаты сетки после ее изменения, вы должны поместить это в обработчик успеха.


Сводка исправлений

  1. Измените success: receiveData() на success: receiveData.
  2. Используйте response, поскольку он передается обработчику успеха.
  3. Поместите console.log(), чтобы увидеть окончательные результаты внутри обработчика success.

Похоже, вы не можете полностью понять, как вызовы ajax являются асинхронными и что это на самом деле означает для вашего программирования. Я бы посоветовал поискать и почитать по этой теме. Узнав это сейчас, вы избавитесь от многих мучений по мере вашего развития.

3
jfriend00 17 Фев 2018 в 04:49