如何从 Fetch API 向服务器发送 POST 请求？ 示例不起作用

Question

I can't send a post request to the server. For some reason, the reguest.POST on the server is empty. Below are code examples

JS on front

let weekends = []
    await fetch('{% url "get_weekends" %}', {
        method: 'POST', headers: new Headers({'Accept': 'application/json', 'Content-Type': 'application/json'}),
        params: {after: after_str, before: before_str}
    }).then(function (response) {
        return response.json();
    }).then(function (data) {
        if (data['status'] === 'ok') {
            weekends = data['weekends']
        } else {
            console.error(data)
            show_error('Не удалось получить список ваших выходных! Ошибка в статусе!')
        }
    }).catch(function (e) {
        console.error(e)
        show_error('Не удалось получить список ваших выходных! Не удалось выполнить запрос!')
    });

after_str and before_str saved str data (01.12.2021 and 31.12.2021)

Python on backend

def get_weekends_view(request):
""" Вью возвращает список выходных пользователя в заданном промежутке времени """

form = GetAfterAndBeforeForm(request.POST)

if form.is_valid():
    after, before = form.cleaned_data['after'], form.cleaned_data['before']

    result = []
    for weekend in Weekend.objects.filter(user=request.user, date__range=(after, before)):
        result.append({'date': weekend.date.strftime('%d.%m.%Y'), 'status': weekend.get_status_display()})

    return {'status': 'ok', 'weekends': result}
else:
    return {'status': 'error', 'msg': 'Форма заполнена не верно! ' + str(request.POST)}

forms

class GetAfterAndBeforeForm(forms.Form):
    after = forms.DateField()
    before = forms.DateField()

Answer 1

Try this:

await fetch('{% url "get_weekends" %}', {
    method: "POST",
    headers: {
        Accept: "application/json",
        "Content-Type": "application/json",
    },
    params: JSON.stringify({ after: after_str, before: before_str }),
});