JavaScript Academy · Ders

GET İstekleri Oluşturma

Verileri alın ve JSON yanıtlarını ayrıştırın.

GET İstekleri Oluşturma, CoddyKit'te ücretsiz bir JavaScript Academy dersidir. Bu, 4 dersinin 1. dersidir. Aşağıdan dersin tamamını ücretsiz okuyabilir, sonra tarayıcıda yerleşik kod editörü ve 7/24 yapay zeka koçu ile uygulamalı olarak pratik yapabilirsin. Bu, JavaScript Academy öğrenme yolunun bir parçasıdır ve ilerlemeniz web ve CoddyKit uygulaması arasında senkronize olur. JavaScript Academy kursu toplamda 4 dersten oluşur.

Veri Getirme İşlevi Ne Yapar

Veri Getirme API'si, tarayıcıdan HTTP istekleri yapar ve bir Promise döndürür. Eski XMLHttpRequest yönteminin modern karşılığıdır.

Temel GET İsteği

Bir URL ile fetch(url) çağrısı yapın. Varsayılan olarak GET yöntemini kullanır ve bir Response nesnesiyle sonuçlanır.

fetch("https://api.example.com/users")
  .then((response) => {
    console.log(response.status); // 200
  });

Yanıt Nesnesi

Sonuçlanan değer verinin kendisi değil, bir Response nesnesidir. Bu nesne durumu, üst bilgileri ve gövdeyi okumaya yarayan yöntemleri taşır. İçeriği almak için bir gövde yöntemi çağırmanız gerekir.

fetch(url).then((response) => {
  console.log(response.ok);     // true if status 200-299
  console.log(response.status); // 200
});

JSON'u Ayrıştırma

Çoğu API JSON döndürür. Kendisi ayrıştırılmış nesneyle sonuçlanan bir Promise döndüren response.json() çağrısını kullanın.

fetch(url)
  .then((response) => response.json())
  .then((data) => {
    console.log(data); // parsed JS object/array
  });

Neden İki Aşamalı Bekleme

İlk bekleme, üst bilgiler geldiğinde sonuçlanır; ikinci bekleme (.json()) ise gövdenin tamamı indirilip ayrıştırıldığında sonuçlanır. Bu nedenle iki .then() çağrısını zincirlersiniz.

Eşzamansız Bekleme Kullanımı

Çoğu kod okunabilirlik için async/await kullanır. Her await, Promise sonuçlanana kadar bekler.

async function getUsers() {
  const response = await fetch(url);
  const data = await response.json();
  return data;
}

Diğer Gövde Okuyucuları

json() dışında bir Response; text(), blob() (ikili veri), arrayBuffer() veya formData() olarak okunabilir. Sunucunun döndürdüğü veriye göre seçim yapın.

const response = await fetch(url);
const html = await response.text(); // raw string

Gövde Bir Kez Okunur

Yanıt gövdesi yalnızca bir kez tüketebileceğiniz bir akıştır. Aynı yanıt üzerinde önce json(), sonra text() çağırmak hata oluşturur. Gerçekten ikisine de ihtiyacınız varsa response.clone() ile kopyalayın.

Sorgu Parametreleri

Sorgu dizelerini elle birleştirmek yerine URLSearchParams ile güvenli biçimde oluşturun. Bu yapı, özel karakterleri sizin için kodlar.

const params = new URLSearchParams({ page: 2, q: "hello world" });
fetch("https://api.example.com/search?" + params);

Üst Bilgileri Gönderme

Seçenekleri içeren ikinci bir bağımsız değişken geçirin. GET için genellikle bir Accept üst bilgisi veya kimlik doğrulama belirteci ayarlarsınız.

fetch(url, {
  headers: {
    "Accept": "application/json",
    "Authorization": "Bearer " + token
  }
});

Bekleme Sonucunu Döndürme

Veri getirme mantığını, çağıranların bekleyebilmesi için sonucu döndüren bir işleve sarın. Böylece veri yükleme işlemi uygulamanızın farklı bölümlerinde yeniden kullanılabilir.

function loadUser(id) {
  return fetch("/api/users/" + id).then((r) => r.json());
}

Hızlı Kontrol

Veri getirme ile GET istekleri.

Özet

fetch(url), bir Response için sonuç döndüren bir Promise verir. Gövdeyi json(), text() veya blob() ile okuyun (yalnızca bir kez). Açıklık için async/await, sorgu dizeleri için URLSearchParams ve üst bilgiler için bir seçenekler nesnesi kullanın. Yeniden kullanabilmek için bunları sonucu döndüren işlevlere sarın.

Sıkça Sorulan Sorular

“GET İstekleri Oluşturma” dersi ücretsiz mi?

Evet — “GET İstekleri Oluşturma” dersin tüm metni burada web'de ücretsiz olarak okunabilir. Etkileşimli olarak pratik yapmak (yerleşik kod editörü ve 7/24 yapay zeka koçu) ve JavaScript Academy kursunun geri kalanını açmak için CoddyKit PRO'ya yükselt. JavaScript Academy kursu toplamda 4 dersten oluşur.

“GET İstekleri Oluşturma” dersinde ne öğreneceğim?

Verileri alın ve JSON yanıtlarını ayrıştırın. JavaScript Academy ile uygulamalı kodu tarayıcıda doğrudan çalıştırarak pratik yaparsın ve 7/24 yapay zeka koçu dersi çalışırken sorularını yanıtlar.

JavaScript Academy öğrenmeye başlamak için deneyim gerekli mi?

Önceden deneyim gerekmez. CoddyKit'te JavaScript Academy, başlangıçtan ileri seviyeye kadar yapılandırıldığı için buradan başlayabilir veya başından başlayıp kendi hızında ilerleme yapabilirsin. Bu, 4 dersinin 1. dersidir.

“GET İstekleri Oluşturma” dersi ne kadar sürer?

Çoğu CoddyKit dersi yaklaşık 5–10 dakika sürer. Her biri kısa ve etkileşimli olduğu için sabit ilerleme yaparsın ve web ile uygulama arasında tam olarak bıraktığın yerden devam edebilirsin.

Bu JavaScript Academy dersinde kod yazıp çalıştırabilir miyim?

Evet. Her JavaScript Academy dersi yerleşik bir kod editörü içerir, bu sayede tarayıcıda gerçek kod yazıp çalıştırabilir ve anlık yapay zeka geri bildirimi alırsın — yerel kurulum gerekli değildir.

Bu kursun tüm dersleri

GET İstekleri Oluşturma
POST ve Veri Gönderme
Hataları ve Durum Kodlarını Yönetme
AbortController ile İstekleri İptal Etme

← JavaScript Academy Sayfasına Dön