Im trying to use the web notification API (https://developer.mozilla.org/en-US/docs/Web/API/Notification) to show browser notification, something like the example of this link (in marked answer) Chrome desktop notification example
However, Im looking for something that will automatically show certain such notification on daily basis, on a particular time. Like i see such notification for facebook in chrome browser. Is that possible? how can i achieve that? I know there might some browser limitation, however i'll be happy if i can do that for chrome and firefox.
You would need to use the Push API, service workers, and some corresponding server infrastructure. That way, if users opt-in, you can wake up your service worker at a particular time and deliver a message to the user.
Related
I'm wondering if it is possible to track location while a Webapp is backgrounded?
I've heard this functionality is in the pipeline for service workers, though I can't find any literature on exactly how to do it.
It would be fine to just save the location on the phone until the phone is unlocked and then send location data over a network when the user re-opens the browser/tab.
If it isn't possible with purely Web technologies, what would be the best way to do this. Could one build a native app to handle tracking capability and still have a Web interface as the main UI?
A bit of context
I'm developing an app for a charity that allows users to track themselves when out and about etc.. The users are likely to lock their phones when on patrol so I need to account for this. I've built the majority of the app as a Webapp and it would be an big (and boring) task to rewrite it as a native android and apple app!
No, it is not possible for privacy reasons. You also cannot do any sort of accurate scheduling via the Service Workers when the app is in the background, eg. use setTimeout or so (throttled by the browser).
You've probably read about the background sync API which allows you to ask the Service Worker to submit some data when a connection is available. With this API you can implement retry for form POSTs and stuff like that but not have the location tracked. Find out more here: https://davidwalsh.name/background-sync
I know you can send push notifications to a user who has installed the pwa. However, this always requires a server which sends that notification and also the end user device to be online to recieve and show it.
I was wondering if there is a way to "schedule" a push notification to be shown later, like it is possible on Android to be able to realize something like reminders for events, without the need to have an internet connections.
EDIT: Since Chrome 80, notification triggers are available as an origin trial.
There are at least 3 web APIs/specs in the development related to some form of the scheduled tasks. None of them are in production though.
Periodic Background Sync API
Explainer: https://github.com/beverloo/periodic-background-sync
Bug: https://bugs.chromium.org/p/chromium/issues/detail?id=925297
Status: https://www.chromestatus.com/feature/5689383275462656 (in dev)
Main feature: it enables a web app to run tasks periodically while the device has network connectivity
Notification Triggers (a.k.a. Scheduled Notification API / Event Alarms)
Explainer: https://github.com/beverloo/notification-triggers
Bug: https://bugs.chromium.org/p/chromium/issues/detail?id=891339
Status: https://www.chromestatus.com/feature/5133150283890688 (proposed, part of Project Fugu)
Main feature: this allows to show a notification (nothing else) reliably at a specific time in the future, even if the device is offline
Scheduled Task API (Generic Alarms)
Explainer: internal design docs only
Bug: https://bugs.chromium.org/p/chromium/issues/detail?id=889077
Status: TBD, part of Project Fugu
Main feature: schedule code to run at a specified time in the future - cron for the Web
So answering the original question: your choice is Notification Triggers API. Hopefully this will land in the browsers soon.
What is the difference between Chrome Notifications API and the Push Notification API when developing Web notifications. When each one should be used and how are they different?
NOTIFICATION API
The Notifications API lets a web page or app send notifications that are displayed outside the page at the system level; this lets web apps send information to a user even if the application is idle or in the background. This article looks at the basics of using this API in your own apps.
https://developer.mozilla.org/en-US/docs/Web/API/Notifications_API/Using_the_Notifications_API
PUSH API
The Push API gives web applications the ability to receive messages pushed to them from a server, whether or not the web app is in the foreground, or even currently loaded, on a user agent. This lets developers deliver asynchronous notifications and updates to users that opt in, resulting in better engagement with timely new content.
https://developer.mozilla.org/en/docs/Web/API/Push_API
Check these links for more info:
https://www.w3.org/TR/push-api/
https://www.w3.org/TR/notifications/
It can be confusing, but if I get this right, looking for a clear answer myself, it is like this:
Notifications API = used to send notifications when the user IS ON your site/app, even when idle or in the background.
Push API = used to send notifications when the user IS NOT ON your site/app at the moment.
Browser compatibility
https://caniuse.com/notifications
https://caniuse.com/push-api
NOTE: For Safari on macOS Apple has it's own push notification API:
https://developer.apple.com/library/archive/documentation/NetworkingInternet/Conceptual/NotificationProgrammingGuideForWebsites/Introduction/Introduction.html
Safari on iOS still doesn't support any of the two APIs (Feb 2021).
I've been looking at the Web Notification API or Desktop Notification API. I understand how it's constructed and the number of attributes and events that it supports. The notifications are meant to be separated from the browser sot that even if the browser is minimized for example the notification can still be displayed.
My question is, is there a way to link the notification with actions on the web page? In particular, I want to close all notification dialogues upon refreshing the page. How can I make that happen?
Thanks in advance.
You don't mention a service worker but I'm going to assume you have one since you need it for the Push and Notifications APIs.
When the page loads, you could send a message to your service worker instructing it to close all notifications. You can then do that within the worker like this:
self.getNotifications().then(function(notifications){
notifications.forEach(function(notification){
notification.close()
})
})
However you can skip the message to the service worker and just do this from the page via the service worker registration as follows:
navigator.serviceWorker.getRegistration().then(function(registration){
registration.getNotifications().then(function(notifications){
notifications.forEach(function(notification){
notification.close()
})
})
})
However, note that getNotifications() is only available from Chrome 44. Before Chrome 44, or in other browsers, I don't believe there's a way to do what you want.
I have a Ruby on Rails 3 application, and I want to be able to see a list of who is currently online. For example user1, IP address, and country. I then want to be able to open a chat / push messages to this user until they leave my site.
How can I accurately monitor who is currently on the site and instantly remove the user from the list when they leave?
I then can talk to them via faye pub/sub.
How can I accurately monitor who is currently on the site and instantly remove from list when they leave?
Well using HTTP you can not do this "instantly" in a browser. Almost all solutions I see use a heartbeat technique. Every X seconds, a request is sent from the browser (using Ajax), that tells if the user is online. If you haven't heard from the user in x heartbeats, you regard the user as disconnected - even Facebook uses this, it seems. I will recommend you to drop your requirement for instant, unless it's really important.
Another approach is to implement Flash or Silverlight, to make a socket connection to the server. But the demand on the server is high, and if many people is on your site, you will run into trouble with ports and so on.
I think this is not so much related with Ruby on Rails... but this is very hard to implement in HTTP with a scripting language only. The server does not know whether a user has closed the browser or not. The server just sends the requested page data to the user and closes the connection.
You would rather have to integrate Ajax or Flash to make things easier. I have seen some people developing chat programs with Flash, and it seems to work much better than any other Ajax-implemented chat programs.
Chat is very unfavorable in a web browsing context, since the page will be reloaded as the user clicks a link. If you are thinking about building an application that only supports a chat feature, you probably want to look something other than Ruby on Rails. For example, Node.js will be a good one.