Методи за изпращане на форми в JavaScript

Формите могат да бъдат изпратени по два начина: чрез метод GET или метод POST. Начинът на изпращане на формата се регулира от атрибута method на формата.

Например, нека зададем метод GET за изпращане на формата:

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

А сега метод POST:

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

Нека сега да видим каква е разликата между двата метода за изпращане. В случая на метода GET данните от формата ще се виждат в браузъра под формата на така наречения низ от параметри (query string), представляващ двойки от вида ключ-стойност, където ключът ще бъде името на елемента от формата, а стойността - въведените в него данни. При това двойките стойности ще бъдат разделени с амперсанди.

Данните, изпратени чрез метод GET, ще попаднат на нашия сървър в свойството get на обекта с данни:

server.jsexport default {
  '/handler/': function(data) {
    console.log(data.get); // ще се изведе в конзолата на сървъра
    return 'form data received';
  }
}

А данните, изпратени чрез метод POST, ще попаднат на нашия сървър в свойството post на обекта с данни:

server.jsexport default {
  '/handler/': function(data) {
    console.log(data.post); // ще се изведе в конзолата на сървъра
    return 'form data received';
  }
}

За по-кратко може да се направи деструктуриране, за да се получат данните в отделна променлива:

server.jsexport default {
  '/handler/': function({get, post}) {
    console.log(get);
    console.log(post);
    return 'form data received';
  }
}