fetch temelleri

fetch ile bir GET isteği yapmayı ve Response nesnesini öğrenirsin.

fetch nedir?

fetch, modern tarayıcılarda bir sunucuya HTTP isteği göndermenin standart yoludur. İlk parametre olarak bir URL alır ve bir Promise döndürür; bu promise bir Response nesnesiyle sonuçlanır.

const response = await fetch('https://api.example.com/users');

Dönen Response nesnesi isteğin yanıtını temsil eder: durum kodu, başlıklar ve gövde gibi bilgilere erişim sağlar. fetch varsayılan olarak bir GET isteği yapar; yani yalnızca veri okur, sunucuda değişiklik yapmaz. Yanıtı işlemek için await ile promise'i beklersin.

Response nesnesi

Bir fetch çağrısı tamamlandığında sana bir Response nesnesi verir. Bu nesne üzerinden yanıtın temel özelliklerini okursun.

console.log(response.status);
console.log(response.ok);
console.log(response.headers.get('Content-Type'));

status HTTP durum kodunu (örnek: 200, 404), ok ise isteğin başarılı olup olmadığını true/false olarak verir. headers üzerinden yanıtın başlıklarına tek tek ulaşabilirsin. Bunlar yalnızca yanıtın üst bilgileridir; gövde ayrı okunur.

Uygulama Bir GET isteği yap ve durum kodunu yazdır

url değişkeni bir adresi tutuyor. await fetch(url) ile yanıtı response değişkenine al ve response.status değerini console.log ile yazdır.

Örnek çözümü göster

const response = await fetch(url);
console.log(response.status);

Kendini test et

Hangisi geçerli bir fetch çağrısıdır?

// A
fetch('https://api.example.com/users'
// B
fetch('https://api.example.com/users');
// C
fetch https://api.example.com/users;
// D
fetch[url];

Cevabı göster

B — Doğru! fetch tek bir metin parametre alır: URL.

fetch'in promise'ını bekle

const response = ____ fetch('https://api.example.com/users');

Cevabı göster

const response = await fetch('https://api.example.com/users');

Kavramları anlamlarıyla eşleştir

fetch(url)

Sunucuya istek gönderir
Response

Sunucudan gelen yanıtı temsil eder
response.status

HTTP durum kodunu verir

Sıradaki ders: JSON okuma

Deneyiminizi Geliştiriyoruz

Çerez Tercihleri

Kesinlikle Gerekli Çerezler

Analitik Çerezler