Eğitim: Manifest V2'ye Taşıma

Manifest sürümü 1, Chrome 18'de kullanımdan kaldırılmıştır ve destek, manifest sürüm 1 destek programı hakkında daha fazla bilgi edinin. Sürüm 1'den sürüm 2'ye yapılan değişiklikler iki Genel kategoriler: API değişiklikleri ve Güvenlik değişiklikleri.

Bu dokümanda, Chrome uzantılarınızı manifest sürüm 1'den ardından bu değişikliklerin ne anlama geldiğine ve neden yaptıklarına ilişkin daha ayrıntılı özetler yer almaktadır.

API değişiklikleriyle ilgili yapılacaklar listesi

  • browser_actions özelliğini mi yoksa chrome.browserActions API'sini mi kullanıyorsunuz?

  • browser_actions değerini tek browser_action özelliğiyle değiştirin.

  • chrome.browserActions yerine chrome.browserAction yazın.

  • icons özelliğini default_icon ile değiştirin.

  • name özelliğini default_title ile değiştirin.

  • popup özelliğini default_popup ile değiştirin (ve artık bir dize olmalıdır).

  • page_actions özelliğini mi yoksa chrome.pageActions API'sini mi kullanıyorsunuz?

  • page_actions yerine page_action yazın.

  • chrome.pageActions yerine chrome.pageAction yazın.

  • icons özelliğini default_icon ile değiştirin.

  • name özelliğini default_title ile değiştirin.

  • popup özelliğini default_popup ile değiştirin (ve artık bir dize olmalıdır).

  • chrome.self özelliğini mi kullanıyorsunuz?

  • Şununla değiştir: chrome.extension.

  • Port.tab özelliğini mi kullanıyorsunuz?

  • Şununla değiştir: Port.sender.

  • chrome.extension.getTabContentses() veya chrome.extension.getExtensionTabs() API'leri mi var?

  • Şununla değiştir: chrome.extension.getViews( { "type" : "tab" } ).

  • Uzantınız bir arka plan sayfası kullanıyor mu?

  • background_page özelliğini, background özelliğiyle değiştirin.

  • Sayfanın kodunu içeren bir scripts veya page özelliği ekleyin.

  • Arka plan sayfanızı etkinliğe dönüştürmek için bir persistent özelliği ekleyip false olarak ayarlayın sayfa

Güvenlik değişiklikleriyle ilgili yapılacaklar listesi

  • HTML sayfalarında satır içi komut dosyası blokları kullanıyor musunuz?

  • <script> etiketlerinde bulunan JS kodunu kaldırın ve harici bir JS dosyasına yerleştirin.

  • Satır içi etkinlik işleyiciler (tıklama gibi) kullanıyor musunuz?

  • Bunları HTML kodundan kaldırın, harici bir JS dosyasına taşıyın ve addEventListener() kullanın .

  • Uzantınız, kaynaklara erişmesi gereken web sayfalarına (ör. resim ve komut dosyaları) nasıl taranır?

  • web_accessible_resources özelliğini tanımlayın ve kaynakları (ve isteğe bağlı olarak bir (bu kaynaklar için ayrı İçerik Güvenliği Politikası'na tabidir).

  • Uzantınız harici web sayfaları yerleştiriyor mu?

  • Korumalı alan özelliğini tanımlayın.

  • Kodunuz veya kitaplığınız eval(), yeni Function(), innerHTML, setTimeout() veya aksi takdirde dinamik olarak değerlendirilen JS kodu dizelerini aktarır mı?

  • JSON kodunu bir nesneye ayrıştırıyorsanız JSON.parse() kullanın.

  • AngularJS gibi CSP'ye uygun bir kitaplık kullanın.

  • Manifest'inizde bir korumalı alan girişi oluşturun ve aşağıdaki komutu kullanarak etkilenen kodu korumalı alanda çalıştırın: Korumalı alana alınmış sayfayla iletişim kurmak için postMessage().

  • jQuery veya Google Analytics gibi harici bir kod mu yüklüyorsunuz?

  • Kitaplığı indirip uzantınızda paketlemeyi, ardından dosyayı yerel paket.

  • "content_security_policy" içinde kaynağı sunan HTTPS alanını izin verilenler listesine ekleyin bir kısmı manifest'ini kullanabilirsiniz.

API değişikliklerinin özeti

Manifest sürümü 2, tarayıcı işlemi ve sayfa işlemi API'lerinde birkaç değişiklik içerir ve yeni API'lerle ilgilenmeniz gerekir.

Tarayıcı işlemlerinde yapılan değişiklikler

Tarayıcı işlemleri API'si bazı adlandırma değişiklikleri sunar:

  • browser_actions ve chrome.browserActions özellikleri browser_action ve chrome.browserAction gibi tekil eş anlamlılar.
  • Eski browser_actions mülkünün altında icons, name ve popup mülkleri bulunuyordu. Bunların yerini şununla değiştirildi:

  • Tarayıcı işlemi rozeti simgesi için default_icon

  • Fareyle rozetin üzerine geldiğinizde ipucunda görünen metin için default_name

  • Tarayıcı işlemine ilişkin kullanıcı arayüzünü temsil eden HTML sayfası için default_popup (ve bu artık zorunludur dize olamaz ve nesne olamaz.)

Sayfa işlemlerinde yapılan değişiklikler

Tarayıcı işlemleriyle ilgili değişikliklere benzer şekilde, page actions API'sinde de değişiklikler yapıldı:

  • page_actions ve chrome.pageActions özellikleri, kendi tekil özelliğiyle değiştirildi page_action ve chrome.pageAction eşdeğerleri.
  • Eski page_actions mülkünün altında icons, name ve popup mülkleri bulunuyordu. Bu şununla değiştirildi:

  • Sayfa işlemi rozeti simgesi için default_icon

  • Fareyle rozetin üzerine geldiğinizde ipucunda görünen metin için default_name

  • Sayfa işlemine ilişkin kullanıcı arayüzünü temsil eden HTML sayfası için default_popup (ve bu artık dizeyse nesne olamaz)

Kaldırılan ve değiştirilen API'ler

Birkaç uzantı API'si kaldırıldı ve yerini yeni eşdeğerleriyle aldı:

  • background_page özelliğinin yerini background (arka plan) aldı.
  • chrome.self özelliği kaldırıldı, chrome.extension özelliğini kullanın.
  • Port.tab özelliği Port.sender ile değiştirildi.
  • chrome.extension.getTabContentses() ve chrome.extension.getExtensionTabs() API'leri chrome.extension.getViews( { "type" : "tab" } ) ile değiştirildi.

Güvenlik değişikliklerinin özeti

Manifest sürümü 1'den 2. sürüm olduğundan emin olun. Bu değişikliklerin çoğu, Chrome'un İçerik Güvenliği Politikası'nı kabul etmesinden kaynaklanır; siz bu politika hakkında daha fazla bilgi edinmelisiniz.

Satır içi komut dosyalarına ve etkinlik işleyicilere izin verilmiyor

İçerik Güvenliği Politikası'nın kullanımı nedeniyle artık satır içi <script> etiketlerini kullanamazsınız HTML içeriği. Bunların harici JS dosyalarına taşınması gerekir. Ayrıca, satır içi etkinlik işleyiciler desteklenmez. Örneğin, uzantınızda aşağıdaki kodun olduğunu varsayalım:

<html>
<head>
  <script>
    function myFunc() { ... }
  </script>
</head>
</html>

Bu kod, çalışma zamanında hataya neden olur. Bunu düzeltmek için <script> etiketinin içeriğini harici dosyalara taşıyın ve bunlara src='path_to_file.js' özelliğiyle referans verin.

Benzer şekilde, birçok kullanıcı tarafından kullanılan ve yaygın karşılaşılan bir özellik olan satır içi etkinlik işleyiciler web geliştiricileri çalıştırmaz. Örneğin, aşağıdakiler gibi yaygın örnekleri ele alalım:

<body onload="initialize()">
<button onclick="handleClick()" id="button1">

Bunlar manifest V2 uzantılarında çalışmaz. Satır içi etkinlik işleyicileri kaldırın ve harici bir JS dosyası yükleyin ve bunun yerine, kendileri için etkinlik işleyicileri kaydetmek üzere addEventListener() kullanın. Örneğin, Örneğin, JS kodunuzda şunu kullanın:

window.addEventListener("load", initialize);
...
document.getElementById("button1").addEventListener("click",handleClick);

Bu, uzantınızın davranışını kullanıcı arayüzü işaretlemesinden ayırmanın çok daha kolay bir yoludur.

İçerik yerleştirme

Uzantınızın harici olarak kullanılabilecek içerik yerleştirebileceği veya harici bir kaynaktan geliyorsa.

Web sayfalarındaki uzantı içeriği: Uzantınız içerikte kullanılan kaynakları (resimler, komut dosyası, CSS stilleri gibi) yerleştiriyorsa web sayfalarına yerleştirilen komut dosyaları için web_accessible_resources özelliğini kullanmanız gerekir. izin verilenler listesine ekleyin:

{
...
  "web_accessible_resources": [
    "images/image1.png",
    "script/myscript.js"
  ],
...
}

Harici içerik yerleştirme: İçerik Güvenliği Politikası, paketinizden yalnızca yerel komut dosyası ve nesnelerin yüklenmesine izin verir. Bu şekilde harici saldırganların uzantınıza bilinmeyen kod getirmesini önler. Ancak, farklı zamanlarda jQuery veya Google Analytics kodu gibi harici olarak sunulan kaynakları yüklemek istediğinizde. Bunu yapmanın iki yolu vardır:

  1. İlgili kitaplığı yerel olarak (jQuery gibi) indirin ve uzantınızla birlikte paketleyin.
  2. Şurada HTTPS kaynaklarını izin verilenler listesine ekleyerek CSP'yi sınırlı bir şekilde gevşetebilirsiniz: &quot;content_security_policy&quot; bölümüne ekleyin. Google Analytics gibi bir kitaplığı dahil etmek için şu yaklaşımı benimseymelisiniz:

    {
      ...,
      "content_security_policy": "script-src 'self'
      https://ssl.google-analytics.com; object-src 'self'",
      ...
    }
    

Dinamik komut dosyası değerlendirmesini kullanma

Yeni manifest v2 şemasındaki en büyük değişikliklerden biri, uzantıların artık eval() veya yeni Function() gibi dinamik komut dosyası değerlendirme tekniklerini kullanın ya da JS dizelerini iletin eval() kullanılmasına neden olacak setTimeout() gibi işlevlere kod ekleyin. Bunun yanı sıra, Google Haritalar ve belirli şablon oluşturma kitaplıkları gibi yaygın olarak kullanılan JavaScript kitaplıkları, bazılarını kullanmayı öğrendiniz.

Chrome, sayfaların kendi kaynaklarında çalıştırılması için bir korumalı alan sağlar. Ancak Chrome'a erişimi engellenir.* API'ler. eval() ve benzerlerini yeni İçerik Güvenliği Politikası kapsamında kullanmak için:

  1. Manifest dosyanızda bir korumalı alan girişi oluşturun.
  2. Korumalı alan girişinde, korumalı alanda çalıştırmak istediğiniz sayfaları listeleyin.
  3. Korumalı alana alınmış sayfayla iletişim kurmak için postMessage() üzerinden mesaj iletmeyi kullanın.

Bunun nasıl yapılacağıyla ilgili daha fazla bilgi için Korumalı Alana Alma Değerlendirmesi dokümanlarına bakın.

Daha fazla bilgi

Manifest sürümü 2'deki değişiklikler, geliştiricileri daha güvenli ve güvenilir uygulamalar iyi tasarlanmış uzantılar ve uygulamalardır. Manifest sürümü 1'deki değişikliklerin tam listesini görmek için için manifest dosyası dokümanlarına bakın. Korumalı alan özelliğini kullanma hakkında daha fazla bilgi için güvenli olmayan kodu izole etmek için korumalı alan oluşturma eval makalesini okuyun. İçerik hakkında daha fazla bilgi Uzantılarla ilgili eğiticimizi ve HTML5Rocks.