Hataları ve Durum Kodlarını Yönetme
response.ok değerini denetleyin ve başarısızlıkları yönetin.
Hataları ve Durum Kodlarını Yönetme, CoddyKit'te ücretsiz bir JavaScript Academy dersidir. Bu, 4 dersinin 3. 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.
Getirme İşlemi HTTP Hatalarında Reddetmez
Şaşırtıcı bir ayrıntı: fetch yalnızca ağ hatalarında reddedilir. 404 veya 500 yanıtı yine de başarıyla sonuçlanır. Durumu kendiniz denetlemelisiniz.
response.ok Değerini Denetleme
response.ok yalnızca 200-299 aralığındaki durum kodları için true olur. HTTP hatalarını saptamak için bunu kullanın.
const response = await fetch(url);
if (!response.ok) {
console.log("HTTP error:", response.status);
}Durum Kodunu Okuma
response.status sayısal kodu, response.statusText ise kısa bir iletiyi verir. Belirli durumları ele almak için bunlara göre dallanma yapın.
if (response.status === 404) console.log("Not found");
if (response.status === 401) console.log("Unauthorized");Hatalı Durumda Hata Fırlatma
Temiz bir yaklaşım, yanıt uygun olmadığında bir hata fırlatmaktır; böylece tek bir catch hem ağ hem de HTTP hatalarını ele alır.
if (!response.ok) {
throw new Error("Request failed: " + response.status);
}try/catch İçine Alma
async/await kullanırken tüm akışı try/catch içine alın. Ağ hataları işlemi reddeder ve catch bloğuna düşer; fırlattığınız HTTP hatası da aynı şekilde davranır.
try {
const res = await fetch(url);
if (!res.ok) throw new Error("Status " + res.status);
const data = await res.json();
} catch (err) {
console.log("Failed:", err.message);
}Hata Türlerini Ayırt Etme
Reddedilen bir fetch genellikle sunucuya ulaşılamadığı, DNS'in başarısız olduğu veya CORS'un isteği engellediği anlamına gelir. Uygun olmayan bir yanıt ise sunucunun yanıt verdiğini, ancak bir hatayla yanıt verdiğini gösterir. Önemli olduğunda bunları farklı şekilde ele alın.
Hata Gövdelerini Okuma
API'ler genellikle hatayı açıklayan JSON döndürür. Yararlı bir ileti gösterebilmek için hata fırlatmadan önce bunu okuyun.
if (!res.ok) {
const errBody = await res.json().catch(() => ({}));
throw new Error(errBody.message || ("Status " + res.status));
}Yaygın Durum Kodları
Aileleri bilin: 2xx başarı, 3xx yönlendirme, 4xx istemci hatası (yanlış bir şey gönderdiniz), 5xx sunucu hatası (sorun onlardadır). Fetch çoğu yönlendirmeyi otomatik olarak izler.
Yeniden Kullanılabilir Yardımcı
Denetimi tek bir yardımcıda merkezileştirin; böylece her çağrı noktası tutarlı hata işleme davranışından yararlanır.
async function getJSON(url) {
const res = await fetch(url);
if (!res.ok) throw new Error("HTTP " + res.status);
return res.json();
}Geçici Hataları Yeniden Deneme
Kararsız ağlarda 5xx hatalarında veya ağ hatalarında yeniden deneme yapabilirsiniz. Sunucuyu aralıksız isteklerle yormamak için yeniden denemeleri sınırlı tutun ve bir gecikme ekleyin.
for (let i = 0; i < 3; i++) {
try { return await getJSON(url); }
catch (e) { if (i === 2) throw e; }
}Kullanıcıya Gösterme
Boş bir ekran göstermek yerine kullanıcıya anlaşılır bir ileti göstermek için hataları kullanıcı arayüzü katmanında yakalayın. İşlenmemiş bir reddedilmenin başarısız bir isteği sessizce yutmasına asla izin vermeyin.
getJSON(url)
.then(render)
.catch(() => showToast("Could not load data"));Hızlı Kontrol
Fetch hata işleme.
Özet
Fetch yalnızca ağ hatalarında reddedilir; bu nedenle her zaman response.ok/response.status değerlerini denetleyin ve hatalı durumlarda hata fırlatın. Çağrıları try/catch içine alın, iletiler için hata gövdelerini okuyun, denetimi bir yardımcıda merkezileştirin ve kullanıcı arayüzünde anlaşılır hata iletileri gösterin.
Sıkça Sorulan Sorular
“Hataları ve Durum Kodlarını Yönetme” dersi ücretsiz mi?
Evet — “Hataları ve Durum Kodlarını Yönetme” 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.
“Hataları ve Durum Kodlarını Yönetme” dersinde ne öğreneceğim?
response.ok değerini denetleyin ve başarısızlıkları yönetin. 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 3. dersidir.
“Hataları ve Durum Kodlarını Yönetme” 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