Pošiljanje POST zahtevkov prek AJAX v JavaScriptu

Poglejmo si zdaj pošiljanje POST zahtevka na strežnik. Za to ima funkcija fetch drugi parameter z nastavitvami. V nastavitvi method določimo metodo HTTP zahtevka. Določimo metodo POST:

public/client.jsbutton.addEventListener('click', function() {
  let promise = fetch('/handler/', {
    method: 'post',
  });
});

Določimo tudi podatke, ki jih želimo poslati na strežnik. V POST zahtevkih se podatki prenašajo v telesu HTTP zahtevka. Za to jih je treba navesti v nastavitvi body. Določimo jih v obliki Query String, in določimo ustrezen MIME tip:

public/client.jsbutton.addEventListener('click', function() {
  let promise = fetch('/handler/', {
    method: 'post',
    body: 'num1=1&num2=2',
    headers: {
      'Content-Type': 'application/x-www-form-urlencoded',
    },
  });
});

Te podatke bomo prejeli na strežniku, nekaj z njimi naredili in jih poslali nazaj:

server.jsexport default {
  '/handler/': function({ post }) {
    return Number(post.num1) + Number(post.num2);
  }
}
Задание 1

Na stranki sta div in gumb. Ob kliku na gumb pošljite na strežnik tri številke z metodo POST. Naj strežnik poišče vsoto poslanih števil. Rezultat zapišite v div.