Chrome, document.domain alanının değiştirilmesini devre dışı bıraktı

Web siteniz document.domain ayarına bağlıysa işlem yapmanız gerekir.

Neler değişiyor ve neden?

Chrome 115'ten itibaren web siteleri document.domain ayarlayamayacak. Chrome, document.domain'ı değiştirilemez hale getirecek. Kaynaklar arası iletişim kurmak için postMessage() veya Channel Messaging API gibi alternatif yaklaşımlar kullanmanız gerekir.

Bu değişikliğin kademeli olarak kullanıma sunulacağını unutmayın.

Diğer tarayıcıların da bu işlevi kullanımdan kaldıracağını ve kaldıracağını tahmin ediyoruz. Ayrıntılar için tarayıcı uyumluluğu bölümünü inceleyin.

Neden document.domain değiştirilemez hale getiriliyor?

document.domain kaynağın ana makine adını almak veya ayarlamak için tasarlanmıştır. Birçok web sitesi, aynı site ancak farklı kaynaklı sayfalar arasında iletişime izin vermek için document.domain ayarlar.

Bu teknik kullanışlı olsa da aynı kaynak politikasını gevşettiği için güvenlik riski oluşturur. document.domain ile ilgili güvenlik endişeleri, kullanıcıları bu özelliği kullanmaktan kaçınmaları konusunda uyaran spesifikasyonun değişmesine neden oldu.

Ayrıntılı bilgi: Neden document.domain değiştirilemez hale getiriliyor?

document.domain'nın günümüzdeki kullanımı

Birçok web sitesi, aynı site ancak farklı kaynaklı sayfalar arasında iletişime izin vermek için document.domain ayarlar.

Aynı site ancak kaynaklar arası siteler aynı eTLD+1'e sahiptir ancak alt alan adları farklıdır.

document.domain şu ana kadar şu şekilde kullanıldı:

https://parent.example.com adresindeki bir sayfanın, https://video.example.com adresinden bir iFrame sayfası yerleştirdiğini varsayalım. Bu sayfalar, farklı alt alan adlarıyla aynı eTLD+1'e (example.com) sahiptir. Her iki sayfanın document.domain değeri 'example.com' olarak ayarlandığında tarayıcı, iki kaynağı aynı kaynaktanmış gibi değerlendirir.

https://parent.example.com için document.domain değerini ayarlayın:

// Confirm the current origin of "parent.example.com"
console.log(document.domain);

// Set the document.domain
document.domain = 'example.com';
console.log(document.domain);

https://video.example.com için document.domain değerini ayarlayın:

// Confirm the current origin of "video.example.com"
console.log(document.domain);

// Set the document.domain
document.domain = 'example.com';
console.log(document.domain);

Artık https://parent.example.com üzerinde https://video.example.com'ye karşı kaynaklar arası DOM manipülasyonu oluşturabilirsiniz.

Web siteleri, aynı siteye ait dokümanların daha kolay iletişim kurabilmesi için document.domain ayarlar. Bu değişiklik aynı kaynak politikasını esnettiği için üst sayfa, iframe'in dokümanına erişebilir ve DOM ağacında gezinebilir. Aynı durum iframe için de geçerlidir.

Bu teknik kullanışlı olsa da güvenlik riski oluşturur.

document.domain ile ilgili güvenlik endişeleri

document.domain ile ilgili güvenlik endişeleri, kullanıcıları bu özelliği kullanmaktan kaçınmaları konusunda uyaran bir spesifikasyonun değişmesine neden oldu.

Örneğin, iki sayfa document.domain değerini ayarladığında aynı kaynakmış gibi davranabilir. Bu durum, özellikle bu sayfalar farklı alt alan adlarına sahip paylaşımlı bir barındırma hizmeti kullandığında önemlidir. document.domain ayarı, aynı hizmet tarafından barındırılan diğer tüm sitelere erişim olanağı sağlar. Bu durum, saldırganların sitelerinize erişmesini kolaylaştırır. document.domain alan adının bağlantı noktası numarası bölümünü yok saydığı için bu mümkündür.

document.domain ayarının güvenlik açısından sonuçları hakkında daha fazla bilgi edinmek için MDN'deki "Document.domain" sayfasını inceleyin.

Tarayıcı uyumluluğu

Sitemin etkilenip etkilenmediğini nasıl anlarım?

Web siteniz bu değişiklikten etkileniyorsa Chrome, DevTools Sorunlar panelinde sizi uyarır. Bu uyarı 2022'de eklenmiştir. Geliştirici Araçları'nın sağ üst kısmındaki sarı bayrağa dikkat edin.

Geliştirici Araçları'ndaki sorun uyarısının ekran görüntüsü

Chrome'dan kaldırılması planlanan tüm API'leri bulmak için sitenizi LightHouse deprecated API audit üzerinden de çalıştırabilirsiniz.

Reporting API'yi ayarladıysanız Chrome, bu yaklaşan kullanımdan kaldırma işlemi hakkında sizi bilgilendirmek için kullanımdan kaldırma raporları göndermiştir. Mevcut rapor toplama hizmetleriyle veya kendi şirket içi çözümünüzü oluşturarak Reporting API'yi kullanma hakkında daha fazla bilgi edinin.

Bu değişikliği nasıl görebilirim?

Bu değişiklik, Chrome 115'ten itibaren kademeli olarak kullanıma sunulacak. Bu değişikliği Chrome tarayıcınızda henüz kullanıma sunulmamış olsa bile etkin olarak görmek için aşağıdaki adımları uygulayabilirsiniz:

  1. chrome://flags/#origin-agent-cluster-default uygulamasını aç
  2. Etkinleştir'i seçin.
  3. Chrome'u yeniden başlatın.

Hangi alternatifleri kullanabilirim?

En iyi seçenek, sayfayı ve tüm bileşen çerçevelerini aynı kaynakta barındırarak document.domain öğesini hiç değiştirmemektir. Bu özellik, tüm tarayıcıların tüm sürümlerinde çalışır. Ancak bu, uygulamanın önemli ölçüde yeniden çalışılmasını gerektirebilir. Bu nedenle, kaynaklar arası erişimi desteklemeye devam eden alternatiflere de göz atmanız önerilir.

document.domain yerine postMessage() veya Channel Messaging API'yi kullanın

Çoğu kullanım alanında, kaynaklar arası postMessage() veya Channel Messaging API, document.domain yerine kullanılabilir.

Aşağıdaki örnekte:

  1. https://parent.example.com, postMessage() üzerinden mesaj göndererek DOM'u değiştirmek için bir iframe içinde https://video.example.com isteğinde bulunuyor.
  2. https://video.example.com Mesajı alır almaz DOM'u değiştirir ve başarıyı üst öğeye bildirir.
  3. https://parent.example.com başarıyı onaylar.

https://parent.example.com üzerinde:

// Send a message to https://video.example.com
iframe.postMessage('Request DOM manipulation', 'https://video.example.com');

// Receive messages
iframe.addEventListener('message', (event) => {
  // Reject all messages except ones from https://video.example.com
  if (event.origin !== 'https://video.example.com') return;

  // Filter success messages
  if (event.data === 'succeeded') {
    // DOM manipulation is succeeded
  }
});

https://video.example.com üzerinde:

// Receive messages
window.addEventListener('message', (event) => {
  // Reject all messages except ones from https://parent.example.com
  if (event.origin !== 'https://parent.example.com') return;

  // Do a DOM manipulation on https://video.example.com.

  // Send a success message to https://parent.example.com
  event.source.postMessage('succeeded', event.origin);
});

Deneyerek nasıl çalıştığını görün. postMessage() veya Channel Messaging API ile çalışmayacak özel gereksinimleriniz varsa Twitter'da @ChromiumDev üzerinden bize bildirin veya Stack Overflow'da document.domain etiketiyle sorun.

Son çare olarak Origin-Agent-Cluster: ?0 üstbilgisini gönderin

document.domain ayarını yapmaya devam etmek için geçerli nedenleriniz varsa hedef dokümanla birlikte Origin-Agent-Cluster: ?0 yanıt başlığını gönderebilirsiniz.

Origin-Agent-Cluster: ?0

Origin-Agent-Cluster başlığı, tarayıcıya dokümanın kaynak içeren veya kaynaklarla ilişkili aracı kümesi tarafından işlenip işlenmeyeceğini bildirir. Origin-Agent-Cluster hakkında daha fazla bilgi edinmek için Origin-Agent-Cluster başlığıyla performans izolasyonu isteme başlıklı makaleyi inceleyin.

Bu başlığı gönderdiğinizde, dokümanınız varsayılan olarak değişmez hale geldikten sonra bile document.domain ayarlamaya devam edebilir.

Bu davranışı gerektiren diğer tüm belgelerin de Origin-Agent-Cluster göndermesi gerekir (yalnızca bir belge bunu ayarlarsa document.domain'ın etkisi olmayacağını unutmayın).

Kurumsal politika için OriginAgentClusterDefaultEnabled yapılandırma

İsteğe bağlı olarak, yöneticiniz OriginAgentClusterDefaultEnabled politikasını false olarak yapılandırarak kuruluşunuzdaki Chrome örneklerinde document.domain'ın varsayılan olarak ayarlanabilir olmasını sağlayabilir. Daha fazla bilgi edinmek için Chrome Enterprise Policy List & Management | Documentation (Chrome Enterprise Politika Listesi ve Yönetimi | Dokümanlar) başlıklı makaleyi okuyun.

Kaynaklar

Teşekkür

Finan Akbar'ın Unsplash'teki fotoğrafı