# iframe (Satır İçi Çerçeve)

Adres: https://softwaredictionary.org/tr/terimler/iframe
Kategori: Web Geliştirme
Son güncelleme: 2026-09-30
Okunuşu: ayfreym

Kısaca: iframe, başka bir web sayfasını mevcut sayfaya gömen ve sıkça videolar, haritalar, ödeme formları ve üçüncü taraf widget'lar için kullanılan HTML öğesidir.

## iframe nedir?

Satır içi çerçeve (inline frame) anlamına gelen iframe, `<iframe>` etiketiyle oluşturulur ve sayfanızdaki bir dikdörtgenin içinde ayrı bir HTML belgesi gösterir. Gömülü sayfanın kendi DOM'u, stilleri ve betikleri vardır ve tamamen farklı bir web sitesine ait olabilen kendi URL'sinden yüklenir. Gömülü videolar, haritalar, sosyal medya gönderileri, reklamlar ve barındırılan ödeme ya da oturum açma formları genellikle iframe'dir.

`src` niteliği yüklenecek URL'yi belirler, `title` çerçeveyi ekran okuyucular için tanımlar, `width` ve `height` de boyutunu ayarlar. Tarayıcılar iki sayfayı aynı kaynak politikasıyla birbirinden ayrı tutar: iframe başka bir kaynaktan geliyorsa hiçbir sayfa diğerinin DOM'unu ya da cookie'lerini okuyamaz, yalnızca `window.postMessage()` ile mesaj alışverişi yapabilirler. `sandbox` niteliği gömülü sayfayı daha da kısıtlar; açıkça izin verilmedikçe betikleri, formları veya açılır pencereleri engeller. `allow` niteliği ise kamera ya da tam ekran modu gibi özelliklere erişimi denetler.

iframe, oturma odanızın duvarına monte edilmiş bir televizyon gibidir: odanızın parçasıdır ama üzerinde oynayan şey başka bir yerden gelir ve onu siz denetlemezsiniz. Bu yalıtım yararlıdır. Örneğin ödeme sağlayıcıları iframe kullanır; böylece kart bilgileri doğrudan onlara gider ve satıcının sayfasına hiç uğramaz, bu da satıcının güvenlik yükünü azaltır.

Başlıca risk ters yönde işler: clickjacking'de bir saldırgan sitenizi kendi iframe'inin içinde görünmez biçimde yükler ve kullanıcıları düğmelerinize tıklamaya kandırır. Siteler bunu, kimin kendilerini çerçeveleyebileceğini denetlemek için `Content-Security-Policy: frame-ancestors` başlığını ya da eski `X-Frame-Options` başlığını göndererek önler. iframe, bir widget'ı script etiketiyle gömmekten de farklıdır: bir betik sayfanızın içinde ona tam erişimle çalışır, iframe ise gömülü içeriği ayrı bir belgede tutar.

## Önemli noktalar

- Bir `<iframe>`, kendi DOM'u ve betikleri olan ayrı bir web sayfasını mevcut sayfanın içine gömer.
- Aynı kaynak politikası, farklı kaynaklı iframe'leri yalıtır; bunlar üst sayfayla `postMessage()` ile konuşur.
- `sandbox` ve `allow` nitelikleri gömülü bir sayfanın neler yapabileceğini sınırlar.
- Siteler clickjacking'e karşı CSP `frame-ancestors` yönergesi veya `X-Frame-Options` ile korunur.
- Erişilebilirlik için her iframe'e bir `title` verin ve ekran dışında başlayan iframe'leri lazy load edin.

## Örnek: Sandbox'lı bir haritayı gömmek ve onu güvenle dinlemek

```html
<!-- Embed a map from another site, with restrictions -->
<iframe
  src="https://maps.example.com/embed?place=city-hall"
  title="Map showing the location of City Hall"
  width="600" height="400"
  loading="lazy"
  sandbox="allow-scripts allow-same-origin"
></iframe>
<script>
  // Only trust messages that come from the embedded site
  window.addEventListener("message", (event) => {
    if (event.origin !== "https://maps.example.com") return;
    console.log("Map says:", event.data);
  });
</script>
```

## Sık sorulan sorular

**Sitemin bir iframe içinde gösterilmesini nasıl engellerim?**

`Content-Security-Policy: frame-ancestors 'none'` başlığını gönderin ya da yalnızca kendi sayfalarınıza izin vermek için `'self'` kullanın. Eski `X-Frame-Options: DENY` başlığı eski tarayıcılarda aynı işi yapar.

**JavaScript bir iframe'in içindeki içeriğe erişebilir mi?**

Yalnızca iframe üst sayfayla aynı kaynaktaysa. Farklı kaynaklı iframe'lerde tarayıcı doğrudan erişimi engeller ve iki sayfa `postMessage()` ile iletişim kurmak zorundadır.

**iframe'ler SEO için kötü müdür?**

Arama motorları bir iframe'in içindeki içeriği dizine ekleyebilir ama bunu genellikle sayfanıza değil, gömülü URL'ye atfeder. İçeriğin sayfanızın parçası olarak sıralanmasını istiyorsanız ana içeriğinizi bir iframe'e koymayın.

---

Software Dictionary: https://softwaredictionary.org/tr · https://softwaredictionary.org/tr/llms.txt