HTTP Headers: İstek ve Yanıt Başlıkları Nedir, Nasıl Çalışır?

HTTP istekleri sadece URL ve body'den ibaret değil. Her istek ve yanıtla birlikte header (başlık) adı verilen meta veriler de gönderilir. Bu başlıklar, isteğin nasıl işleneceği, yanıtın formatı, kimlik doğrulama bilgileri gibi önemli detayları taşır.

Bu makalede HTTP header'larının ne olduğunu, en yaygın olanları ve nasıl kullanıldığını öğreneceksiniz.

Header Nedir?

Header, HTTP isteği veya yanıtıyla birlikte gönderilen anahtar-değer çiftleridir. Bunlar bir nevi "ek bilgi" veya "meta veri" gibidir.

Görsel Temsil

metin

┌─────────────────────────────────────────┐
│             HTTP İSTEĞİ                 │
├─────────────────────────────────────────┤
│ GET /api/kullanicilar HTTP/1.1          │  ← İstek satırı
├─────────────────────────────────────────┤
│ Host: api.example.com                   │
│ Accept: application/json                │  ← HEADERS
│ Authorization: Bearer abc123            │
│ User-Agent: Mozilla/5.0                 │
├─────────────────────────────────────────┤
│                                         │
│ (body - GET'te genellikle boş)          │  ← Body
│                                         │
└─────────────────────────────────────────┘

İstek Headers vs Yanıt Headers

İstek Headers (Request Headers)

Siz sunucuya gönderirsiniz. Sunucuya istekle ilgili bilgi verirsiniz.

metin

Accept: application/json          → "JSON formatında yanıt istiyorum"
Content-Type: application/json    → "Gönderdiğim veri JSON formatında"
Authorization: Bearer token123    → "Kimliğimi doğrulayan token bu"

Yanıt Headers (Response Headers)

Sunucu size gönderir. Yanıtla ilgili bilgi verir.

metin

Content-Type: application/json    → "Gönderdiğim veri JSON formatında"
Content-Length: 1234              → "Yanıt boyutu 1234 byte"
Cache-Control: max-age=3600       → "Bu yanıtı 1 saat önbellekleyebilirsin"

Tarayıcıda Headers'ı Görme

Adımlar:

Herhangi bir web sitesini açın
F12 tuşuna basın (DevTools)
Network sekmesine gidin
Sayfayı yenileyin
Herhangi bir isteğe tıklayın
Headers sekmesini inceleyin

Burada hem Request Headers hem de Response Headers görürsünüz.

En Yaygın Request Headers

1. Accept

Sunucudan hangi formatta yanıt istediğinizi belirtir.

metin

Accept: application/json       → JSON istiyorum
Accept: text/html              → HTML istiyorum
Accept: application/xml        → XML istiyorum
Accept: */*                    → Her format olur

Örnek Kullanım:

Bazı API'ler aynı endpoint'ten farklı formatlar döndürebilir. Accept header'ı ile tercihimizi belirtiriz.

metin

GET https://icanhazdadjoke.com/

Accept: text/html         → HTML sayfa döner
Accept: application/json  → JSON veri döner
Accept: text/plain        → Düz metin döner

2. Content-Type

Gönderdiğiniz verinin formatını belirtir. POST, PUT, PATCH isteklerinde kullanılır.

metin

Content-Type: application/json              → JSON gönderiyorum
Content-Type: application/x-www-form-urlencoded  → Form verisi gönderiyorum
Content-Type: multipart/form-data           → Dosya yüklüyorum
Content-Type: text/plain                    → Düz metin gönderiyorum

Örnek:

metin

POST /api/urunler
Content-Type: application/json

{
  "ad": "Laptop",
  "fiyat": 15000
}

Sunucu, Content-Type header'ına bakarak gelen veriyi nasıl parse edeceğini anlar.

3. Authorization

Kimlik doğrulama bilgilerini taşır. Korumalı API'lere erişirken kullanılır.

Yaygın Formatlar:

metin

Authorization: Bearer eyJhbGciOiJIUzI1NiIs...   → JWT Token
Authorization: Basic dXNlcm5hbWU6cGFzc3dvcmQ=  → Base64 encoded username:password
Authorization: ApiKey abc123xyz                 → API Anahtarı

Bearer Token Örneği:

metin

GET /api/hesabim
Authorization: Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9...

4. User-Agent

İstek yapan istemci hakkında bilgi verir (tarayıcı, işletim sistemi vb.).

metin

User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 Chrome/120.0.0.0

Sunucular bu bilgiyi kullanarak:

Mobil/masaüstü ayrımı yapabilir
Eski tarayıcılara farklı içerik sunabilir
İstatistik toplayabilir

5. Accept-Language

Tercih edilen dili belirtir.

metin

Accept-Language: tr-TR              → Türkçe (Türkiye)
Accept-Language: en-US              → İngilizce (ABD)
Accept-Language: tr-TR, en-US;q=0.9 → Önce Türkçe, yoksa İngilizce

Çok dilli siteler bu header'a göre içerik dili seçebilir.

6. Cache-Control (İstek)

Önbellekleme davranışını kontrol eder.

metin

Cache-Control: no-cache    → Her zaman sunucudan taze veri al
Cache-Control: no-store    → Hiçbir şeyi önbellekleme

En Yaygın Response Headers

1. Content-Type

Yanıtın formatını belirtir.

metin

Content-Type: application/json; charset=utf-8  → JSON, UTF-8 kodlamalı
Content-Type: text/html; charset=utf-8         → HTML sayfası
Content-Type: image/png                        → PNG resim

2. Content-Length

Yanıt gövdesinin boyutunu byte cinsinden belirtir.

metin

Content-Length: 2048  → 2048 byte (2 KB)

3. Cache-Control (Yanıt)

Tarayıcıya önbellekleme talimatları verir.

metin

Cache-Control: max-age=3600        → 1 saat önbellekle
Cache-Control: no-cache            → Her seferinde doğrula
Cache-Control: no-store            → Kesinlikle önbellekleme
Cache-Control: public, max-age=86400  → Herkes 1 gün önbellekleyebilir

Tarayıcıya çerez (cookie) kaydetmesini söyler.

metin

Set-Cookie: session_id=abc123; HttpOnly; Secure
Set-Cookie: kullanici=ahmet; Max-Age=604800

5. Location

Yönlendirme URL'ini belirtir. 3xx durum kodlarıyla birlikte gelir.

metin

HTTP/1.1 301 Moved Permanently
Location: https://yeni-adres.com/sayfa

6. Access-Control-Allow-Origin (CORS)

Hangi domainlerin bu API'ye erişebileceğini belirtir.

metin

Access-Control-Allow-Origin: *                    → Herkes erişebilir
Access-Control-Allow-Origin: https://benim-sitem.com  → Sadece bu site

Pratik Örnek: Dad Jokes API

Bu API, Accept header'ına göre farklı formatlar döndürür.

HTML Yanıt (Varsayılan)

metin

GET https://icanhazdadjoke.com/

Header belirtmezseniz HTML döner - bu bir web sayfasıdır.

JSON Yanıt

metin

GET https://icanhazdadjoke.com/
Accept: application/json

Yanıt:

json

{
  "id": "R7UfaahVfFd",
  "joke": "Why do programmers prefer dark mode? Because light attracts bugs.",
  "status": 200
}

Düz Metin Yanıt

metin

GET https://icanhazdadjoke.com/
Accept: text/plain

Yanıt:

metin

Why do programmers prefer dark mode? Because light attracts bugs.

Hoppscotch'ta Header Ekleme

Adımlar:

Headers sekmesine tıklayın
+ Add Header veya boş satıra tıklayın
Header adını girin (örn: Accept)
Değeri girin (örn: application/json)
İsteği gönderin

Örnek Konfigürasyon:

Header	Value
Accept	application/json
Content-Type	application/json
Authorization	Bearer mytoken123

Özel (Custom) Headers

Bazı API'ler kendi özel header'larını tanımlar. Bunlar genellikle X- öneki ile başlar:

metin

X-API-Key: abc123xyz
X-Request-ID: req-789
X-Rate-Limit-Remaining: 95

Not: X- öneki artık resmi olarak önerilmiyor ama hâlâ yaygın kullanılıyor.

Header vs Query String

İkisi de sunucuya ek bilgi gönderir ama amaçları farklı:

Özellik	Query String	Header
Görünürlük	URL'de görünür	URL'de görünmez
Amaç	Veri filtreleme, arama	Meta bilgi, kimlik doğrulama
Önbellekleme	URL değişince önbellek değişir	Header değişse de aynı URL
Hassas veri	Uygun değil (loglanır)	Daha güvenli
Örnek	`?sayfa=2&limit=10`	`Authorization: Bearer xxx`

Kural:

Filtreleme, arama, sayfalama → Query String
Kimlik doğrulama, format tercihi, meta veri → Header

Güvenlik Notları

1. Authorization Header'ı Gizli Tutun

Token'larınızı asla:

URL'de göndermeyin (loglanır!)
Frontend kodunda açıkça yazmayın
Git'e commit etmeyin

2. HTTPS Kullanın

Header'lar HTTP'de düz metin olarak gider. HTTPS ile şifrelenir.

3. Hassas Bilgileri Loglama

Sunucu loglarında Authorization header'larını maskelemeyi unutmayın.

Sık Karşılaşılan Hatalar

Hata 1: Content-Type Belirtmemek

metin

POST /api/kullanicilar
Body: {"isim": "Ali"}

→ 400 Bad Request
→ Sunucu veriyi parse edemedi

Çözüm:

metin

Content-Type: application/json

Hata 2: Yanlış Accept Header

metin

GET /api/veriler
Accept: application/xml

→ 406 Not Acceptable
→ API sadece JSON destekliyor

Hata 3: Token Formatı

metin

Authorization: mytoken123        → Yanlış
Authorization: Bearer mytoken123 → Doğru

Özet Tablosu

Header	Tür	Amaç
Accept	İstek	İstenen yanıt formatı
Content-Type	Her ikisi	Veri formatı
Authorization	İstek	Kimlik doğrulama
User-Agent	İstek	İstemci bilgisi
Cache-Control	Her ikisi	Önbellekleme
Content-Length	Yanıt	Yanıt boyutu
Location	Yanıt	Yönlendirme adresi
Set-Cookie	Yanıt	Çerez ayarlama

Sırada Ne Var?

HTTP header'larını öğrendik. Artık API isteklerinin tüm bileşenlerini biliyorsunuz: URL, metod, query string, header ve body.

Bir sonraki makalede JavaScript ile nasıl HTTP isteği yapacağımızı göreceğiz. İlk olarak eski yöntem olan XMLHttpRequest (XHR) ile başlayacağız.

Header Nedir?

Görsel Temsil

İstek Headers vs Yanıt Headers

İstek Headers (Request Headers)

Yanıt Headers (Response Headers)

Tarayıcıda Headers'ı Görme

Adımlar:

En Yaygın Request Headers

1. Accept

2. Content-Type

3. Authorization

4. User-Agent

5. Accept-Language

6. Cache-Control (İstek)

En Yaygın Response Headers

1. Content-Type

2. Content-Length

3. Cache-Control (Yanıt)

4. Set-Cookie

5. Location

6. Access-Control-Allow-Origin (CORS)

Pratik Örnek: Dad Jokes API

HTML Yanıt (Varsayılan)

JSON Yanıt

Düz Metin Yanıt

Hoppscotch'ta Header Ekleme

Adımlar:

Örnek Konfigürasyon:

Özel (Custom) Headers

Header vs Query String

Güvenlik Notları

1. Authorization Header'ı Gizli Tutun

2. HTTPS Kullanın

3. Hassas Bilgileri Loglama

Sık Karşılaşılan Hatalar

Hata 1: Content-Type Belirtmemek

Hata 2: Yanlış Accept Header

Hata 3: Token Formatı

Özet Tablosu

Sırada Ne Var?

İlgili yazılar

JavaScript Classes - Pratik Uygulamalar

JavaScript Classes

Constructor Functions ve new Keyword