@notibase/web
npm install @notibase/web
import { Notibase } from "@notibase/web";
const nb = new Notibase({
clientKey: "ck_live_...", // PUBLIC by design — see Security
apiUrl: "https://api.notibase.com",
serviceWorkerPath: "/sw.js", // default
});
The constructor throws loudly if it sees an sk_ key — server keys
never belong in a browser.
Service worker
Create public/sw.js (must be served from your site root):
importScripts("https://api.notibase.com/sdk/sw.js");
Subscribe
// From a user gesture, after your own soft prompt:
const { deviceId } = await nb.subscribeWebPush("<VAPID_PUBLIC_KEY>");
Handles: permission request → worker registration → push subscription →
device registration (locale + timezone auto-captured, so
filters work with zero instrumentation).
The device id persists in localStorage.
Identify & track
// signature comes from YOUR server — see Security → Identity verification
await nb.identify("user-42", { signature, attributes: { plan: "pro" } });
await nb.track("purchase", { value: 9.99, currency: "USD" });
await nb.track("session_start");
Reserved events (install, session_start, purchase) feed
attribution — the SDK auto-captures ?nb_click
from /l/… landing URLs, so campaign links match installs with zero extra code.
Inbox & live messages
const { items, unread } = await nb.inbox.list(); // persistent inbox
await nb.inbox.markRead(items.map(i => i.id));
nb.enableLiveMessages(); // instant banners/modals pushed to this open tab
// custom rendering: nb.enableLiveMessages({ onMessage: m => { myUI(m); return true; } })
Details and the realtime frame protocol: In-app inbox.
Browser support
| Browser | Status |
|---|---|
| Chrome, Edge, Firefox, Opera (desktop + Android) | ✅ Full support |
| Safari macOS 16+ | ✅ Standard web push |
| Safari iOS/iPadOS 16.4+ | ✅ for web apps added to the Home Screen — prompt users to “Add to Home Screen” first |
Payloads are capped ~4 KB by the push services; Notibase rejects
oversized content at the API with a clear error instead of a silent drop.
Try it without writing code
The hosted demo page subscribes any browser against your app with just a client key + VAPID key — useful for verifying setup before your integration exists.