CORS Nedir?
CORS (Cross-Origin Resource Sharing), bir web sayfasının, farklı bir kaynağa (yani farklı bir domaine, subdomaine veya protokole) erişmeye çalıştığında güvenlik nedeniyle tarayıcılar tarafından uygulanan bir politikadır. Bu politika, bir web sayfasının kendi kaynağından (domain) farklı bir kaynağa (domain) veri göndermesi veya alması durumunda çalışır.
Peki, CORS hatası ne demek? Bir kullanıcının web tarayıcısında, "Ağ isteği engellendi" gibi bir hata mesajı gördüğünüzde, işte bu CORS hatası devreye girer. Yani, tarayıcı, bir kaynağa erişimi güvenlik nedeniyle engeller.
Neden CORS Hatası Alırsınız?
Öncelikle, API'ye yaptığınız istekler, genellikle bir başka sunucudan veri çekmeye çalıştığında CORS hatası meydana gelir. Bunun nedeni, API'nin CORS izinlerini düzgün şekilde yapılandırmamış olmasıdır. Örnek olarak, yerel geliştirme yapıyorsanız ve sunucunuz bir API'ye istek yapıyorsa, bu istek genellikle CORS hatası ile sonlanır. Ancak merak etmeyin, bu hataların üstesinden gelmek oldukça basit.
CORS Hatasını Çözme Yolları
Diyelim ki bir API'ye istek gönderiyorsunuz, fakat "CORS policy" yüzünden bu istek başarısız oldu. İşte çözüm için birkaç öneri:
1. Sunucuda CORS Yapılandırması Yapın
CORS hatalarını çözmenin en yaygın ve etkili yolu, API sunucusunda CORS ayarlarını yapmaktır. Sunucu, CORS başlıkları ile hangi kaynakların API'ye erişebileceğini belirler. Bu başlıkları doğru şekilde yapılandırarak, başka bir kaynağın API'nize erişmesini sağlarsınız. Örneğin, bir Node.js sunucusunda `cors` paketini kullanarak şu şekilde çözüm alabilirsiniz:
const cors = require('cors');
const express = require('express');
const app = express();
app.use(cors()); // CORS izinlerini açar
app.get('/', (req, res) => {
res.send('Merhaba, CORS çalışıyor!');
});
app.listen(3000, () => console.log('Sunucu çalışıyor...'));
Bu basit kod, tüm gelen isteklerin CORS politikasını düzgün bir şekilde yönetecektir.
2. Preflight Request (Ön Test İsteği) Kontrolü
Bazen CORS hataları, "Preflight" yani "ön test" isteğinden kaynaklanabilir. Tarayıcı, veri göndermeden önce, belirli HTTP yöntemleri (PUT, DELETE gibi) kullanılıp kullanılmadığını kontrol eder. Eğer sunucu bu tür bir isteği desteklemiyorsa, tarayıcı işlemi engeller. Sunucunuzun, OPTIONS isteklerine doğru şekilde yanıt verdiğinden emin olun.
app.options('*', cors()); // Herhangi bir OPTIONS isteğine yanıt verir
3. CORS Proxy Kullanmak
Geliştirme ortamında, CORS hatalarını hızla aşmak için CORS proxy kullanabilirsiniz. Bir CORS proxy, API isteğinizi geçici olarak başka bir kaynaktan yapar ve CORS sorununu ortadan kaldırır. Bu, sadece geliştirme aşamasında kullanılmalıdır, çünkü güvenlik açığına yol açabilir.
4. Tarayıcıda CORS'ı Devre Dışı Bırakmak
Geliştirici olarak test yapıyorsanız, bazen CORS hatalarını atlamak isteyebilirsiniz. Tarayıcıda CORS'ı geçici olarak devre dışı bırakabilirsiniz, ancak bu yöntem sadece geliştirme aşamasında kullanılmalıdır. Çalışma ortamında bu tür bir çözüm, büyük güvenlik açıklarına neden olabilir.
Google Chrome için aşağıdaki komutla CORS'ı devre dışı bırakabilirsiniz:
chrome.exe --user-data-dir="C://ChromeDevSession" --disable-web-security
5. JSONP Kullanmak
Eski bir yöntem olsa da, bazı eski projelerde JSONP kullanarak CORS hatasını aşabilirsiniz. Ancak bu yöntem modern web geliştirme dünyasında genellikle önerilmez. JSONP sadece veri almak için kullanılır ve sadece GET isteklerine izin verir. Bu yüzden günümüzde kullanımı oldukça azalmıştır.
CORS hataları, web geliştirmede en sık karşılaşılan sorunlardan biridir. Ancak doğru yapılandırmalar ve bazı yardımcı araçlarla bu sorunun üstesinden kolayca gelebilirsiniz. Bu yazıda paylaştığımız çözüm yollarını kullanarak, geliştirici deneyiminizi daha verimli hale getirebilirsiniz.
Aşağıdaki ipuçları ile CORS sorunlarını aşmak çok daha kolay hale gelecek. Geliştirici olarak bu engelleri aşarken yalnız değilsiniz. Sonraki projenizde CORS hatası aldığınızda bu çözüm yollarını uygulayarak, sorununuzu hızlıca çözebilirsiniz.
