Проблемы с отправкой JSON через jQuery AJAX запросы

Оффтоп javascript
1

Помогите разобраться с jQuery AJAX и JSON

Сталкиваюсь с непонятной ситуацией при отправке данных на сервер. У меня есть API endpoint, который принимает только JSON формат (application/json).

Проблема в том, что когда передаю обычный JavaScript объект, получаю ошибку 400. А если передаю уже готовую JSON строку, то все работает отлично.

Вот мой код для примера:

var userRating = { score: 5, comment: "отлично" }; // не работает
var userRatingString = '{"score": 5, "comment": "отлично"}'; // работает

$.ajax({
    url: "/api/feedback",
    data: userRating,
    method: "POST",
    contentType: "application/json",
    success: function(response){
        alert("Данные отправлены: " + response);
    }
});

Почему jQuery не преобразует объект в правильную JSON строку автоматически? Что я делаю неправильно?

2

Та же фигня была месяц назад! jQuery всегда делает url-encoded сериализацию, даже когда ставишь json в content-type. Заголовки врут серверу о том, что реально приходит. Потратил полдня на отладку этого бреда. Теперь всегда JSON.stringify() использую для json api. Или добавляй processData: false — тогда jquery данные не трогает.

3

Да, классика! jQuery всегда шлет данные как form-encoded, даже когда ты ставишь application/json в contentType. Без JSON.stringify() заголовок говорит одно, а данные идут в другом формате. Сервер ждет JSON, получает form-data - вот тебе и 400 ошибка. Кстати, смотрел что сервер отвечает при ошибке?

4

jQuery не сериализует объекты в JSON автоматически. Если ставишь contentType: "application/json", то нужно самому конвертить через JSON.stringify(). Вот как исправить:

$.ajax({
    url: "/api/feedback",
    data: JSON.stringify(userRating),
    method: "POST",
    contentType: "application/json",
    success: function(response){
        alert("Данные отправлены: " + response);
    }
});

Да, это может запутать поначалу, но правило простое: всегда сериализуй объект перед отправкой.