将 Laravel 分页与 Ajax 请求一起使用

Question

我有一个为客户收集 GeoLocation 数据的 javascript 函数。数据源是一个 Laravel API：

public function GeoLocationList($officeid=NULL)
{

    $customers= Customers::where('office_id', $officeid);
    $paginate_count =  5;
    $customers= $customers->paginate($paginate_count);
    return $this->response->paginator($customers, new CustomerTransformer);
}

我正在使用网站 GeoCod.io 并且不确定请求的并发限制是多少，或者它是否会在某些时候由于其他原因出错，所以我想我会批量处理它们，因为有几千条记录要打通。

几天前我在玩 ajax 请求时，我一直在尝试在请求之间设置超时/睡眠/延迟，但显然已弃用。我从我的 Firefox 控制台日志中获得了该信息，并被定向到：https://xhr.spec.whatwg.org/。我没有保存它的确切文本，但它是关于用户体验改进的东西......无论意图如何，我都不知道如何减慢它的速度，我不想最终打到他们的服务器一次 5,000 个请求。

这是我用来获取坐标数据的 javascript：

<?PHP 
$customer_json= json_encode($customers->toArray()); 
echo "var customers= ". $customer_json . ";\n";
  ?>
var results=[];
for(var i=0; i<customers.data.length; i++){
  var customer ={};

  if (customers.data[i]['address']){
    var customer_address = customers.data[i]['address'].replace(/ /g,"+") + "+";
    if (customers.data[i]['city']){
    customer_address += "+" + customers.data[i]['city'].replace(/ /g,"+");
    }
    if (customers.data[i]['state']){
    customer_address += "+" + customers.data[i]['state'].replace(/ /g,"+");

    }
    if (customers.data[i]['zip']){
    customer_address += "+" + customers.data[i]['zip'].replace(/ /g,"+");
    }
    var address = "https://api.geocod.io/v1.3/geocode?q=?" + customer_address + "&api_key=REMOVED";
    $.ajax({
        type : 'GET',
        url : address,
        dataType : "json",
        timeout: 1000,
        async: false,
        success: function(response){
          if(isEmpty(response["results"]) !=true){
            var location = response["results"][0]["location"];
            customer= { "customer_id":customers.data[i]["id"],"geo":{}};
            customer.geo = location;
            results[i]=customer;
          }
        }   
    });   
  }

}

我尝试使用事件处理程序，但它最终陷入了无限循环

var ajaxRunning = false;
for(var p=1; p<=total_pages; p++){
  if(ajaxRunning == false){
    ajaxRunning=true;
    GetCustomerList(p);
    console.log( "Starting ajax. Page: " + p );

  }else{
    console.log( "Adding ajaxStop handler. Page: " + p );

    $( document ).ajaxStop(function() {
      console.log( "Triggered ajaxStop handler. Page: " + p );
      GetCustomerList(p);
    });
  }

}
function GetCustomerList(page) {           
  $.ajax({
    type: 'GET',
      url: '{{ url('api/customers/GeoLocationList') }}/1?paginate_count=' + pagination_count + '&page=' + page,
      dataType: 'json',
      success: function (data, status, xhr) {
        console.log(data.data);
      },
      error: function(xhr) {
        swal(xhr.responseJSON.message);
      },
      cache: false
  });
}

控制台吐出这样的信息，永远不会结束，我们会看到有关同步请求的错误。只有 9 页，但它一直在要求第 10 页，这就是为什么我得到一堆空数组的原因，但这实际上并不是问题，因为它无休止地循环并且没有等待它在每个之间完成：

Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user’s experience. For more help http://xhr.spec.whatwg.org/ jquery-3.2.1.min.js:4:15845
Starting ajax. Page: 1 100:1200:5
Adding ajaxStop handler. Page: 2 100:1203:5
Adding ajaxStop handler. Page: 3 100:1203:5
Adding ajaxStop handler. Page: 4 100:1203:5
Adding ajaxStop handler. Page: 5 100:1203:5
Adding ajaxStop handler. Page: 6 100:1203:5
Adding ajaxStop handler. Page: 7 100:1203:5
Adding ajaxStop handler. Page: 8 100:1203:5
Adding ajaxStop handler. Page: 9 100:1203:5
Array(1000) [ {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, … ]
100:1218:9
Triggered ajaxStop handler. Page: 10
100:1206:7
Array []
100:1218:9
Array []
100:1218:9
Array []
100:1218:9
Array []
100:1218:9
Array []
100:1218:9
Array []
100:1218:9
Array []
100:1218:9
Array []
100:1218:9
Triggered ajaxStop handler. Page: 10
100:1206:7
Array []
100:1218:9
Array []
100:1218:9
Array []
100:1218:9
Array []
100:1218:9
Array []
100:1218:9
Array []
100:1218:9
Array []
100:1218:9
Array []
100:1218:9

我怎样才能以 5-10 个批次进行我的 ajax 调用，并且之间有延迟？

Answer 1

来自 geocod.io 的 Mathias 在这里。

我们没有任何硬性的速率限制，因此单独的 GET 请求绝对可行。

也就是说，由于开销减少，您肯定会看到使用批处理请求的处理速度更快。

你提到你正在使用 Laravel。您是否考虑过使用 JavaScript 在服务器端而不是客户端进行地理编码？当有多个查找时，这通常是最好的解决方案。

请随时通过我们网站右下角的实时聊天直接与我们联系，以便我们实时为您提供帮助。