Start typing to search the documentation.

to navigate·to open

Push

Install the snippet

Add WRNexus Web Push to any website — drop in the SDK snippet, host the service worker, and trigger the opt-in prompt from a user gesture.

Adding browser push to your site is two steps: load the SDK snippet on every page, and host the service worker at your site root. This page covers the snippet; the worker has its own setup guide.

Prerequisites

  • A push site created in the WRNexus Push dashboard. Creating it gives you a non-secret site key (publicKey) — copy it from Push → Settings.
  • Your site served over HTTPS (push and service workers require a secure context; http://localhost is allowed for local development).

1. Add the SDK snippet

Drop this on every page, ideally just before </body>. Replace SITE_KEY with your site key:

<script
  src="https://api.wrnexus.com/push/sdk.js"
  data-site-id="SITE_KEY"
  defer
></script>

The loader is fully static and cacheable — all per-site values (your VAPID public key and the API origin) are fetched at runtime from /push/config, so there is nothing to build.

On load the SDK:

  1. Resolves your site config from /push/config?siteKey=SITE_KEY.
  2. Registers the service worker on your origin (default path /wrnexus-push-sw.js).
  3. Refreshes the server-side record for a browser that is already subscribed.

It shows no permission prompt on load — that is always explicit (step 3).

data-* options

Attribute Default Description
data-site-id (required) Your site key (publicKey). Alias: data-site.
data-sw /wrnexus-push-sw.js Path to the service worker on your origin. Must be same-origin with the page.
data-sw-scope / Scope the worker controls. Must be allowed by the worker’s path / Service-Worker-Allowed header.
data-api the SDK’s own origin Override the origin used to fetch /push/config. Rarely needed.
data-debug false Set "true" to log SDK activity to the console.

2. Host the service worker

Copy https://api.wrnexus.com/push/sw.js to the root of your site and serve it at https://your-domain.example/wrnexus-push-sw.js over HTTPS with Content-Type: text/javascript. This is required — a worker can only control its own origin. Full requirements (scope headers, MIME type, optional re-subscribe config) are in the Service worker setup guide.

3. Trigger the opt-in prompt

Wire WRNexusPush.prompt() to a real click. The browser permission prompt only appears here — never on page load:

<button id="enable-push">Enable notifications</button>

<script>
  document.getElementById('enable-push').addEventListener('click', function () {
    WRNexusPush.prompt().then(function (res) {
      if (res.ok) {
        console.log('Subscribed!', res.id);
      } else {
        console.log('Not subscribed — permission:', res.permission);
      }
    });
  });
</script>

prompt() requests permission, subscribes the browser, and registers the subscription with WRNexus. It resolves to { ok, permission, id, subscription }. subscribe() is a kept alias of prompt().

Calling the SDK before it loads

If you defer the script you may want to queue calls. Initialise WRNexusPush as an array first — the SDK drains any queued [method, ...args] entries once it loads:

<script>
  window.WRNexusPush = window.WRNexusPush || [];
  // queued until the SDK is ready (won't show a prompt unless from a gesture)
  WRNexusPush.push(['track']);
</script>

4. Verify

  • Open the page with data-debug="true" and confirm config and service worker registered log lines.
  • Click your enable button, accept the prompt, and check the new row under Push → Subscribers in the dashboard.
  • Call WRNexusPush.isSubscribed() in the console — it should resolve true.

Next steps