Open a custom url when clicking on a web push notification : <p>I am implementing the <a href="https://github.com/zaru/webpush" rel="noreferrer">Webpush ruby gem</a> to send push notifications to users of my website. </p>

<p>Server code:</p>

<pre><code>  Webpush.payload_send({
      message: notification.message,
      url: notification.url,  # I can't figure out how to access this key
      id: notification.id,    # or this key from the service worker
      endpoint: endpoint,
      p256dh: p256dh_key,
      vapid: vapid_keys,
      ttl: 24 * 60 * 60,
      auth: auth_key,
    })
</code></pre>

<p>I have a service worker set up on the client side to show the notification and make it clickable.</p>

<pre><code>self.addEventListener("push", function (event) {
  var title = (event.data &amp;&amp; event.data.text()) || "New Message";

  event.waitUntil(
    self.registration.showNotification(title, {
      body: "New push notification",
      icon: "/images/logo@2x.png",
      tag:  "push-notification-tag",
      data: {
        url: event.data.url, // This is returning null
        id: event.data.id // And this is returning null
      }
    })
  )
});

self.addEventListener('notificationclick', function(event) {
  event.notification.close();
  event.waitUntil(
    clients.openWindow(event.data.url + "?notification_id=" + event.data.id)
  );
})
</code></pre>

<p>It is all working fine, except the custom keys (<code>url</code>, <code>id</code>) that I am passing through are not accessible from within the service worker.</p>

<p>Does anyone know how to pass custom data through the WebPush gem?</p>
