Notifikasi lengkap dengan webKit

Gunakan notifikasi desktop yang kaya untuk memberi tahu pengguna bahwa telah terjadi sesuatu yang penting. Notifikasi muncul di luar jendela browser. Seperti yang ditunjukkan dalam snapshot berikut, detail tampilan notifikasi dan tempat notifikasi tersebut ditampilkan bergantung pada platform.

Anda membuat jendela notifikasi menggunakan sedikit JavaScript dan, jika ingin, halaman HTML yang dikemas di dalam ekstensi.

Contoh

Pertama, deklarasikan izin notifications dalam manifes Anda:

{
  "name": "My extension",
  "manifest_version": 2,
  ...
  "permissions": [
    "notifications"
  ],
  ...
  // Note: Because of bug 134315, you must declare any images you
  // want to use with createNotification() as a web accessible resource.
  "web_accessible_resources": [
    "48.png"
  ],
}

Lalu, gunakan objek webkitNotifications untuk membuat notifikasi:

// Note: There's no need to call webkitNotifications.checkPermission().
// Extensions that declare the notifications permission are always
// allowed create notifications.

// Create a simple text notification:
var notification = webkitNotifications.createNotification(
  '48.png',  // icon url - can be relative
  'Hello!',  // notification title
  'Lorem ipsum...'  // notification body text
);

// Or create an HTML notification:
var notification = webkitNotifications.createHTMLNotification(
  'notification.html'  // html url - can be relative
);

// Then show the notification.
notification.show();

Referensi API

Lihat Spesifikasi Draf Notifikasi Desktop.

Berkomunikasi dengan tampilan lain

Anda dapat berkomunikasi antara notifikasi dan tampilan lain di ekstensi menggunakan extension.getBackgroundPage dan extension.getViews. Contoh:

chrome.extension.getBackgroundPage().doThing();

chrome.extension.getViews({type:"notification"}).forEach(function(win) {
  win.doOtherThing();
});

Contoh lainnya

Anda dapat menemukan contoh sederhana penggunaan notifikasi dalam direktori examples/api/notifications. Untuk contoh lain dan untuk bantuan dalam melihat kode sumber, lihat Contoh.

Lihat juga tutorial notifikasi html5Rock.com. Abaikan kode terkait izin; kode ini tidak diperlukan jika Anda mendeklarasikan izin "notifikasi".