Mehrere Artikel mit AJAX in den Warenkorb legen, nur einer wird verarbeitet

Question

Ich habe einen Einkaufswagen, zu dem Artikel mit einer AJAX-Anfrage hinzugefügt werden. Die Anfrage Beiträge zu Laravel 5.4. Alles funktioniert gut, wenn ich nacheinander mehrere "Zum Warenkorb hinzufügen" -Schaltflächen anklicke. Dann werden die AJAX-Anfragen nicht gleichzeitig ausgeführt. Aber wenn ich diese Knöpfe schnell nacheinander anklicke, werden die AJAX-Anfragen gleichzeitig ausgeführt und nur ein Gegenstand wird dem Wagen hinzugefügt.

Die jQuery:

$('.add-to-cart').on('click', function (event) { 
    // Get the product/service ID. 
    var item = $(this).attr('data-id'); 

    $.post('/cart', { 
     action: 'addItem', 
     data: item 
    }, 'json').done(function (response) { 
     // Hide .add-to-cart and show .go-to-checkout 
    }); 
}); 

Die PHP:

public function addItem(Request $request) 
{ 
    // Get item from request. 
    $item = $request->get('data'); 

    // Store item in session. 
    $request->session()->push('cart.items', [$item]); 

    // Return JSON response. 
    return response()->json([]); 
} 

Als ich async: false in meiner AJAX-Request verwenden, werden alle Artikel in den Warenkorb gelegt, egal wie schnell ich sie hinzufügen. Da diese Option jedoch veraltet ist, ist es nicht richtig, sie zu verwenden. Ich habe auch Alternativen wie Promises angeschaut, aber ich weiß nicht, wie ich sie in meinem Fall anwenden soll.

Ich versuche herauszufinden, warum nur ein Artikel verarbeitet wird, wenn mehrere Artikel schnell nacheinander hinzugefügt werden. Ich hoffe, ihr könnt mir helfen!

Answer 1

Es scheint, wie Sie die laravel-locking-session Bibliothek verwenden können Laravel halten von Ihrer Sitzung Daten überschrieben werden. Ich habe es nicht benutzt, aber es behauptet, das genaue Problem zu beheben, das Sie erfahren.

https://github.com/rairlie/laravel-locking-session

Answer 2

Vielleicht ist es möglich, Elemente in js-Code zu sammeln und sie dann an Ajax zu übergeben.

Die jQuery:

$('.add-to-cart').on('click', function (event) { 
var items = {COLLECT_ITEMS_FUNCTION}; 
$.post('/cart', { 
    action: 'addItems', 
    data: items 
}, 'json').done(function (response) { 
    // Hide .add-to-cart and show .go-to-checkout 
});}); 

Die PHP:

public function addItems(Request $request) { 
$items = $request->get('data'); 

foreach ($items as $item) { 
    // Store item in session. 
    $request->session()->push('cart.items', [$item]); 
} 

// Return JSON response. 
return response()->json([]);}