How to trigger desktop notification 24 hours later without backend server?
Asked Answered
I

4

17

Assuming:

  1. User has allowed notifications on my website.
  2. Service worker is installed and ready.
  3. User sets a client side reminder to be reminded 24 hours from now.
  4. No backend service or server to push the notification to the user.

How can I trigger a desktop notification if there is no backend server to push that notification? Is this possible?

The service worker will be shutdown by the browser if provided a timeout/interval and the web-alarm/task-scheduler specification is not yet ready for use. Is there no client side only approach to trigger a notification at some designated time in the future?

Is there a desktop notification that is strictly not a "push notification"? A push notification, by nature, is pushed from a server. Can a notification be triggered from the client side?

Influence answered 16/12, 2018 at 14:56 Comment(2)
Are browser extensions an option? They might have the possibility to send a notification 24h later, even if the user is no longer on the page.Transient
Yes @Transient browser extensions would be an option.Influence
S
9

I do not believe this is possible at this point in time.

Push notifications are specified in RFC8030, from its abstract:

This document describes a simple protocol for the delivery of real-
time events to user agents. This scheme uses HTTP/2 server push.

Which implies the requirement for a server supporting HTTP/2 push.

I do love to rant at Javascript, and I do not seem to be able to find an Javascript implementation of an HTTP2 server to run in the browser (there is for node), which is a shame for me, and would be awesome to mock about.

So, looking for fame, http2-server.js is missing.

Subtype answered 16/12, 2018 at 15:17 Comment(4)
Understood about "push" notifications. I think by nature push notifications will require a backend server to push it. I hope there is a desktop notification of sort which can be triggered at a specific time as a reminder or alarm.Influence
I don't think it's possible with a service worker currently because a timeout or interval will be ignored due to the browser shutting down inactive workers. I was hoping for confirmation.Influence
Might be the case indeed. If you figure something out, please post it.Subtype
Of course, will do. It is highly doubtful that there is a client side only solution.Influence
B
7

You might be able to consider using localStorage. However, this is only beneficial for users that utilize the same device and browser.

Below is a function that kicks off on page load. If you want it to occur periodically throughout a session, you could wrap it into a setInterval and check periodically. This is assuming it needs to be exactly 24 hours later to the millisecond.

// on page load
window.onload = () => {
    const dayMs = 24*60*60*1000; // 1 day in milliseconds
    const notificationTimer = localStorage.getItem('notificationTimer');
    if(notificationTimer){
        const sendNotification = (Date.now() - (new Date(notificationTimer)).getTime()) > dayMs;
        if(sendNotification){
            const notification = new Notification('Displaying next day reminder from yesterday');
        }
    }

};

When the user selects the next day reminder you can then set the notificationTimer:

localStorage.setItem(notificationTimer, Date.now());

You'd have to make some caveats about the next day reminder not working across browsers or devices, which may or may not be desirable.

Banerjee answered 29/12, 2018 at 19:4 Comment(3)
This is a great option @Joe, except for the fact that I think the OP is looking for more of a "Push Notification" kind of solution - i.e. one that works even when the user is not browsing the website.Disbelieve
Mortz is correct about wanting a notification even when the user is not browsing the website.Influence
Ugh, this answer was automatically awarded the bounty by the Community since I was delayed in choosing. I am still looking for a way to trigger a notification 24 hours later. The website being open shouldn't be a requirement but it's okay if the browser is open. Perhaps with a browser extension like @Transient mentions.Influence
C
2

As things stand while writing this (3rd Jan 2019):

There is no "desktop notification" that is not strictly "push notification" and works well cross platforms.

  • It is not possible to trigger a "desktop notification" without your app working in the background.
  • Service workers are not supposed to use timers and will be shut down.
  • The Operating System or other utility software may also suggest or even shut down your background application.
  • There is no client side only approach to trigger your notification at a precise time in the future. There are too many reasons for organisations not allowing this to happen at present.

Your only choice seems to be to use a different Push Notification Service coupled with an external scheduling service that would trigger the external notification based on custom schedules.

Your requirements as I understand them:

  • Each visitor would need to subscribe to push notifications
  • Record externally customer preference (for example: using some cloud scheduling)
  • Use the external scheduling service to trigger the push notification service.

PUSH NOTIFICATIONS are SERVER TRIGGERED not CLIENT REQUESTED

The main point of push notifications is that you should trigger the notification externally to avoid using resources on the end user device. This does not stop you collect notification preferences from users, save this information externally so you can trigger a notification externally when needed.

More information about PWA notification can be found in the following article: https://developers.google.com/web/fundamentals/codelabs/push-notifications/

As far I know PWA Service Workers should not use timers!

As an alternative to using the PWA notifications, you may want to rightly consider using different notification service. For example FCM https://firebase.google.com/docs/cloud-messaging/

The idea could be to save externally the notification preference of the user and trigger the FCM notification via another cloud service when the scheduled time is reached.

Obviously those notifications will only ever work if the users are connected to the network. However this would have been also the case with any Notification service requiring network access.

I hope the above helps, Cheers and happy codding!

Cockleboat answered 2/1, 2019 at 13:29 Comment(2)
Is there a desktop notification that is strictly not a "push notification"?Influence
There is no "desktop notification" that will not cause an issue one way or another. However you might want to consider using FCM notification coupled with a scheduling service if the expense is justified. Both external to your application. I have updated my answer to cover this aspect of your updated question.Cockleboat
A
-1

Assuming the notification data on your website will not be sent from the server. Using local storage will be the way to go.

You can store a variable to help track when to show the notification anytime the user hits your website:

localStorage.setItem("lastNotification", Date.now());

So you can have a script that does the following;

function notificationHelper(){
    var lastTime = localStorage.getItem("lastNotification");
    if(Date.now - lastTime > 86400000){

        //Logic to show notication here
        //set a new time at the end of the logic

    }
    //Otherwise Do Nothing
}
Antimicrobial answered 2/1, 2019 at 19:2 Comment(1)
Is there a way to ensure this function is executed 24 hours in the future? I understand a simple timeout does not work because the service worker is shutdown.Influence

© 2022 - 2024 — McMap. All rights reserved.