chrome.declarativeContent

Açıklama

Sayfanın içeriğini okuma izni gerekmeden sayfanın içeriğine bağlı işlemler yapmak için chrome.declarativeContent API'yi kullanın.

İzinler

declarativeContent

Kavramlar ve kullanım

Declarative Content API, barındırma izinleri eklemenize veya içerik komut dosyası eklemenize gerek kalmadan, uzantınızın işlemini bir web sayfasının URL'sine veya bir CSS seçicinin sayfadaki bir öğeyle eşleşmesine bağlı olarak etkinleştirmenize olanak tanır.

Kullanıcı uzantının işlemini tıkladıktan sonra bir sayfayla etkileşimde bulunmak için activeTab iznini kullanın.

Kurallar

Kurallar, koşullardan ve işlemlerden oluşur. Koşullardan herhangi biri karşılanırsa tüm işlemler yürütülür. İşlemler setIcon() ve showAction() şeklindedir.

PageStateMatcher, yalnızca listelenen tüm ölçütler karşılanırsa web sayfalarıyla eşleşir. Bir sayfa URL'si, CSS birleşik seçici veya bir sayfanın yer işareti eklenmiş durumu ile eşleşebilir. Aşağıdaki kural, şifre alanı bulunduğunda uzantının Google sayfalarındaki işlemini etkinleştirir:

let rule1 = {
  conditions: [
    new chrome.declarativeContent.PageStateMatcher({
      pageUrl: { hostSuffix: '.google.com', schemes: ['https'] },
      css: ["input[type='password']"]
    })
  ],
  actions: [ new chrome.declarativeContent.ShowAction() ]
};

Uzantı işleminin video içeren Google siteleri için de etkinleştirilmesi amacıyla ikinci bir koşul ekleyebilirsiniz. Belirtilen tüm işlemleri tetiklemek için her koşul yeterlidir:

let rule2 = {
  conditions: [
    new chrome.declarativeContent.PageStateMatcher({
      pageUrl: { hostSuffix: '.google.com', schemes: ['https'] },
      css: ["input[type='password']"]
    }),
    new chrome.declarativeContent.PageStateMatcher({
      css: ["video"]
    })
  ],
  actions: [ new chrome.declarativeContent.ShowAction() ]
};

onPageChanged etkinliği, herhangi bir kuralın en az bir koşulu karşılayıp karşılamadığını test eder ve işlemleri yürütür. Kurallar, tarama oturumları boyunca devam eder. Bu nedenle, uzantı yükleme süresi boyunca önce önceden yüklenmiş kuralları temizlemek için removeRules'ı, ardından yenilerini kaydetmek için addRules'i kullanmanız gerekir.

chrome.runtime.onInstalled.addListener(function(details) {
  chrome.declarativeContent.onPageChanged.removeRules(undefined, function() {
    chrome.declarativeContent.onPageChanged.addRules([rule2]);
  });
});

activeTab izniyle uzantınız herhangi bir izin uyarısı göstermez ve kullanıcı uzantı işlemini tıkladığında yalnızca alakalı sayfalarda çalışır.

Sayfa URL'si eşleştirme

URL ölçütleri karşılandığında PageStateMatcher.pageurl eşleşir. En yaygın ölçütler, ana makine, yol veya URL'nin ardından İçerir, Eşittir, Önek veya Sonek'in geldiği bir dize birleştirmedir. Aşağıdaki tabloda birkaç örnek verilmiştir:

Ölçütler Eşleşmeler
{ hostSuffix: 'google.com' } Tüm Google URL'leri
{ pathPrefix: '/docs/extensions' } Uzantı dokümanı URL'leri
{ urlContains: 'developer.chrome.com' } Tüm Chrome geliştirici belgeleri URL'leri

Tüm ölçütler büyük/küçük harfe duyarlıdır. Ölçütlerin tam listesi için UrlFilter konusuna bakın.

CSS Eşleştirme

PageStateMatcher.css koşulları bileşik seçici olmalıdır. Yani seçicilerinize boşluk veya ">" gibi birleştiriciler ekleyemezsiniz. Bu, Chrome'un seçicileri daha verimli bir şekilde eşleştirmesine yardımcı olur.

Bileşik Seçiciler (Tamam) Karmaşık Seçiciler (Tamam Değil)
a div p
iframe.special[src^='http'] p>span.highlight
ns|* p + ol
#abcd:checked p::first-line

CSS koşulları yalnızca görüntülenen öğelerle eşleşir: Seçicinizle eşleşen bir öğe display:none ise veya üst öğelerinden biri display:none ise koşulun eşleşmesine neden olmaz. visibility:hidden ile biçimlendirilmiş, ekran dışında konumlandırılmış veya diğer öğeler tarafından gizlenmiş öğeler, durumunuzun eşleşmesine neden olabilir.

Yer işareti eklenmiş durum eşleştirme

PageStateMatcher.isBookmarked koşulu, kullanıcının profilindeki mevcut URL'nin yer işareti durumunun eşleştirilmesine olanak tanır. Bu koşuldan yararlanmak için "yer işaretleri" izninin uzantı manifest belirtilmesi gerekir.

Türler

Tür

ImageData

PageStateMatcher

Çeşitli ölçütlere göre bir web sayfasının durumunu eşleştirir.

Özellikler

  • constructor

    geçersiz

    constructor işlevi şu şekilde görünür: 

    (arg: PageStateMatcher) => {...}

  • css

    string[] isteğe bağlı

    Dizideki CSS seçicilerinin tümü, sayfanın ana çerçevesiyle aynı köke sahip bir çerçevedeki görüntülenen öğelerle eşleşirse eşleşir. Eşleştirmeyi hızlandırmak için bu dizideki tüm seçiciler bileşik seçici olmalıdır. Not: Yüzlerce CSS seçiciyi listelemek veya sayfa başına yüzlerce kez eşleşen CSS seçicileri listelemek web sitelerini yavaşlatabilir.

  • isBookmarked

    boole isteğe bağlı

    Chrome 45 ve sonraki sürümler

    Sayfanın yer işareti durumu belirtilen değere eşitse eşleşir. Yer işaretleri izni gerekir.

  • pageUrl

    UrlFilter isteğe bağlı

    Sayfanın üst düzey URL'si için UrlFilter koşullarının karşılanması durumunda eşleşir.

RequestContentScript

İçerik komut dosyası ekleyen açıklayıcı etkinlik işlemi.

UYARI: Bu işlem hâlâ deneyseldir ve Chrome'un kararlı sürümlerinde desteklenmez.

Özellikler

  • constructor

    geçersiz

    constructor işlevi şu şekilde görünür: 

    (arg: RequestContentScript) => {...}

  • allFrames

    boole isteğe bağlı

    İçerik komut dosyasının eşleşen sayfanın tüm çerçevelerinde mi yoksa yalnızca üst çerçevede mi çalışacağını belirtir. false varsayılandır.

  • css

    string[] isteğe bağlı

    İçerik komut dosyasının bir parçası olarak eklenecek CSS dosyalarının adları.

  • js

    string[] isteğe bağlı

    İçerik komut dosyasının bir parçası olarak eklenecek JavaScript dosyalarının adları.

  • matchAboutBlank

    boole isteğe bağlı

    İçerik komut dosyasının about:blank ve about:srcdoc'e eklenip eklenmeyeceği. Varsayılan değer false'tir.

SetIcon

İlgili koşullar karşılanırken uzantının sayfa işlemi veya tarayıcı işlemi için n-dip kare simgesini ayarlayan açıklayıcı etkinlik işlemi. Bu işlem barındırma izinleri olmadan kullanılabilir ancak uzantının bir sayfa veya tarayıcı işlemi olmalıdır.

imageData veya path özelliklerinden tam olarak biri belirtilmelidir. Her ikisi de bir dizi pikseli bir resim temsiliyle eşleyen sözlüklerdir. imageData içindeki resim temsili, bir canvas öğesinden alınan ImageData nesnesi iken path içindeki resim temsili, uzantının manifest'ine göre bir resim dosyasının yoludur. scale ekran pikseli, cihazdan bağımsız bir piksele sığıyorsa scale * n simgesi kullanılır. Bu ölçek yoksa başka bir resim gerekli boyuta yeniden boyutlandırılır.

Özellikler

  • constructor

    geçersiz

    constructor işlevi şu şekilde görünür: 

    (arg: SetIcon) => {...}

  • imageData

    ImageData | nesne isteğe bağlı

    Ayarlanacak simgeyi temsil eden bir ImageData nesnesi veya sözlük ({size -> ImageData}). Simge bir sözlük olarak belirtilirse kullanılan resim, ekranın piksel yoğunluğuna göre seçilir. Bir ekran alanı birimine sığabilecek resim piksellerinin sayısı scale ise scale * n boyutunda bir resim seçilir. Burada n, kullanıcı arayüzündeki simgenin boyutudur. En az bir resim belirtilmelidir. details.imageData = foo değerinin details.imageData = {'16': foo} değerine eşit olduğunu unutmayın.

ShowAction

Chrome 97 ve sonraki sürümler

İlgili koşullar karşılanırken uzantının araç çubuğu işlemini etkin duruma ayarlayan açıklayıcı bir etkinlik işlemi. Bu işlem, ana makine izinleri olmadan kullanılabilir. Uzantı activeTab iznine sahipse sayfa işlemini tıklamak etkin sekmeye erişim izni verir.

Koşulların karşılanmadığı sayfalarda uzantının araç çubuğu işlemi gri tonlamalı olur ve tıklandığında işlem tetiklenmez, bağlam menüsü açılır.

Özellikler

ShowPageAction

Chrome 97'den beri desteği sonlandırıldı

Lütfen declarativeContent.ShowAction kullanın.

İlgili koşullar karşılanırken uzantının sayfa işlemini etkin duruma ayarlayan açıklayıcı bir etkinlik işlemi. Bu işlem barındırma izinleri olmadan kullanılabilir ancak uzantının bir sayfa işlemi olmalıdır. Uzantı activeTab iznine sahipse sayfa işlemini tıklamak etkin sekmeye erişim izni verir.

Koşulların karşılanmadığı sayfalarda uzantının araç çubuğu işlemi gri tonlamalı olur ve tıklandığında işlem tetiklenmez, bağlam menüsü açılır.

Özellikler

Etkinlikler

onPageChanged

addRules, removeRules ve getRules'den oluşan Declarative Event API'yi sağlar.

Koşullar

PageStateMatcher

İşlemler

RequestContentScript

SetIcon

ShowPageAction

ShowAction