Уведомление
Интерфейс Notification
из Notifications API используется для настройки и отображения уведомлений на рабочий стол пользователя.
Примечание: Эта возможность доступна в Web Workers.
Конструктор
Notification()
-
Создаёт новый экземпляр объекта
Notification
.
Свойства
Собственные свойства
Следующие свойства доступны только для самого объекта Notification
.
Notification.permission
Только для чтения-
Строка, показывающая текущие права доступа для отображения уведомлений. Возможные значения:
denied
- Пользователь отказался от отображения уведомлений.granted
- Пользователь дал согласие на отображение уведомлений.default
- Выбор пользователя неизвестен, и поэтому браузер будет действовать так, как если бы значение былоdenied
Свойства экземпляра
Следующие свойства доступны только для экземпляров объекта Notification
.
Notification.actions
Только для чтения-
Массив действий уведомления, указывается в опциях как параметр конструктора.
Notification.badge
Только для чтения-
URL изображения, используемого для отображения уведомления в случае, если недостаточно места для самого уведомления.
Notification.body
Только для чтения-
Основное тело (текст) уведомления, указывается в опциях как параметр конструктора.
Notification.data
Только для чтения-
Возвращает структурированную копию содержания уведомления.
Notification.dir
Только для чтения-
Направление текста уведомления, указывается в опциях как параметр конструктора.
Notification.lang
Только для чтения-
Код языка уведомления, указывается в опциях как параметр конструктора.
Notification.tag
Только для чтения-
Идентификатор (ID) уведомления, если есть, указывается в опциях как параметр конструктора.
Notification.icon
Только для чтения-
URL изображения, используемого в качестве иконки уведомления, указывается в опциях как параметр конструктора.
Notification.image
Только для чтения-
URL изображения, которое должно быть изображено в уведомлении, указывается в опциях как параметр конструктора.
Notification.renotify
Только для чтения-
Определяет, должен ли пользователь снова быть уведомлен, если новое уведомление заменяет предыдущее.
Notification.requireInteraction
Только для чтения-
Булево значение, отражающее, останется ли уведомление активным до тех пор, пока пользователь вручную не кликнет или не закроет его, в противоположность автоматическому закрытию со временем.
Notification.silent
Только для чтения-
Указывает, должно ли уведомление не сопровождаться звуковым или вибро сигналом, независимо от настроек устройства.
Notification.timestamp
Только для чтения-
Указывает время, в которое уведомление создано, либо применимо (в прошлом, настоящем или будущем).
Notification.title
Только для чтения-
Заголовок уведомления, указывается в опциях как параметр конструктора.
Notification.vibrate
Только для чтения-
Задаёт шаблон вибрации для устройств с вибро.
Не поддерживаемые свойства
Следующие свойства указаны в наиболее актуальной спецификации, но пока что не поддерживаются браузерами. Рекомендуем регулярно проверять актуальность этой информации, и если их статус изменится, пожалуйста, просим оповестить нас.
Notification.noscreen
Только для чтения-
Определяет, должно ли срабатывание уведомления включать дисплей устройства или нет.
Notification.sticky
Только для чтения-
Определяет, должно ли уведомление быть "липким", то есть не легко закрываемым.
Обработчики событий
Notification.onclick
-
Обработчик события
click
. Срабатывает каждый раз, когда пользователь кликает по уведомлению. Notification.onerror
-
Обработчик события
error
. Срабатывает каждый раз, когда уведомление сталкивается с ошибкой.
Устаревшие обработчики событий
Следующие обработчики событий все ещё поддерживаются, как указано в разделе browser compatibility ниже, но более не входят в актуальную спецификацию. Небезосновательно можно предположить, что они устарели и могут перестать работать в будущих версиях браузеров.
Notification.onclose
-
Обработчик события
close
. Срабатывает при закрытии уведомления пользователем. Notification.onshow
-
Обработчик события
show
. Срабатывает при отображении уведомления. Notification.sound
Только для чтения-
Определяет звуковой файл для воспроизведения при уведомлении, по умолчанию установлен системный звук.
Методы
Собственные методы
Следующие методы доступны только для самого объекта Notification
.
Notification.requestPermission()
-
Запрашивает разрешение у пользователя показывать уведомления.
Методы экземпляра
Следующие методы доступны только для экземпляров объекта Notification
, либо через его прототип
. Объект Notification
также наследует методы интерфейса EventTarget
.
Notification.close()
-
Программно закрывает уведомление.
Пример
Базовый HTML:
<button onclick="notifyMe()">Notify me!</button>
Отправить уведомление можно следующим образом — ниже представлен довольно подробный и полный набор кода, который вы могли бы использовать для того, чтобы сначала проверить поддержку уведомлений, затем проверить, позволено ли данному источнику отправлять уведомления, и наконец, запросив разрешение, если требуется, отправить уведомление.
function notifyMe() {
// Проверка поддержки браузером уведомлений
if (!("Notification" in window)) {
alert("This browser does not support desktop notification");
}
// Проверка разрешения на отправку уведомлений
else if (Notification.permission === "granted") {
// Если разрешено, то создаём уведомление
var notification = new Notification("Hi there!");
}
// В противном случае, запрашиваем разрешение
else if (Notification.permission !== "denied") {
Notification.requestPermission(function (permission) {
// Если пользователь разрешил, то создаём уведомление
if (permission === "granted") {
var notification = new Notification("Hi there!");
}
});
}
// В конечном счёте, если пользователь отказался от получения
// уведомлений, то стоит уважать его выбор и не беспокоить его
// по этому поводу.
}
В большинстве случаев вам не надо быть столь многословными. Например в нашем демо Emogotchi (исходный код), мы просто запускаем Notification.requestPermission
несмотря ни на что, чтобы быть уверенными, что мы сможем получить разрешение на отправку уведомлений (тут используется синтаксис новейшего promise-based метода):
Notification.requestPermission().then(function (result) {
console.log(result);
});
Затем мы запускаем простую функцию spawnNotification()
, когда мы хотим вывести уведомление, передающую аргументы для указания тела, иконки и заголовка, которые нам нужны, а затем она создаёт необходимый объект параметров options
и запускает уведомление с помощью конструктора Notification()
.
function spawnNotification(body, icon, title) {
var options = {
body: body,
icon: icon,
};
var n = new Notification(title, options);
}
Спецификации
Specification |
---|
Notifications API Standard # api |
Совместимость с браузерами
BCD tables only load in the browser