Enviando requisições GET via AJAX em JavaScript

Agora vamos aprender a enviar dados para o servidor em uma requisição AJAX. O servidor fará algo com esses dados e nos enviará de volta o resultado.

Nosso servidor de teste processará os dados enviados para o endereço /handler/:

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

Para começar, vamos enviar uma requisição GET:

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

Vamos obter os dados enviados no lado do servidor:

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

Vamos fazer algo com esses dados e enviá-los de volta:

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

No lado do cliente, obteremos o resultado e o exibiremos em algum lugar:

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