Tarayıcı ad alanına geçiş

Chrome 148'den itibaren tüm Chrome uzantısı API'leri, mevcut chrome ad alanına ek olarak browser ad alanı altında da kullanılabilir. Örneğin, browser.tabs.create({}) ve chrome.tabs.create({}) eşdeğerdir.

Ad alanı, içerik komut dosyaları, hizmet çalışanları ve ekran dışı dokümanlar dahil olmak üzere uzantı API'lerini çağırabileceğiniz her yerde kullanılabilir. chrome ile aynı API nesnelerini işaret ettiğinden chrome.tabs === browser.tabs.

browser ad alanı, tarayıcı satıcılarının ortak uzantı standartları üzerinde işbirliği yaptığı bir W3C topluluk grubu olan WebExtensions Community Group (WECG)'daki çalışmalar sonucunda ortaya çıkmıştır. chrome ad alanı kaldırılmayacak. Her iki ad alanı da çalışmaya devam edecek.

Tarayıcı ad alanını kullanıp kullanmayacağınıza karar verme

webextension-polyfill kullanıyorsanız başka bir şeyi değiştirmeden önce polyfill kullanıcıları için not bölümüne geçin. Yanıt sizin için farklıdır.

Yeni bir uzantı oluşturuyorsanız minimum_chrome_version değerini "148" olarak ayarlayın ve browser öğesini koşulsuz olarak kullanın. Okumayı burada durdurabilirsiniz. Bu bölümün geri kalanı, nasıl uyarlanacağına karar veren mevcut uzantılar içindir.

Kullanıcılarınızın hangi Chrome sürümlerini kullandığını kontrol etme

Mevcut bir uzantınız varsa geçiş yapmadan önce kullanıcılarınızın Chrome'un hangi sürümlerini kullandığını kontrol edin. Chrome otomatik olarak güncellenir ancak bazı kullanıcılar güncellemeleri devre dışı bırakır ve bazıları da en son sürümü çalıştıramayan eski cihazlar kullanır. Kendi analiz verilerinizle doğrulayın. Henüz analizleri ayarlamadıysanız başlamak için Google Analytics 4 ile uzantınızın performansını izleme başlıklı makaleyi inceleyin.

Buradan bir yol seçin:

Koşulsuz olarak benimseme

Manifest dosyanızda minimum_chrome_version değerini ayarlayın ve browser öğesini koşulsuz olarak kullanın. Çalışma zamanı koruması gerekmez:

{
  "minimum_chrome_version": "148"
}

minimum_chrome_version artırırken aşamalı yayınlama kullanın. Bir sorun yaşarsanız Chrome Web Mağazası'nda uzantınızı geri çekebilirsiniz.

Çalışma zamanı korumasını kullanma

Aşağıdaki snippet'i, uzantınızın başlangıç koduna browser öğesine başka bir yerde referans vermeden önce ekleyin:

if (!globalThis.browser) {
  globalThis.browser = chrome;
  // Consider firing an analytics event here to measure how often
  // your users hit this fallback path.
}

Bu, önceki sürümlerde browser öğesini chrome için bir takma ad yapar. Böylece kodunuzun geri kalanı browser öğesini koşulsuz olarak kullanabilir.

Polyfill kullanıcıları için not

Uzantınız webextension-polyfill kullanıyorsa Chrome 148 ve sonraki sürümlerde işlem yapmaz. Polyfill, browser zaten tanımlanmışsa sarmalamayı atlıyordu. Bunun nedeni, ana makine tarayıcısının API'yi zaten sağladığı varsayımıydı.

Ad alanını Chrome 136'da gönderme girişimi, şu nedenle geri çekildi: browser yeni tanımlandığında polyfill sarmalamayı durdurdu ancak Chrome'un browser.runtime.onMessage henüz polyfill'in sağladığı söz döndüren dinleyicileri desteklemiyordu. Bu düzene dayanan uzantılar bozuldu. Chrome 148, bu boşluğu önlemek için ad alanını ve yerel söz döndüren onMessage dinleyicilerini birlikte gönderir.

Kullanıcı tabanınız Chrome 148'e geçtikten sonra polyfill bağımlılığını kaldırabilirsiniz.

Diğer özellikler

runtime.sendMessage'de eş zamansız yanıtlar

Chrome 148'de runtime.onMessage dinleyicileri, eşzamansız yanıt göndermek için doğrudan Promise döndürebilir. Bu özellik, chrome.* veya browser.* kullanarak aradığınızda çalışır.

Daha önce, eşzamansız olarak yanıt vermenin tek yolu, dinleyiciden değişmez bir true döndürmek ve daha sonra sendResponse işlevini çağırmaktı:

// Old pattern - requires returning true to keep the channel open
chrome.runtime.onMessage.addListener((message, sender, sendResponse) => {
  fetch('https://example.com')
    .then(response => sendResponse({ statusCode: response.status }));

  return true; // keeps the message channel open for the async response
});

Artık doğrudan Promise döndürebilir (veya async işlevi kullanabilirsiniz):

// New pattern - return a promise or use async/await
browser.runtime.onMessage.addListener(async (message, sender) => {
  const response = await fetch('https://example.com');
  return { statusCode: response.status };
});

return true kalıbı çalışmaya devam ettiğinden mevcut kodun değiştirilmesi gerekmez.