Web quick start
Standard Web Push, no Firebase. Works in Chrome, Edge, Firefox and Safari (on iPhone only when the site is added to the home screen; that is a browser rule).
On this page
1Allow your site#
Open the app → Settings → General settings → App data → Allowed web origins, e.g.
https://app.example.com or https://*.example.com for every subdomain. Use HTTPS and enter the
origin, not a page path.
2Host the service worker#
Copy /sdk/v1/TakeedSDKWorker.js from Takeed to your site, e.g. at /push/TakeedSDKWorker.js.
It must be served from your own domain.
3Load the SDK#
<script src="https://takeed-iq.com/sdk/v1/takeed.js" defer></script>
<script>
window.TakeedDeferred = window.TakeedDeferred || [];
TakeedDeferred.push(async (Takeed) => {
await Takeed.init({
appId: 'YOUR-APP-ID',
serviceWorkerPath: '/push/TakeedSDKWorker.js',
serviceWorkerScope: '/push/',
});
});
</script>4Ask for permission#
Ask after a user action (a button), not on page load:
await Takeed.Notifications.requestPermission();Browsers that already allowed notifications are subscribed again silently.
5Identify the user#
await Takeed.login('user-42'); // or login('user-42', identityHash)
await Takeed.User.addTags({ plan: 'gold' });
Takeed.Notifications.addEventListener('click', (event) => console.log(event));
await Takeed.logout();The App ID is public. Never put an API key or the identity verification secret in browser code. If
identity verification is enabled, create identityHash on your backend.
VAPID is not the Authorization key#
Takeed creates a VAPID key pair for Web Push automatically. The public VAPID key is intentionally sent to the Web SDK so the browser can create a push subscription for Takeed. It is safe to expose and cannot authorize REST or OTP requests. The private half stays in Takeed and signs Web Push requests.
For server-to-server calls, create a separate secret under Settings → OTP settings → API authorization and send
it as Authorization: Key <key>. The complete API key appears once after
creation; if it was not saved, create a new one. Do not use the VAPID key in this header.
Verify it#
Send to your browser from Test notifications, then open Notification log to see send,
delivery and click states. origin_not_allowed means the current HTTPS origin does not match the
app's allowed origins.