İzin Politikası ile tarayıcı özelliklerini kontrol etme

Sayfanızın ve sayfanızdaki üçüncü taraf iframe'lerin tarayıcı özelliklerine nasıl erişeceğini yönetin.

Kevin K. Lee

Önceki adıyla Özellik Politikası olan İzin Politikası, geliştiricilerin bir sayfa, onun iframe'leri ve özellikleri tarafından kullanılabilen tarayıcı özelliklerini tarayıcının zorunlu kılması için bir dizi politika beyan ederek alt kaynaklar sağlar. Bu politikalar, yanıt başlığı kaynak listesinde sağlanan kaynaklara uygulanır. Kaynak listesi, aynı kökleri ve/veya çapraz kaynakları içerebilir ve Geliştiricinin tarayıcı özelliklerine birinci ve üçüncü taraf erişimini kontrol etmesini sağlama.

Daha güçlü özelliklere erişim izni verme konusunda son karar kullanıcıya aittir. Kullanıcının bir istem aracılığıyla açık bir izin vermesi gerekir.

İzin Politikası, üst düzey sitenin kendisinin ve üçüncü ortadan kaldırır ve kullanıcının bu karara varma yükünü geçerli olup olmadığını kontrol edin. Örneğin, İzin Politikası aracılığıyla tüm üçüncü taraflar için coğrafi konum özelliğini engelleme, Geliştirici, hiçbir üçüncü tarafın kullanıcının coğrafi konum.

Not: Özel Korumalı Alan, üçüncü taraf çerezleri veya diğer izleme mekanizmaları olmadan üçüncü taraf kullanım alanlarını karşılamaya yönelik bir dizi teklif ve API'dir. Kullanıcı Aracısı İstemci İpuçları ve Topics API gibi Özel Korumalı Alan API'leri, geolocation ve camera gibi özelliklerin yönetildiği şekilde İzin Politikası tarafından yönetilir. İzin Politikası'na bağlı olan web platformu API'lerinin listesi için özellik listesine bakın. Bu liste güncel olmayabilir.

İzin Politikası'ndaki Değişiklikler

İzin Politikası daha önce Özellik Politikası olarak biliniyordu. Temel kavramlar aynıdır ancak adla birlikte bazı önemli değişiklikler söz konusudur.

Yapılandırılmış Alanlar kullanımı

Yapılandırılmış Alanlar, HTTP üst bilgisi alan değerlerinin ayrıştırılmasını ve serileştirilmesini standart hale getirmek için bir dizi ortak veri yapısı sağlar. Fastly'nin "Yapılandırılmış başlık alanlarıyla HTTP'yi iyileştirme" başlıklı blog yayınından Yapılandırılmış Alanlar hakkında daha fazla bilgi edinebilirsiniz.

Önceki

  geolocation 'self' https://example.com; camera 'none'

Özellik Politikası'ndan önce.

Yeni

  geolocation=(self "https://example.com"), camera=()

Artık İzin Politikası ile.

Üstbilgileri iframe allow özelliğiyle birleştirme

Özellik Politikası ile kaynağı başlık kaynak listesine veya iframe etiketine bir allow özelliği ekleyerek çapraz kaynak çerçevesine ekleyebilirsiniz. İzin Politikası ile, kaynak listesine bir kaynaklar arası çerçeve eklerseniz bu kaynağın iframe etiketi allow özelliğini içermelidir. Yanıtta İzin Politikası başlığı yoksa kaynak listesinin varsayılan değeri * olarak kabul edilir. iframe'e allow özelliğinin eklenmesi özelliğe erişime olanak tanır.

Bu nedenle, geliştiricilerin yanıtta İzin Politikası başlığını açıkça belirlemelerini öneririz. Böylece, kaynak listesinde yer almayan kaynaklar arası iframe'lerin, allow mevcut olsa bile bu özelliğe erişimi engellenir.

Özellik Politikası, Chrome 88'den sonra da kullanılabilir ancak İzin Politikası için takma ad görevi görür. Söz dizimi dışında mantık açısından herhangi bir fark yok. Hem İzin Politikası hem de Özellik Politikası başlıkları birlikte kullanılırsa Permissions-Policy başlığı daha yüksek önceliğe sahip olur ve Feature-Policy başlığı tarafından sağlanan değerin üzerine yazılır.

İzin Politikası'nı nasıl kullanabilirim?

Hızlı genel bakış

Konunun ayrıntılarına geçmeden önce, bir web sitesinin sahibi olduğunuz ve siteniz ile üçüncü taraf kodunun tarayıcı özelliklerini nasıl kullandığını kontrol etmek istediğiniz yaygın bir senaryoya hızlıca göz atalım.

• Siteniz https://your-site.example.
• Siteniz aynı kaynaktan (https://your-site.example) bir iframe yerleştiriyor.
• Siteniz, güvendiğiniz bir https://trusted-site.example sitesinden iframe yerleştiriyor.
• Sitenizde https://ad.example tarafından sunulan reklamlar da gösteriliyor.
• Coğrafi konuma reklam için değil, yalnızca siteniz ve güvenilen site için izin vermek istiyorsanız.

Bu durumda, aşağıdaki üstbilgiyi kullanın:

Permissions-Policy: geolocation=(self "https://trusted-site.example")

Ayrıca allow özelliğini, güvenilir sitenin iframe etiketine açık bir şekilde ayarlayın:

<iframe src="https://trusted-site.example" allow="geolocation">

Bu örnekte, başlık kaynak listesi yalnızca sitenizin (self) ve trusted-site.example sitesinin coğrafi konum özelliğini kullanmasına izin veriyor. ad.example uygulamasının coğrafi konum kullanmasına izin verilmiyor.

1. your-site.example sitenizin, kullanıcının izniyle coğrafi konum özelliğini kullanmasına izin veriliyor.
2. Aynı kaynaklı iframe'in (your-site.example), allow özelliği kullanılmadan bu özelliği kullanmasına izin verilir.
3. Kaynak listesine eklenmemiş, farklı bir alt alan adından (subdomain.your-site-example) sunulan ve iframe etiketinde "allow" özelliği ayarlanmış bir iframe'in özelliği kullanması engellendi. Farklı alt alan adları, aynı site ancak çapraz kaynak olarak kabul edilir.
4. Kaynak listesine eklenen ve iframe etiketinde allow özelliği ayarlanmış olan kaynaklar arası iframe'in (trusted-site.example) özelliği kullanmasına izin veriliyor.
5. Kaynak listeye eklenen, allow özelliği olmadan kaynak listeye eklenen kaynaklar arası iframe'in (trusted-site.example) özelliği kullanması engellendi.
6. Kaynak listeye eklenmemiş bir çapraz kaynak iframe'in (ad.example), allow özelliği iframe etiketine dahil edilmiş olsa bile bu özelliği kullanması engellendi.

Permissions-Policy HTTP yanıt başlığı

Permissions-Policy: <feature>=(<token>|<origin(s)>)

Bir özellik için izin verilen kaynakları ayarlamak üzere sunucudan gelen yanıtta Permissions-Policy üstbilgisi kullanın. Başlık değeri, jetonların ve kaynak dizelerinin bir kombinasyonunu alabilir. Kullanılabilir jetonlar tüm kaynaklar için * ve aynı kaynak için self şeklindedir.

Başlığınız birden çok özellikle ilgiliyse özellikleri virgülle ayırın. Birden fazla kaynak listeliyorsanız kaynak listesindeki her kaynağı boşlukla ayırın. Kaynaklar arası istek olan bir kaynağın listelendiği başlıklar için iframe etiketi, allow özelliğini içermelidir.

Aşağıda bazı anahtar/değer çiftleri verilmiştir:

• Sözdizimi: [FEATURE]=*
  • Politika tüm kaynaklara uygulandı
  • Örnek: geolocation=*
• Sözdizimi: [FEATURE]=(self)
  • Aynı kaynağa uygulanan politika
  • Örnek: geolocation=(self)
• Sözdizimi: [FEATURE]=(self [ORIGIN(s)])
  • Politika aynı kaynağa ve belirtilen kaynaklara uygulandı
  • Örnek: geolocation=(self "https://a.example" "https://b.example")
  • self, https://your-site.example ifadesinin kısaltmasıdır
• Sözdizimi: [FEATURE]=([ORIGIN(s)])
  • Politika aynı kaynağa ve belirtilen kaynaklara uygulandı
  • Örnek: geolocation=("https://your-site.example" "https://a.example" "https://b.example")
  • Bu söz dizimini kullanırken kaynaklardan biri, yerleştiricinin kaynağı olmalıdır. Yerleştiren sayfanın kendisine izinler verilmediğinde, söz konusu sayfaya yerleştirilmiş iframe'ler kaynak listesine eklenmiş olsalar bile, İzin Politikası'na yetki verdiğinden engellenir. self jetonunu da kullanabilirsiniz.
• Sözdizimi: [FEATURE]=()
  • Özellik tüm kaynaklar için engellendi
  • Örnek: geolocation=()

ziyaret edin.

Uyarı: Yanıtta İzin Politikası başlığı yoksa varsayılan değer olan * jetonu kullanılır. Bu, allow özelliğine sahip sayfada bulunan tüm iframe'lerin özelliği kullanmasına izin verir. Bu nedenle, erişimi kontrol etmek için kaynak listesinin Permissions-Policy başlığında açıkça ayarlanması önemle tavsiye edilir.

Önemli bilgi: Özellik Politikası'ndaki İzin Politikası'nda yapılan değişiklik nedeniyle, kaynağı başlık kaynak listesine eklemek, bu özelliği çapraz kaynak iframe'lerde etkinleştirmek için artık yeterli olmuyor. Kaynaklar arasıysa, başlık kaynak listesinde neyin ayarlandığına bakılmaksızın iFrame, allow özelliğini içermelidir.

Farklı alt alan adları ve yollar

https://your-site.example ve https://subdomain.your-site.example gibi farklı alt alan adları aynı site, ancak çapraz kaynak olarak kabul edilir. Dolayısıyla, kaynak listesine bir alt alan adı eklemek aynı sitenin başka bir alt alan adına erişime izin vermez. Özelliği kullanmak isteyen her yerleştirilmiş alt alan adı, kaynak listesine ayrı olarak eklenmelidir. Örneğin, kullanıcının göz attığı konulara yalnızca Permissions-Policy: browsing-topics=(self) başlığıyla aynı kaynağa erişim izni veriliyorsa aynı sitenin farklı bir alt alanındaki (https://subdomain.your-site.example) iframe, konulara erişemez.

https://your-site.example ve https://your-site.example/embed gibi farklı yollar aynı kaynak olarak kabul edilir ve farklı yolların kaynak listesinde listelenmesi gerekmez.

iFrame allow özelliği

Kaynaklar arası kullanıma yönelik olarak, iframe'in özelliğe erişim elde etmek için etikette allow özelliğine ihtiyacı vardır.

Sözdizimi: <iframe src="[ORIGIN]" allow="[FEATURE] <'src' | [ORIGIN(s)]"></iframe>

Örneğin:

<iframe src="https://trusted-site.example" allow="geolocation">

Not: allow="geolocation" söz dizimi, allow="geolocation 'src'" ifadesinin kısaltmasıdır. src, iframe'in src özelliğinin kaynağına genişleyen özel bir jetondur.

iframe'de gezinmeyi işleme

Varsayılan olarak, bir iframe başka bir kaynağa giderse politika, iframe'in gittiği kaynağa uygulanmaz. iFrame'in gittiği kaynağı allow özelliğinde listelediğinizde, orijinal iframe'e uygulanan İzin Politikası, iframe'in gittiği kaynağa da uygulanır.

<iframe src="https://trusted-site.example" allow="geolocation https://trusted-site.example https://trusted-navigated-site.example">

iframe gezinme demosunu ziyaret ederek bu widget'ın nasıl çalıştığını görebilirsiniz.

Örnek İzin Politikası kurulumları

Aşağıdaki kurulum örneklerine demo bölümünden ulaşabilirsiniz.

Bu özelliğe tüm kaynaklarda izin veriliyor

Permissions-Policy: geolocation=*

<iframe src="https://trusted-site.example" allow="geolocation">
<iframe src="https://ad.example" allow="geolocation">

Kaynak listesi * jetonu olarak ayarlandığında, kendisi ve tüm iframe'ler dahil olmak üzere sayfada bulunan tüm kaynaklar için bu özelliğe izin verilir. Bu örnekte, https://your-site.example kaynağından sunulan tüm kodların yanı sıra https://trusted-site.example iframe ve https://ad.example'den sunulan kodlar, kullanıcının tarayıcısındaki coğrafi konum özelliğine erişebilir. allow özelliğinin, başlangıç noktasının başlık kaynak listesine eklenmesiyle birlikte iframe'in kendisinde de ayarlanması gerektiğini unutmayın.

Bu kurulumu demoda inceleyebilirsiniz.

Özelliğe yalnızca aynı kaynakta izin veriliyor

Permissions-Policy: geolocation=(self)

self jetonunun kullanılması, yalnızca aynı kaynakta coğrafi konum kullanımına izin verir. Çapraz kaynaklar bu özelliğe erişemez. Bu örnekte, coğrafi konuma yalnızca https://trusted-site.example (self) erişimi olacaktır. Özelliği yalnızca kendi sayfanız için kullanmak istiyorsanız ve başka kimse için kullanmak istemiyorsanız bu söz dizimini kullanın.

Bu kurulumu demoda inceleyebilirsiniz.

Aynı kaynağa ve belirli çapraz kaynaklarda bu özelliğe izin veriliyor

Permissions-Policy: geolocation=(self "https://trusted-site.example")

Bu söz dizimi, hem kendine (https://your-site.example) hem de https://trusted-site.example için coğrafi konum kullanımına izin verir. allow özelliğini iframe etiketine açıkça eklemeyi unutmayın. <iframe src="https://ad.example" allow="geolocation"> içeren başka bir iframe varsa https://ad.example coğrafi konum özelliğine erişemez. Yalnızca orijinal sayfa, kaynak listesinde yer alan https://trusted-site.example ve iframe etiketinde allow özelliğine sahip kullanıcı özelliğine erişebilir.

Bu kurulumu demoda inceleyebilirsiniz.

Özellik tüm kaynaklarda engellendi

Permissions-Policy: geolocation=()

Kaynak listesi boşsa özellik tüm kaynaklar için engellenir. Bu kurulumu demoda inceleyebilirsiniz.

Önemli nokta: Bu özellik aynı kaynak için engellenmişse, yerleştirilmiş çapraz kaynaklarda bu özelliğe izin verilmez. Üst sayfaya uygulanan izinler yerleşik iframe'lere yetki verildiğinden, çapraz kaynaklar için izin verilmesi gerekiyorsa özelliğin aynı kaynak için etkinleştirilmesi gerekir.

JavaScript API'yi kullanma

Özellik Politikası'nın mevcut JavaScript API'si, dokümanda veya öğede (document.featurePolicy or element.featurePolicy) nesne olarak bulundu. İzinler için JavaScript API Politikası henüz uygulanmadı.

Feature Policy API, bazı sınırlamalarla birlikte İzin Politikası tarafından belirlenen politikalar için kullanılabilir. JavaScript API uygulamasıyla ilgili kalan sorular bulunmaktadır ve mantığı Permissions API'ye taşımak için bir teklif oluşturulmuştur. Düşünceleriniz varsa tartışmaya katılabilirler.

featurePolicy.allowsFeature(feature)

• Özelliğe varsayılan kaynak kullanımı için izin veriliyorsa true değerini döndürür.
• Bu davranış, İzin Politikası ve önceki Özellik Politikası tarafından belirlenen her iki politika için de aynıdır
• Bir iframe öğesinde (iframeEl.featurePolicy.allowsFeature('geolocation')) allowsFeature() çağrıldığında, döndürülen değer, allow özelliğinin iframe'de ayarlanıp ayarlanmadığını yansıtır.

featurePolicy.allowsFeature(özellik; kaynak)

• Belirtilen kaynak için özelliğe izin veriliyorsa true değerini döndürür.
• Yöntem document üzerinde çağrılırsa, Özellik Politikası'nda olduğu gibi belirtilen kaynak için bu özelliğe izin verilip verilmediğini artık bildirmez. Artık bu yöntem size söz konusu özelliğin söz konusu kaynağa izin verilebileceğini belirtir. iframe'de allow özelliğinin ayarlanıp ayarlanmadığını kontrol eden ek bir kontrol yapmanız gerekir. Geliştirici, bu özelliğe üçüncü taraf kaynakta izin verilip verilmediğini belirlemek üzere iframe öğesindeki allow özelliğine yönelik bir ek kontrol yapmalıdır.

element nesnesiyle iframe'de özellik olup olmadığını kontrol edin

allow özelliğini dikkate almayan document.allowsFeature(feature, origin) özelliğinin aksine, allow özelliğini dikkate alan element.allowsFeature(feature) kullanabilirsiniz.

const someIframeEl = document.getElementById('some-iframe')
const isCameraFeatureAllowed = someIframeEl.featurePolicy.allowsFeature('camera')

featurePolicy.allowedFeatures()

• Varsayılan kaynak kullanımı için izin verilen özelliklerin listesini döndürür.
• Davranış, İzin Politikası ve Özellik Politikası tarafından belirlenen her iki politika için de aynıdır
• İlişkilendirilmiş düğüm bir iframe olduğunda, allow özelliği dikkate alınır.

featurePolicy.features()

• Tarayıcıda kullanılabilen özelliklerin listesini döndürür.
• Davranış, İzin Politikası ve Özellik Politikası tarafından belirlenen her iki politika için de aynıdır

Chrome Geliştirici Araçları entegrasyonu

Geliştirici Araçları'nda izin politikasının işleyiş şekline göz atın.

1. Chrome Geliştirici Araçları'nı açın.
2. Her bir karede izin verilen özellikleri ve izin verilmeyen özellikleri kontrol etmek için Uygulama panelini açın.
3. Kenar çubuğunda, incelemek istediğiniz kareyi seçin. Seçilen karenin kullanmasına izin verilen özelliklerin ve bu çerçevede engellenen özelliklerin listesi gösterilir.

Özellik Politikasından Taşıma

Şu anda Feature-Policy üstbilgisini kullanıyorsanız İzin Politikası'na geçiş yapmak için aşağıdaki adımları uygulayabilirsiniz.

Özellik Politikası başlıklarını İzinler Politikası başlıklarıyla değiştirin

Özellik Politikası başlıkları yalnızca Chromium tabanlı tarayıcılarda desteklendiğinden ve Chrome 88 sürümünden itibaren İzin Politikası başlıkları desteklendiğinden, mevcut üstbilgileri İzin Politikası ile güncellemek güvenlidir.

Önceki

Feature-Policy:
  autoplay *;
  geolocation 'self';
  camera 'self' 'https://trusted-site.example';
  fullscreen 'none';

Özellik Politikası'ndan önce.

Yeni

Permissions-Policy:
  autoplay=*,
  geolocation=(self),
  camera=(self "https://trusted-site.example"),
  fullscreen=()

Artık İzin Politikası ile.

document.allowsFeature(feature, origin) kullanımını güncelle

iframe'lerde izin verilen özellikleri kontrol etmek için document.allowsFeature(feature, origin) yöntemini kullanıyorsanız iFrame öğesine ekli allowsFeature(feature) yöntemini kullanın, kapsayıcı document yöntemini kullanmayın. element.allowsFeature(feature) yöntemi allow özelliğini dikkate alırken document.allowsFeature(feature, origin) yöntemi kabul etmez.

document ile özellik erişimi kontrol ediliyor

Temel düğüm olarak document kullanmaya devam etmek istiyorsanız iframe etiketinde allow özelliği için ek bir kontrol yapmanız gerekir.

<iframe id="some-iframe" src="https://example.com" allow="camera"></iframe>

Permissions-Policy: camera=(self "https://example.com")

const isCameraPolicySet = document.featurePolicy.allowsFeature('camera', 'https://example.com')

const someIframeEl = document.getElementById('some-iframe')
const hasCameraAttributeValue = someIframeEl.hasAttribute('allow')
&& someIframeEl.getAttribute('allow').includes('camera')

const isCameraFeatureAllowed = isCameraPolicySet && hasCameraAttributeValue

Mevcut kodu document kullanarak güncellemek yerine, önceki örnekte olduğu gibi element nesnesinde allowsFeature() çağrısı yapmanız önerilir.

Reporting API

Reporting API, web uygulamaları için tutarlı bir şekilde bir bildirme mekanizması sağlar. İzinler Politikası ihlalleri için Reporting API, deneysel bir özellik olarak kullanılabilir.

Deneysel özelliği test etmek isterseniz adım adım açıklamalı kılavuzu takip edin ve chrome://flags/#enable-experimental-web-platform-features ürününde bayrağı etkinleştirin. İşaret etkinleştirildikten sonra Geliştirici Araçları'ndaki Uygulama sekmesinde İzin Politikası ihlallerini gözlemleyebilirsiniz:

Aşağıdaki örnekte, Reporting API başlığının nasıl oluşturulabileceği gösterilmektedir:

Reporting-Endpoints: main-endpoint="https://reports.example/main", default="https://reports.example/default"

Content-Security-Policy: script-src 'self'; object-src 'none'; report-to main-endpoint;
Document-Policy: document-write=?0; report-to=main-endpoint;

Mevcut uygulamada, "varsayılan" adlı bir uç noktayı yapılandırarak söz konusu çerçevede gerçekleşen tüm ihlallerle ilgili politika ihlali raporları alabilirsiniz yukarıdaki örnek gibi. Alt çerçeveler için kendi raporlama yapılandırmaları gerekir.

Not: Reporting API'de varsayılan olarak Permissions Policy (İzinler Politikası) desteğini görmek istiyorsanız görüşmeye desteklerinizi veya yorumlarınızı ekleyin.

Daha fazla bilgi

İzin Politikası hakkında daha ayrıntılı bilgi için aşağıdaki kaynaklara bakın:

• İzin Politikası özellikleri
• İzin politikası açıklayıcısı
• Politikayla kontrol edilen özelliklerin listesi.