POST istekleri
method, body ve headers ile bir POST isteği göndermeyi öğrenirsin.
POST ile veri gönderme
Bir POST isteği sunucuya yeni veri gönderir. fetch'in ikinci parametresinde method, body ve headers seçeneklerini birlikte verirsin.
const response = await fetch(url, {
method: 'POST',
body: 'hello',
headers: { 'Content-Type': 'text/plain' }
});method isteğin türünü, body gönderilen veriyi taşır. body bir metin olabileceği gibi bir FormData ya da Blob da olabilir. Sunucunun gövdeyi doğru okuyabilmesi için Content-Type başlığını da eklersin.
Yanıt durum kodunu kontrol etme
Bir POST isteğinden sonra sunucunun yanıtı response.status ile kontrol edilir. Yeni bir kaynak oluşturulduğunda sunucu genellikle 201 döndürür.
const response = await fetch(url, { method: 'POST', body: 'hello' });
console.log(response.status);Başarılı bir istek 2xx aralığında bir kod verir. 200 genel başarılı, 201 yeni kaynak oluşturuldu, 400 ise istemci hatasıdır. Yanıtın ayrıntılarına gövdeden ulaşabilirsin.
Uygulama Bir POST isteği yap ve durum kodunu yazdır
url değişkeni bir adresi tutuyor. İkinci parametre olarak { method: 'POST', body: 'hello', headers: { 'Content-Type': 'text/plain' } } vererek bir fetch isteği yap ve yanıtı response değişkenine al. Sonra response.status değerini console.log ile yazdır.
Örnek çözümü göster
const response = await fetch(url, {
method: 'POST',
body: 'hello',
headers: { 'Content-Type': 'text/plain' }
});
console.log(response.status);Kendini test et
-
Seçenekleri anlamlarıyla eşleştir
- method: 'POST'
- İsteğin türünü belirler
- body: 'hello'
- Gönderilen veriyi taşır
- headers: { ... }
- Başlıkları içerir
-
Sunucuda yeni bir kaynak oluşturmak için hangi method kullanılır?
// A method: 'GET' // B method: 'DELETE' // C method: 'PUT' // D method: 'POST'- A
- B
- C
- D
Cevabı göster
D — Doğru! POST yeni bir kaynak oluşturmak için kullanılır.
-
POST seçeneklerini yaz
const response = await fetch(url, { ____: 'POST', body: 'hello' });Cevabı göster
const response = await fetch(url, { method: 'POST', body: 'hello' });