Űrlapok elküldési módszerei JavaScriptben

Az űrlapok kétféleképpen küldhetők el: GET vagy POST módszerrel. Az űrlap elküldési módját az űrlap method attribútuma szabályozza.

Például állítsuk be az űrlap számára a GET elküldési módszert:

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

És most a POST módszer:

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

Most nézzük meg, mi a különbség a két elküldési módszer között. A GET módszer esetén az űrlap adatai a böngészőben láthatók az úgynevezett paraméter sztring (query string) formájában, amely kulcs-érték párokat jelent, ahol a kulcs az űrlapelem neve, az érték pedig a beírt adatai. Ebben az esetben az értékpárok & jelekkel lesznek elválasztva.

A GET módszerrel elküldött adatok a szerverünkön az adatobjektum get tulajdonságába kerülnek:

server.jsexport default {
  '/handler/': function(data) {
    console.log(data.get); // a szerver konzoljában jelenik meg
    return 'form data received';
  }
}

A POST módszerrel elküldött adatok pedig a szerverünkön az adatobjektum post tulajdonságába kerülnek:

server.jsexport default {
  '/handler/': function(data) {
    console.log(data.post); // a szerver konzoljában jelenik meg
    return 'form data received';
  }
}

A rövidség kedvéért használhatunk destruktrálást, hogy az adatainkat külön változóba kapjuk:

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