8 |
9 |
10 | 
11 |
12 |
13 | 
14 |
15 |
16 | 
17 |
18 |
19 |
20 | ## Prerequisities
21 |
22 | * Elixir 1.15
23 | * OTP 24 / 25 / 26
24 |
25 | ## Installation
26 |
27 | 1. Add `web_push_elixir` to your list of dependencies in `mix.exs`:
28 |
29 | ```elixir
30 | def deps do
31 | [
32 | {:web_push_elixir, "~> 0.4.0"}
33 | ]
34 | end
35 | ```
36 |
37 | 2. Run mix command to generate your Vapid public and private keys:
38 |
39 | ```commandline
40 | mix generate.vapid.keys
41 | ```
42 |
43 | 3. Set config for your generated keys:
44 |
45 | ```elixir
46 | config :web_push_elixir,
47 | vapid_public_key: "someVapidPublicKey",
48 | vapid_private_key: "someVapidPrivateKey",
49 | vapid_subject: "mailto:admin@email.com"
50 | ```
51 |
52 | ## Usage
53 |
54 | `WebPushElixir` provides a simple `send_notification/2` that takes 2 arguments:
55 |
56 | * `subscription`: the subscription information received from the client - [example demo](https://midarrlabs.github.io/web-push-elixir/)
57 | * `message`: the message string.
58 |
59 | ```elixir
60 | subscription = '{"endpoint":"https://some-push-service","keys":{"p256dh":"BNcRdreALRFXTkOOUHK1EtK2wtaz5Ry4YfYCA_0QTpQtUbVlUls0VJXg7A8u-Ts1XbjhazAkj7I99e8QcYP7DkM=","auth":"tBHItJI5svbpez7KI4CCXg=="}}'
61 | message = "Some message"
62 |
63 | WebPushElixir.send_notification(subscription, message)
64 | ```
65 |
66 | For more information on how to subscribe a client, permission UX and more - take a look at [https://web.dev/notifications/](https://web.dev/notifications/)
67 |
68 | ## Run tests
69 |
70 | ```commandline
71 | mix test
72 | ```
73 |
74 | ## License
75 |
76 | Web Push Elixir is open-sourced software licensed under the [MIT license](LICENSE).
77 |
78 |
79 | ## Credits
80 |
81 | Heavily inspired by [elixir-web-push-encryption](https://github.com/danhper/elixir-web-push-encryption)
82 |
--------------------------------------------------------------------------------
/config/config.exs:
--------------------------------------------------------------------------------
1 | import Config
2 |
3 | if Mix.env() == :test do
4 | import_config "test.exs"
5 | end
--------------------------------------------------------------------------------
/config/test.exs:
--------------------------------------------------------------------------------
1 | import Config
2 |
3 | config :web_push_elixir,
4 | vapid_public_key: "someVapidPublicKey",
5 | vapid_private_key: "someVapidPrivateKey",
6 | vapid_subject: "mailto:admin@email.com"
--------------------------------------------------------------------------------
/example/app.webmanifest:
--------------------------------------------------------------------------------
1 | {
2 | "name": "Web Push Elixir",
3 | "display": "standalone"
4 | }
--------------------------------------------------------------------------------
/example/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/midarrlabs/web-push-elixir/092ac293b5f98781d28b74a1e6c8afe9dcab82d1/example/favicon.ico
--------------------------------------------------------------------------------
/example/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 | Web Push Elixir
15 |Example client subscription for push notifications
17 |Service worker successfully registered
' 7 | }) 8 | .catch(err => { 9 | message.innerHTML += `Unable to register service worker - ${err}
` 10 | }) 11 | 12 | const request = document.getElementById('request') 13 | const subscribe = document.getElementById('subscribe') 14 | 15 | request.addEventListener('click', event => { 16 | Notification.requestPermission() 17 | .then(permission => { 18 | message.innerHTML += `Permission ${permission}
` 19 | }) 20 | }); 21 | 22 | subscribe.addEventListener('click', event => { 23 | navigator.serviceWorker.ready 24 | .then(registration => { 25 | 26 | registration.pushManager.subscribe({ 27 | userVisibleOnly: true, 28 | applicationServerKey: 'BDntLA3k5K1tsrFOXXAuS_9Ey30jxy-R2CAosC2DOQnTs8LpQGxpTEx3AcPXinVYFFpJI6tT_RJC8pHgUsdbhOk' 29 | }) 30 | .then(pushSubscription => { 31 | message.innerHTML += `Received PushSubscription:
` 32 | message.innerHTML += `${JSON.stringify(pushSubscription)}
` 33 | }) 34 | .catch(err => { 35 | registration.pushManager.getSubscription().then(subscription => { 36 | if (subscription !== null) { 37 | subscription 38 | .unsubscribe() 39 | .then(successful => { 40 | message.innerHTML += 'Unsubscribed from existing subscription, please subscribe again
' 41 | }) 42 | .catch(err => { 43 | message.innerHTML += `Failed to unsubscribe from existing subscription - ${err}
` 44 | }) 45 | } else { 46 | message.innerHTML += 'No subscription found
' 47 | } 48 | }) 49 | }) 50 | }) 51 | }) -------------------------------------------------------------------------------- /example/service-worker.js: -------------------------------------------------------------------------------- 1 | self.addEventListener('push', event => { 2 | if (event.data) { 3 | const promiseChain = self.registration.showNotification(event.data.text()); 4 | 5 | event.waitUntil(promiseChain); 6 | } else { 7 | console.log('This push event has no data.'); 8 | } 9 | }); -------------------------------------------------------------------------------- /lib/mix/tasks/generate_vapid_keys.ex: -------------------------------------------------------------------------------- 1 | defmodule Mix.Tasks.Generate.Vapid.Keys do 2 | @moduledoc "The mix task: `mix help generate.vapid.keys`" 3 | use Mix.Task 4 | 5 | @shortdoc "Generate vapid keys" 6 | def run(_args) do 7 | {public_key, private_key} = :crypto.generate_key(:ecdh, :prime256v1) 8 | 9 | %{ 10 | vapid_public_key: Base.url_encode64(public_key, padding: false), 11 | vapid_private_key: Base.url_encode64(private_key, padding: false), 12 | vapid_subject: "mailto:admin@email.com" 13 | } 14 | |> IO.inspect 15 | end 16 | end 17 | -------------------------------------------------------------------------------- /lib/web_push_elixir.ex: -------------------------------------------------------------------------------- 1 | defmodule WebPushElixir do 2 | @moduledoc """ 3 | Module to send web push notifications with an encrypted payload. 4 | """ 5 | 6 | defp url_encode(string) do 7 | Base.url_encode64(string, padding: false) 8 | end 9 | 10 | defp url_decode(string) do 11 | Base.url_decode64!(string, padding: false) 12 | end 13 | 14 | defp hmac_based_key_derivation_function(salt, initial_keying_material, info, length) do 15 | pseudo_random_key = 16 | :crypto.mac_init(:hmac, :sha256, salt) 17 | |> :crypto.mac_update(initial_keying_material) 18 | |> :crypto.mac_final() 19 | 20 | :crypto.mac_init(:hmac, :sha256, pseudo_random_key) 21 | |> :crypto.mac_update(info) 22 | |> :crypto.mac_update(<<1>>) 23 | |> :crypto.mac_final() 24 | |> :binary.part(0, length) 25 | end 26 | 27 | defp encrypt_payload(message, p256dh, auth) do 28 | client_public_key = url_decode(p256dh) 29 | client_auth_secret = url_decode(auth) 30 | 31 | salt = :crypto.strong_rand_bytes(16) 32 | 33 | {local_public_key, local_private_key} = :crypto.generate_key(:ecdh, :prime256v1) 34 | 35 | shared_secret = :crypto.compute_key(:ecdh, client_public_key, local_private_key, :prime256v1) 36 | 37 | pseudo_random_key = 38 | hmac_based_key_derivation_function( 39 | client_auth_secret, 40 | shared_secret, 41 | "Content-Encoding: auth" <> <<0>>, 42 | 32 43 | ) 44 | 45 | context = 46 | <<0, byte_size(client_public_key)::unsigned-big-integer-size(16)>> <> 47 | client_public_key <> 48 | <