GetJSON Synchronous

ЦЕЛЬ: Мне нужно получить данные из базы данных и обновить main.php(более очевидно через draw_polygon) каждый раз, когда что-то добавляется в базу данных (после $.ajax to submit_to_db.php).

Итак, в основном у меня есть main.php, который будет ajax вызывать другой php для получения массива, который будет сохранен в базе данных, а json-вызов другого php для возврата массива будет использоваться main.php.

$(document).ready(function() {
    get_from_db();
    $('#button_cancel').click(function(){
       $.ajax({
          url: 'submit_to_db.php',
          type: 'POST',
          data: {list_item: selected_from_list},

          success: function(result){
             ...
             get_from_db();
          }
       });
    });
    function get_from_db(){
         $.getJSON('get_from_db.php', function(data) {
             ...
             draw_polygon(data);
         });
    }
 });

В моем случае, что я сделал, это вызов функции get_from_db для getJSON, чтобы фактически получить данные из базы данных с данными, которые будут использоваться для draw_polygon. Но как это должно быть сделано? Я полный новичок, и это мой первый раз попробовать getJSON и ajax, если честно. Итак, мой вопрос: как работает асинхронная работа? Есть ли другой способ обхода этого решения вместо того, чтобы вызвать функцию get_from_db с getJSON (это не синхронно, не так ли? Почему он не обновляет страницу, когда она не входит в функцию?) Все время - как $.ajax с async: false (кстати, я не мог заставить его работать). Мой подход работает, но я подумал, что, возможно, есть и другие способы сделать это. Мне бы хотелось узнать, как это сделать. Заранее спасибо. Надеюсь, у меня есть смысл.

Чтобы сделать его более понятным, вот чего я хочу достичь:

  • @start страницы, получить данные из базы данных (в настоящее время через getJSON)
  • Покрасьте или нарисуйте canvas с помощью data
  • Когда я нажимаю кнопку "Готово", она обновляет базу данных
  • Я хочу, чтобы АВТОМАТИЧЕСКИ снова получить данные, чтобы перерисовать изменения в холсте.

Ответы

Ответ 1

Асинхронно означает, что запрос выполняется в фоновом режиме и вызывает вашу функцию, когда она получила ответ. Этот метод лучше всего, если вы хотите получить результат, но разрешите использовать приложение в запросе. Если вы хотите получить прямой ответ, взгляните на запрос синхронизации. этот запрос приостанавливает выполнение script до тех пор, пока не получит ответ, и пользователь не сможет ничего сделать, пока не будет получен ответ. Вы можете переключать его через:

async: false,

Итак, например:

$.ajax({
    url: "myurl",
    async: false,
    ...
})

Ответ 2

Так как $.getJSON() использует ajax-конфигурации, просто установите глобальные конфигурации ajax:

// Set the global configs to synchronous 
$.ajaxSetup({
    async: false
});

// Your $.getJSON() request is now synchronous...

// Set the global configs back to asynchronous 
$.ajaxSetup({
    async: true
});

Ответ 3

$. getJSON(), не принимает конфигурацию, как сказано в документах, это сокращенная версия:

$.ajax({
  dataType: "json",
  url: url,
  data: data,
  success: success
});

Так что просто перепишите свой запрос с точки зрения этого, и async: false будет работать так, как вы ожидаете.

Ответ 4

$.getJSON() - сокращенное обозначение для $.ajax(), которое может быть сконфигурировано как синхронное (см. jQuery.getJSON и JQuery.ajax):

$.ajax({
  dataType: "json",
  url: url,
  data: data,
  async: false, 
  success: function(data) {
      ...
      draw_polygon(data);
  }
});

Попробуйте избежать синхронных вызовов. Цитата из jQuery doc (см. Async prop):

Запросы междоменных и dataType: запросы "jsonp" не поддерживают синхронная работа. Обратите внимание, что синхронные запросы могут временно заблокируйте браузер, отключив любые действия, пока запрос активен.

Возможно, вы захотите попробовать jQuery Отложить следующим образом:

var jqxhr = $.getJSON(url);
jqxhr.done(function(data) {
    ...
    draw_polygon(data);
});