Merge pull request #786 from nimbleghost/web-notif-compat-docs

Add docs detailing web notification support
pull/788/head
Philipp C. Heckel 2023-06-27 20:44:26 -04:00 committed by GitHub
commit d294a692d2
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 35 additions and 5 deletions

View File

@ -26,3 +26,13 @@ Be sure that in your selfhosted server:
* Set `upstream-base-url: "https://ntfy.sh"` (**not your own hostname!**) * Set `upstream-base-url: "https://ntfy.sh"` (**not your own hostname!**)
* Ensure that the URL you set in `base-url` **matches exactly** what you set the Default Server in iOS to * Ensure that the URL you set in `base-url` **matches exactly** what you set the Default Server in iOS to
## Firefox on Android not automatically subscribing to web push
ntfy defaults to web-push based subscriptions when installed as a [progressive web app](./subscribe/pwa.md). Firefox
Android has an [open bug](https://bugzilla.mozilla.org/show_bug.cgi?id=1796434) where it reports the PWA mode incorrectly.
This causes ntfy to not automatically subscribe to web push, and requires you to go to the ntfy Settings page to enable
it manually.
## Safari does not play sounds for web push notifications
Safari does not support playing sounds for web push notifications, and treats them all as silent. This will be fixed with
iOS 17 / Safari 17, which will be released later in 2023.

View File

@ -23,6 +23,25 @@ If topic reservations are enabled, you can claim ownership over topics and defin
<a href="../../static/img/web-reserve-topic-dialog.png"><img src="../../static/img/web-reserve-topic-dialog.png"/></a> <a href="../../static/img/web-reserve-topic-dialog.png"><img src="../../static/img/web-reserve-topic-dialog.png"/></a>
</div> </div>
## Notification features and browser support
- Emoji tags are supported in all browsers
- [Click](../publish.md#click-action) actions are supported in all browsers
- Only Chrome, Edge, and Opera support displaying view and http [actions](../publish.md#action-buttons) in notifications.
Their presentation is platform specific.
Note that HTTP actions are performed using fetch and thus are limited to the [CORS](https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS)
rules, which means that any URL you include needs to respond to a [preflight request](https://developer.mozilla.org/en-US/docs/Glossary/Preflight_request)
with headers allowing the origin of the ntfy web app (`Access-Control-Allow-Origin: https://ntfy.sh`) or `*`.
- Only Chrome, Edge, and Opera support displaying [images](../publish.md#attachments) in notifications.
Look at the [Notifications API](https://developer.mozilla.org/en-US/docs/Web/API/Notifications_API#browser_compatibility)
for more info.
## Background notifications ## Background notifications
While subscribing, you have the option to enable background notifications on supported browsers (see "Settings" tab). While subscribing, you have the option to enable background notifications on supported browsers (see "Settings" tab).
@ -30,13 +49,13 @@ Note: If you add the web app to your homescreen (as a progressive web app, more
docs), you cannot turn these off, as notifications would not be delivered reliably otherwise. You can mute topics you don't want to receive docs), you cannot turn these off, as notifications would not be delivered reliably otherwise. You can mute topics you don't want to receive
notifications for. notifications for.
**If background notifications are off:** This requires an active ntfy tab to be open to receive notifications. **If background notifications are off:** This requires an active ntfy tab to be open to receive notifications.
These are typically instantaneous, and will appear as a system notification. If you don't see these, check that your browser These are typically instantaneous, and will appear as a system notification. If you don't see these, check that your browser
is allowed to show notifications (for example in System Settings on macOS). If you don't want to enable background notifications, is allowed to show notifications (for example in System Settings on macOS). If you don't want to enable background notifications,
**pinning the ntfy tab on your browser** is a good solution to leave it running. **pinning the ntfy tab on your browser** is a good solution to leave it running.
**If background notifications are on:** This uses the [Web Push API](https://caniuse.com/push-api). You don't need an active **If background notifications are on:** This uses the [Web Push API](https://caniuse.com/push-api). You don't need an active
ntfy tab open, but in some cases you may need to keep your browser open. Background notifications are only supported on the ntfy tab open, but in some cases you may need to keep your browser open. Background notifications are only supported on the
same server hosting the web app. You cannot use another server, but can instead subscribe on the other server itself. same server hosting the web app. You cannot use another server, but can instead subscribe on the other server itself.
If the ntfy app is not opened for more than a week, background notifications will be paused. You can resume them If the ntfy app is not opened for more than a week, background notifications will be paused. You can resume them
@ -50,6 +69,7 @@ by opening the app again, and will get a warning notification before they are pa
| Opera | Desktop | ✅ | ❌ | | | Opera | Desktop | ✅ | ❌ | |
| Safari | Desktop | ✅ | ✅ | requires Safari 16.1, macOS 13 Ventura | | Safari | Desktop | ✅ | ✅ | requires Safari 16.1, macOS 13 Ventura |
| Chrome | Android | ✅ | ✅ | | | Chrome | Android | ✅ | ✅ | |
| Firefox | Android | ✅ | ✅ | |
| Safari | iOS | ⚠️ | ⚠️ | requires iOS 16.4, only when app is added to homescreen | | Safari | iOS | ⚠️ | ⚠️ | requires iOS 16.4, only when app is added to homescreen |
(Browsers below 1% usage not shown, look at the [Push API](https://caniuse.com/push-api) for more info) (Browsers below 1% usage not shown, look at the [Push API](https://caniuse.com/push-api) for more info)