npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@kalisio/feathers-webpush

v1.0.1

Published

Manage web push notifications

Downloads

667

Readme

feathers-webpush

Latest Release Build Status Code Climate Test Coverage Download Status

feathers-webpush simplifies the sending of web push notifications in a FeathersJS application.

Principle

The feathers-webpush module provides a simplified way to send web push notifications in a FeathersJS application. It leverages the web-push package to interact with the Web Push protocol.

feathers-webpush principle

Usage

Installation

npm install @kalisio/feathers-webpush --save

or

yarn add @kalisio/feathers-webpush

Example

The provided example illustrates how to setup:

  • a server app

https://github.com/kalisio/feathers-webpush/blob/6b09d58428923c95e26cd58d130bc6b268c4cb30/example/server.mjs#L1-L46

  • a browser client app

https://github.com/kalisio/feathers-webpush/blob/6b09d58428923c95e26cd58d130bc6b268c4cb30/example/src/index.html#L1-L66

https://github.com/kalisio/feathers-webpush/blob/6b09d58428923c95e26cd58d130bc6b268c4cb30/example/src/index.js#L1-L122

API

feathers-webpush consists of two parts:

  • Service that provides create method for sending notifications
  • Hooks, which provide function for deleting expired subscriptions

Service

Service (options)

Create an instance of the service with the given options:

| Parameter | Description | Required | |---|---|---| |vapidDetails | The vapidDetails configuration. Refer to the web-push package documentation for more information. | yes | | app | The feathers app instance. | yes |

create (data, params)

The create method is used to send web push notifications. The data payload must contain the following properties:

| Property | Description | Required | |---|---|---| |notification | The data payload for the push notification. | yes | | subscriptionService | The name of the service where subscriptions are registered. | yes | | subscriptionProperty | The name of the key where subscriptions are regitered. It can be an array of subscriptions or a single subscription object | yes | | subscriptionFilter | The filter you wish to apply when retrieving subscriptions. | no |

Note: Subscription should be registered in the following format: { endpoint: 'url_google', keys: { auth: 'xxxx', p256dh: 'xxxx' }}

Hooks

The feathers-webpush module provides a hook for managing web push subscriptions.

deleteExpiredSubscriptions ()

The deleteExpiredSubscriptions is an after hook that deletes expired subscriptions. It should be used after the create method.

To use this hook, you need to import it and include it in your FeathersJS application.

Exemple usage:

import { deleteExpiredSubscriptions } from '@kalisio/feathers-webpush'

app.service('push-notifications').hooks({
  after: {
    create: [deleteExpiredSubscriptions()]
  }
})

Client

The client.js file provides a utility to manage client-side web push notifications with the following functions:

Checking prerequisites

Before using web push notifications, you need to check if the necessary prerequisites are met. The checkPrerequisites function provided by feathers-webpush can be used for this purpose. It checks whether the browser supports notifications and returns error message 498 if it does not.

Requesting notification permission

To ask the user for permission to send notifications, you can use the requestNotificationPermission function provided by feathers-webpush. This function requests permission from the user and returns code 499 if permission is denied, or the status of the permission.

Get push subscription

The getPushSubscription function retrieves the current push subscription, if it exists. It returns the subscription object or null if there is no active subscription.

Subscribe to push notifications

To subscribe to push notifications, use the subscribePushNotifications function. It requires a public VAPID key as a parameter and returns the subscription object.

Unsubscribe from push notifications

To unsubscribe from push notifications, use the unsubscribePushNotifications function. It retrieves the registration from the service worker and unsubscribes the current push subscription. It returns the unsubscribed subscription object.

Adding and removing subscriptions

You can add or remove subscriptions from a user object using the addSubscription and removeSubscription functions provided by feathers-webpush. These functions require the user object, the current subscription, and the subscription property.

Tests

To run the tests for feathers-webpush, install the required node modules and run npm run test or yarn test.

To perform the tests, you need to create web push subscription and set the following environment variables:

  • SUBSCRIPTION_TEST_ENDPOINT
  • SUBSCRIPTION_TEST_KEY_AUTH
  • SUBSCRIPTION_TEST_KEY_P256DH

License

Copyright (c) 2017-20xx Kalisio

Licensed under the MIT license.

Authors

This project is sponsored by

Kalisio