Bu eğitim, ilk Chrome Uygulamanızı oluşturma konusunda size yol gösterir. Chrome Uygulamaları benzer şekilde yapılandırılmıştır Böylece mevcut geliştiricilerin manifest ve paketleme yöntemlerini tanıyabilmelerini sağlayın. Zaman yayınlamak için kodunuzun ve öğelerinizin bir ZIP dosyasını oluşturmanız uygulamasını indirin.
Bir Chrome uygulaması şu bileşenleri içerir:
- Manifest, Chrome'a uygulamanız, ne olduğu, nasıl başlatılacağı ve içerdiği ekstra özellikler hakkında bilgi verir izin vermesi gerekir.
- Arka plan komut dosyası, uygulama ömrünü yönetmekten sorumlu etkinlik sayfasını oluşturmak için kullanılır döngüsünü de takip eder.
- Tüm kodlar Chrome Uygulaması paketine dahil edilmelidir. Buna HTML, JS, CSS ve Native Client dahildir modüllerinde yer alır.
- Tüm simgeler ve diğer öğeler de pakete dahil edilmelidir.
1. Adım: Manifest dosyasını oluşturun
Öncelikle manifest.json
dosyanızı oluşturun (Biçimler: Manifest Dosyaları, bu manifesti
ayrıntı):
{
"name": "Hello World!",
"description": "My first Chrome App.",
"version": "0.1",
"manifest_version": 2,
"app": {
"background": {
"scripts": ["background.js"]
}
},
"icons": { "16": "calculator-16.png", "128": "calculator-128.png" }
}
.
2. Adım: Arka plan komut dosyasını oluşturun
Sonra aşağıdaki içeriğe sahip background.js
adında yeni bir dosya oluşturun:
chrome.app.runtime.onLaunched.addListener(function() {
chrome.app.window.create('window.html', {
'outerBounds': {
'width': 400,
'height': 500
}
});
});
Yukarıdaki örnek kodda, kullanıcı uygulamayı başlattığında onLaunched etkinliği tetiklenir. Google ardından hemen belirtilen genişlik ve yüksekliğe sahip uygulama için bir pencere açılır. Geçmişiniz komut dosyası ek dinleyiciler, pencereler, gönderi mesajları ve başlatma verileri içerebilir. Bunların tümü Etkinlik sayfası tarafından uygulamayı yönetmek için kullanılır.
3. Adım: Pencere sayfası oluşturun
window.html
dosyanızı oluşturun:
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div>Hello, world!</div>
</body>
</html>
4. Adım: Simgeleri oluşturun
Bu simgeleri uygulama klasörünüze kopyalayın:
5. Adım: Uygulamanızı başlatın
İşaretleri etkinleştir
Chrome Apps API'lerinin birçoğu hâlâ deneysel olduğundan bu API'lerin şunları deneyebilirsiniz:
- chrome://flags sayfasına gidin.
- "Deneysel Uzantı API'leri"ni bulun ve "Etkinleştir"i tıklayın bağlantısını tıklayın.
- Chrome'u yeniden başlatın.
Uygulamanızı yükleme
Uygulamanızı yüklemek için Chrome ayarları simgesini tıklayarak uygulama ve uzantı yönetimi sayfasını açın Araçlar > Uzantılar.
Geliştirici modu onay kutusunun seçili olduğundan emin olun.
Paketlenmemiş uzantı yükle düğmesini tıklayın, uygulamanızın klasörüne gidin ve Tamam'ı tıklayın.
Yeni sekme aç ve başlat
Uygulamanızı yükledikten sonra Yeni Sekme sayfası açın ve yeni uygulama simgenizi tıklayın.
İsterseniz komut satırından yükleyip başlatabilirsiniz
Chrome'a yönelik bu komut satırı seçenekleri, yineleme yapmanıza yardımcı olabilir:
--load-and-launch-app=/path/to/app/
, paketlenmemiş uygulamayı belirtilen yoldan yükler ve başlatır. Uygulama zaten çalışıyorsa güncellenmiş içerikle yeniden yüklenir.--app-id=ajjhbohkjpincjgiieeomimlgnll
, Chrome'da yüklü olan bir uygulamayı başlatır. İçermiyor: çalışan bir uygulamayı yeniden başlatır, ancak yeni uygulamayı güncellenmiş içerikle başlatır.