Afsendelse af GET-forespørgsler via AJAX i JavaScript

Lad os nu lære at sende data til serveren i en AJAX-forespørgsel. Serveren vil gøre noget med disse data og sende os tilbage et resultat.

Vores testserver vil behandle data sendt til adressen /handler/:

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

Lad os starte med at sende en GET forespørgsel:

public/client.jsbutton.addEventListener('click', function() {
  let promise = fetch('/handler/?num=3');
});

Lad os modtage de sendte data på serversiden:

server.jsexport default {
  '/handler/': function({get}) {
    console.log(get.num); // vil udskrive 3
  }
}

Lad os gøre noget med disse data og sende dem tilbage:

server.jsexport default {
  '/handler/': function({get}) {
    return get.num ** 2;
  }
}

På klientsiden modtager vi resultatet og udskriver det et sted:

public/client.jsbutton.addEventListener('click', function() {
  fetch('/handler/?num=3').then(
    response => {
      return response.text();
    }
  ).then(
    text => {
      console.log(text);
    }
  );
});
Задание 1

På klienten er der givet en div og en knap. Ved klik på knappen, send to tal til serveren. Lad serveren finde summen af de sendte tal. Resultatet skrives i div'en.

Задание 2

Lad der på serveren være givet et array. Lad serveren forvente, at der sendes et tal som parameter, og returner array-elementet, der svarer til det pågældende tal. Ved klik på en knap, send et tal til serveren, og skriv serverens svar i et afsnit.