Notification

Constructor

Notification()

Tạo một thể hiện mới của đối tượng Notification.

Thuộc tính tĩnh

Cũng kế thừa các thuộc tính từ giao diện cha, EventTarget.

Notification.permission Read only

Một chuỗi biểu thị quyền hiện tại để hiển thị thông báo. Các giá trị có thể là:

• denied - Người dùng từ chối hiển thị thông báo.
• granted - Người dùng chấp nhận hiển thị thông báo.
• default - Chưa biết lựa chọn của người dùng, vì vậy trình duyệt sẽ hành xử như thể giá trị là denied.

Notification.maxActions Read only Experimental

Số lượng hành động tối đa được thiết bị và User Agent hỗ trợ.

Thuộc tính thể hiện

Cũng kế thừa các thuộc tính từ giao diện cha, EventTarget.

Notification.actions Read only Experimental

Mảng hành động của thông báo, được chỉ định trong tham số options của constructor.

Notification.badge Read only

Một chuỗi chứa URL của ảnh dùng để đại diện cho thông báo khi không đủ chỗ để hiển thị chính thông báo đó, ví dụ như trên thanh thông báo Android. Trên thiết bị Android, ảnh badge nên hỗ trợ độ phân giải tới 4x, khoảng 96 x 96 px, và ảnh sẽ tự động bị che mặt nạ.

Notification.body Read only

Chuỗi nội dung của thông báo, được chỉ định trong tham số options của constructor.

Notification.data Read only

Trả về một bản sao cấu trúc của dữ liệu thông báo.

Notification.dir Read only

Hướng văn bản của thông báo, được chỉ định trong tham số options của constructor.

Notification.icon Read only

URL của ảnh được dùng làm biểu tượng của thông báo, được chỉ định trong tham số options của constructor.

Notification.image Read only Experimental

URL của ảnh được hiển thị như một phần của thông báo, được chỉ định trong tham số options của constructor.

Notification.lang Read only

Mã ngôn ngữ của thông báo, được chỉ định trong tham số options của constructor.

Notification.navigate Read only Experimental

URL điều hướng của thông báo. Khi được đặt, kích hoạt thông báo sẽ điều hướng tới URL này thay vì phát sự kiện click hoặc notificationclick.

Notification.renotify Read only Experimental

Chỉ định xem người dùng có nên được thông báo lại sau khi một thông báo mới thay thế thông báo cũ hay không.

Notification.requireInteraction Read only

Giá trị boolean cho biết thông báo phải còn hoạt động cho đến khi người dùng bấm hoặc đóng, thay vì tự động biến mất.

Notification.silent Read only

Chỉ định xem thông báo có nên im lặng hay không, tức là không phát âm thanh hoặc rung, bất kể cài đặt thiết bị.

Notification.tag Read only

ID của thông báo, nếu có, như được chỉ định trong tham số options của constructor.

Notification.timestamp Read only Experimental

Chỉ định thời điểm thông báo được tạo hoặc áp dụng, có thể là quá khứ, hiện tại hoặc tương lai.

Notification.title Read only

Tiêu đề của thông báo, như được chỉ định trong tham số đầu tiên của constructor.

Notification.vibrate Read only Experimental

Chỉ định một mẫu rung cho các thiết bị có phần cứng rung.

Phương thức tĩnh

Cũng kế thừa các phương thức từ giao diện cha, EventTarget.

Notification.requestPermission()

Yêu cầu quyền từ người dùng để hiển thị thông báo.

Phương thức thể hiện

Cũng kế thừa các phương thức từ giao diện cha, EventTarget.

Notification.close()

Đóng thông báo theo cách lập trình.

Sự kiện

Cũng kế thừa các sự kiện từ giao diện cha, EventTarget.

click

Phát ra khi người dùng bấm vào thông báo.

close

Phát ra khi người dùng đóng thông báo.

error

Phát ra khi thông báo gặp lỗi.

show

Phát ra khi thông báo được hiển thị.

Ví dụ

Giả sử HTML cơ bản này:

<button>Notify me!</button>

Có thể gửi thông báo như sau. Ở đây chúng ta trình bày một ví dụ khá dài và đầy đủ mà bạn có thể dùng nếu muốn trước tiên kiểm tra xem thông báo có được hỗ trợ hay không, sau đó kiểm tra xem quyền hiển thị thông báo cho origin hiện tại đã được cấp chưa, rồi yêu cầu quyền nếu cần, trước khi gửi thông báo.

document.querySelector("button").addEventListener("click", notifyMe);

function notifyMe() {
  if (!("Notification" in window)) {
    // Kiểm tra xem trình duyệt có hỗ trợ thông báo hay không
    alert("This browser does not support desktop notification");
  } else if (Notification.permission === "granted") {
    // Kiểm tra xem quyền hiển thị thông báo đã được cấp chưa;
    // nếu rồi thì tạo thông báo
    const notification = new Notification("Hi there!");
    // …
  } else if (Notification.permission !== "denied") {
    // Chúng ta cần xin quyền từ người dùng
    Notification.requestPermission().then((permission) => {
      // Nếu người dùng chấp nhận, hãy tạo thông báo
      if (permission === "granted") {
        const notification = new Notification("Hi there!");
        // …
      }
    });
  }

  // Cuối cùng, nếu người dùng đã từ chối thông báo và bạn
  // muốn tôn trọng lựa chọn đó thì không cần làm phiền họ nữa.
}

Chúng tôi không còn hiển thị mẫu trực tiếp trên trang này nữa, vì Chrome và Firefox không còn cho phép yêu cầu quyền thông báo từ các <iframe> cùng origin chéo, và các trình duyệt khác cũng sẽ sớm theo sau. Để xem ví dụ hoạt động, hãy xem ví dụ To-do list của chúng tôi.

Thông số kỹ thuật

Tương thích trình duyệt

Xem thêm

• Dùng Notifications API