toolsmoah

CORS Test Aracı

Cross-Origin Resource Sharing (CORS) politikalarını ve API isteklerini test edin ve hata ayıklayın

İstek Ayarları
Test için API isteğinizi yapılandırın
Örnek İstekler
Bu önceden tanımlanmış API isteklerini deneyin
CORS Bilgileri
CORS hakkında temel bilgiler

CORS Nedir? CORS (Cross-Origin Resource Sharing), web tarayıcılarının farklı kaynaklardan (farklı domain, protokol veya port) yapılan isteklere tarayıcıda çalışan scriptlerden izin veren bir mekanizmadır.

Temel CORS Başlıkları

  • Access-Control-Allow-Origin: Kaynağa erişim izni verilen origin'leri belirtir
  • Access-Control-Allow-Methods: İzin verilen HTTP yöntemlerini belirtir
  • Access-Control-Allow-Headers: Kullanılabilecek HTTP başlıklarını belirtir
  • Access-Control-Allow-Credentials: Kimlik bilgilerinin (çerezler, HTTP kimlik doğrulama) dahil edilip edilmeyeceğini belirtir

💡 CORS Çözümleri

Sunucu Tarafı Çözümler

1. Express.js (Node.js):

const cors = require('cors');
          app.use(cors({
            origin: 'https://example.com',
            methods: ['GET', 'POST'],
            credentials: true
          }));

2. Spring Boot (Java):

@CrossOrigin(origins = "https://example.com")
          @RestController
          public class ApiController { ... }

İstemci Tarafı Çözümler

1. Proxy Sunucu Kullanımı:

// package.json (React)
          "proxy": "http://localhost:3001"

2. JSONP (Sadece GET):

// Sınırlı ama basit çözüm
          fetch('api?callback=handleResponse')

🔧 Ortama Göre CORS Yapılandırması

Next.js

// next.config.js
          module.exports = {
            async headers() {
              return [
                {
                  source: '/api/:path*',
                  headers: [
                    {
                      key: 'Access-Control-Allow-Origin',
                      value: '*'
                    }
                  ]
                }
              ]
            }
          }

Nginx

location /api {
            add_header Access-Control-Allow-Origin *;
            add_header Access-Control-Allow-Methods 
              "GET, POST, OPTIONS";
            add_header Access-Control-Allow-Headers 
              "Content-Type, Authorization";
          }

Apache

# .htaccess
          Header always set Access-Control-Allow-Origin "*"
          Header always set Access-Control-Allow-Methods 
            "GET, POST, OPTIONS"
          Header always set Access-Control-Allow-Headers 
            "Content-Type, Authorization"

Ortama Göre CORS Yapılandırması

Test Senaryoları

  • • Basit İstek: GET istekleri ile temel CORS davranışını test et
  • • Preflight İsteği: PUT/DELETE yöntemleri ile preflight isteklerini test et
  • • Özel Başlıklar: Authorization başlığı ile istekleri test et
  • • Kimlik Bilgileri: Çerezli istekleri test et
  • • Hata İşleme: Başarısız senaryoları test et

Güvenlik Değerlendirmeleri

  • • Güvenlik riskleri nedeniyle joker (*) kullanımında dikkatli olun
  • • En az yetki ilkesi: Sadece gerekli origin'ler ve yöntemler için izin verin
  • • Kimlik bilgisi kısıtlamaları: Kimlik bilgileri dahil edilirken sadece belirli origin'lere izin verin
  • • Düzenli inceleme: CORS politikalarını düzenli olarak gözden geçirin ve güncelleyin

CORS Hata Ayıklama İpuçları

Tarayıcı Geliştirici Araçları

  • • Network sekmesinde OPTIONS isteklerini kontrol edin
  • • Console'da CORS hata mesajlarını arayın
  • • Response Headers'da CORS başlıklarını doğrulayın

Faydalı Araçlar

  • • CORS Test Aracı (bu araç)
  • • Postman (API testi için)
  • • curl komutu (doğrudan sunucu testi için)