Metody odesílání formulářů v JavaScriptu

Formuláře mohou být odeslány dvěma způsoby: metodou GET nebo metodou POST. Způsob odesílání formuláře je řízen atributem method formuláře.

Například nastavme pro formulář metodu odesílání GET:

public/form.html<form action="/handler/" method="GET">
  <input name="test1">
  <input name="test2">
  <input type="submit">
</form>

A nyní metoda POST:

public/form.html<form action="/handler/" method="POST">
  <input name="test1">
  <input name="test2">
  <input type="submit">
</form>

Pojďme se nyní podívat, v čem je rozdíl mezi dvěma metodami odesílání. V případě metody GET budou data formuláře viditelná v prohlížeči ve formě tzv. řetězce parametrů (query string), představující páry typu klíč-hodnota, kde klíčem bude název elementu formuláře a hodnotou - zadaná data. Přitom páry hodnot budou odděleny ampersandy.

Data odeslaná metodou GET se dostanou na našem serveru do vlastnosti get objektu s daty:

server.jsexport default {
  '/handler/': function(data) {
    console.log(data.get); // vypíše se do konzole serveru
    return 'data formuláře přijata';
  }
}

A data odeslaná metodou POST se dostanou na našem serveru do vlastnosti post objektu s daty:

server.jsexport default {
  '/handler/': function(data) {
    console.log(data.post); // vypíše se do konzole serveru
    return 'data formuláře přijata';
  }
}

Pro zkrácení lze provést destrukturalizaci, abychom získali naše data do samostatné proměnné:

server.jsexport default {
  '/handler/': function({get, post}) {
    console.log(get);
    console.log(post);
    return 'data formuláře přijata';
  }
}