Ajax не вижу Post Controller

Question

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

My Post Controller:

@RestController
public class AddProductController extends AbstractController {
    private static final long serialVersionUID = 5023867691534917359L;
    private static final Logger LOGGER = LoggerFactory.getLogger(AddProductController.class);

    @PostMapping("/ajax/json/product/add")
    public ShoppingCart addProductToCart(HttpServletRequest req,
                                 @RequestParam(name = "idProduct") String idProduct,
                                 @RequestParam(name = "count") String count)  {

        ProductForm productForm = createProductForm(idProduct, count); 
        ShoppingCart shoppingCart = SessionUtil.getCurrentShoppingCart(req); // Get ShoppingCart
        orderService.addProductToShoppingCart(productForm, shoppingCart); // Add product in Cart
        return shoppingCart;
    }

Ajax запрос:

var addProductToCart = function (){
        var idProduct = $('#addProductPopup').attr('data-id-product');
        var count = $('#addProductPopup .count').val();
        var btn = $('#addToCart');
        convertButtonToLoader(btn, 'btn-primary');
        $.ajax({
            url : '/ajax/json/product/add',
            method : 'POST',
            data: {
                idProduct : idProduct,
                count : count
            },
            success : function(data) {
                $('#currentShoppingCart .total-count').text(data.totalCount);
                $('#currentShoppingCart .total-cost').text(data.totalCost);
                $('#currentShoppingCart').removeClass('hidden');
                convertLoaderToButton(btn, 'btn-primary', addProductToCart);
                $('#addProductPopup').modal('hide');
            },
            error : function(xhr) {
                convertLoaderToButton(btn, 'btn-primary', addProductToCart);
                if (xhr.status == 400) {
                    alert(xhr.responseJSON.message);
                } else {
                    alert('Не сработала JS функция добавления в коризну');
                }
            }
        });
    };   

Что не так с моим PostController?

Answer 1

Jquery. ajax не кодирует данные POST для вас автоматически, как это делается для данных GET. Jquery ожидает, что ваши данные будут предварительно отформатированы для добавления к телу запроса, которое будет отправлено непосредственно по сети.

Решение состоит в том, чтобы использовать функцию jQuery .param для построения строки запроса, которая обрабатывает POST ожидаемых запросов.

Измените объект данных в вашем методе на следующий формат, и, надеюсь, он будет работать.

    data: jQuery.param({ idProduct : idProduct, count : count }),
    contentType: 'application/x-www-form-urlencoded; charset=UTF-8'

Answer 2

Измените ajax, как показано ниже. Вам не нужно отправлять data, потому что вы не ожидаете данных в body в вашем контроллере почты.

$.ajax({
            url : '/ajax/json/product/add?idProduct='+idProduct+'&count='+count,
            method : 'POST',
            success : function(data) {
                $('#currentShoppingCart .total-count').text(data.totalCount);
                $('#currentShoppingCart .total-cost').text(data.totalCost);
                $('#currentShoppingCart').removeClass('hidden');
                convertLoaderToButton(btn, 'btn-primary', addProductToCart);
                $('#addProductPopup').modal('hide');
            },
            error : function(xhr) {
                convertLoaderToButton(btn, 'btn-primary', addProductToCart);
                if (xhr.status == 400) {
                    alert(xhr.responseJSON.message);
                } else {
                    alert('Не сработала JS функция добавления в коризну');
                }
            }
        });