Notification: Notification() constructor
Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.
Note: This feature is available in Web Workers.
The Notification()
constructor creates a new
Notification
object instance, which represents a user notification.
Note: Trying to create a notification inside the ServiceWorkerGlobalScope
using the Notification()
constructor will throw a TypeError
. Use ServiceWorkerRegistration.showNotification()
instead.
Syntax
new Notification(title)
new Notification(title, options)
Parameters
title
-
Defines a title for the notification, which is shown at the top of the notification window.
options
Optional-
An options object containing any custom settings that you want to apply to the notification. The possible options are:
actions
Optional-
Must be unspecified or an empty array.
actions
is only supported for persistent notifications fired from a service worker usingServiceWorkerRegistration.showNotification()
. badge
Optional-
A string containing the URL of the image used to represent the notification when there isn't enough space to display the notification itself; for example, the Android Notification Bar. On Android devices, the badge should accommodate devices up to 4x resolution, about 96x96px, and the image will be automatically masked.
body
Optional-
A string representing the body text of the notification, which is displayed below the title. The default is the empty string.
data
Optional-
Arbitrary data that you want associated with the notification. This can be of any structured-clonable data type. The default is
null
. dir
Optional-
The direction in which to display the notification. It defaults to
auto
, which just adopts the browser's language setting behavior, but you can override that behavior by setting values ofltr
andrtl
(although most browsers seem to ignore these settings.) icon
Optional-
A string containing the URL of an icon to be displayed in the notification.
image
Optional-
A string containing the URL of an image to be displayed in the notification.
lang
Optional-
The notification's language, as specified using a string representing a language tag according to RFC 5646: Tags for Identifying Languages (also known as BCP 47). See the Sitepoint ISO 2 letter language codes page for a simple reference. The default is the empty string.
renotify
Optional-
A boolean value specifying whether the user should be notified after a new notification replaces an old one. The default is
false
, which means they won't be notified. Iftrue
, thentag
also must be set. requireInteraction
Optional-
Indicates that a notification should remain active until the user clicks or dismisses it, rather than closing automatically. The default value is
false
. silent
Optional-
A boolean value specifying whether the notification should be silent, i.e., no sounds or vibrations should be issued regardless of the device settings. If set to
true
, the notification is silent; if set tonull
(the default value), the device's default settings are respected. tag
Optional-
A string representing an identifying tag for the notification. The default is the empty string.
timestamp
Optional-
A timestamp, given as Unix time in milliseconds, representing the time associated with the notification. This could be in the past when a notification is used for a message that couldn't immediately be delivered because the device was offline, or in the future for a meeting that is about to start.
vibrate
Optional-
A vibration pattern for the device's vibration hardware to emit with the notification. If specified,
silent
must not betrue
.
Return value
An instance of the Notification
object.
Exceptions
TypeError
-
Thrown if:
- The constructor is called within the
ServiceWorkerGlobalScope
. - The
actions
option is specified and is not empty. - The
silent
option istrue
and thevibrate
option is specified. - The
renotify
option istrue
but thetag
option is empty.
- The constructor is called within the
DataCloneError
DOMException
-
Thrown if serializing the
data
option failed for some reason.
Examples
Here is a most basic example to only show a notification if permission is already granted. For more complete examples, see the Notification
page.
if (Notification.permission === "granted") {
const notification = new Notification("Hi there!");
}
Specifications
Specification |
---|
Notifications API Standard # dom-notification-notification |
Browser compatibility
BCD tables only load in the browser
Chrome notes
Starting in Chrome 49, notifications don't work in incognito mode.
Chrome for Android will throw a TypeError
when calling the
Notification
constructor. It only supports creating
notifications from a service worker. See the
Chromium issue tracker for more details.