JavaScript'te Form Gönderme Yöntemleri

Formlar iki şekilde gönderilebilir: GET yöntemi veya POST yöntemi. Formun gönderilme şekli, formun method niteliği ile düzenlenir.

Örneğin, form için GET gönderme yöntemini belirtelim:

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

Ve şimdi POST yöntemi:

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

Şimdi iki gönderme yöntemi arasındaki farkı görelim. GET yöntemi durumunda, form verileri tarayıcıda sözde sorgu dizesi (query string) olarak adlandırılan, anahtar-değer çiftleri şeklinde görünecektir; burada anahtar, form elemanının adı, değer ise içine girilen veriler olacaktır. Ayrıca, değer çiftleri ampersand işaretleri ile ayrılacaktır.

GET yöntemi ile gönderilen veriler, sunucumuzda veri nesnesinin get özelliğine düşecektir:

server.jsexport default {
  '/handler/': function(data) {
    console.log(data.get); // sunucu konsoluna yazdırılacak
    return 'form data received';
  }
}

POST yöntemi ile gönderilen veriler ise sunucumuzda veri nesnesinin post özelliğine düşecektir:

server.jsexport default {
  '/handler/': function(data) {
    console.log(data.post); // sunucu konsoluna yazdırılacak
    return 'form data received';
  }
}

Kısaca, verilerimizi ayrı bir değişkene almak için yıkım işlemi yapılabilir:

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