Синхронная загрузка данных

124

24 ноября 2018, 13:10

Я новичок в PHP и JS. Пишу некоторый скрипт, который передает запросы на два api. Только проблема в том, что один api быстро возвращает ответ а второй не очень(~15-30сек).

Соответственно ответ с первого API я вывожу в один DIV, ответ второго во второй. Сейчас скрипт ждет ответа от двух запросов и потом выдает страницу пользователю, выходит то примерно секунд 30 пользователь просто смотрит в белый экран и ждет ответа.

Сейчас все написано на php. Логика примерно следующая.

<?php 
//файл для работы с API 
require_once('./libs/class.php');  
 
// Если ничего не передали 
if(empty($_POST['search']) )	 
    //одали пустую форму 
//если заполнили форму 
elseif(!empty($_POST['search'])){  
  //вызвали api, получили ответ и отдали пользователю.  
} 
?>

И это слишком долго. Как асинхронно выполнить второй запрос? Понимаю что с помощью js, но как не понимаю.

С Уважением, Waik/

Answer 1

Делаем 2 отдельных асинхронных запроса:

<script>
$(document).ready(function() {
  $.ajax({ // отправляем асинхронный запрос
    url: "/api1.php",
    method: "POST",
    data: { search : $('#search').val() } // берем данные для поиска
  }).done(function(data) {
    $( '#div1' ).html(data); // вставляем результат
  });
  $.ajax({
    url: "/api2.php",
    method: "POST",
    data: { search : $('#search').val() }
  }).done(function(data) {
    $( '#div2' ).html(data);
  });
});
</script>

На бекенде делаем 2 отдельных скрипта api1.php и api2.php