Web SDK

# .npmrc (in your project root)
@abrova:registry=https://center.abrova.ir/api/packages/abrova/npm/

npm install @abrova/push-web@^0.1.12

cp node_modules/@abrova/push-web/dist/index.umd.js public/abrova-push.umd.js

<script src="/abrova-push.umd.js"></script>

cp node_modules/@abrova/push-web/service-worker.js public/abrova-push-sw.js

import AbrovaPush from '@abrova/push-web';

const abrovaPush = new AbrovaPush({
  apiKey: 'ab_live_your_api_key',
});

abrovaPush.onMessage((message) => {
  // message.title, message.body, message.data
});

abrovaPush.onConnectionState((state) => {
  // 'connecting' | 'connected' | 'disconnected' | 'error'
});

abrovaPush.onRegistered((deviceId) => {
  // Device registered with the Abrova backend
});

// Register the device — this also requests notification permission.
// Once permission is granted, call register() on every page load to keep the
// device's subscription, app version and last-seen time current.
const deviceId = await abrovaPush.register({ userId: 'user_123' });

// Foreground messages
const unsub = abrovaPush.onMessage((message) => {
  // message.title, message.body
});

// Connection state changes
abrovaPush.onConnectionState((state) => {
  // 'connecting' | 'connected' | 'disconnected' | 'error'
});

// Notification clicked while the browser was in background
abrovaPush.onNotificationClick((message, action) => {
  if (message.deepLink) {
    window.location.href = message.deepLink;
  }
});

// Action button clicked on a notification
abrovaPush.onActionClicked((actionId, message) => {
  // actionId from the original push payload
});

// Errors
abrovaPush.onError((error) => {});
abrovaPush.onDetailedError((error) => {
  // error.code, error.message
});

// Reconnection attempts
abrovaPush.onReconnecting((state) => {
  // state.retryAttempt, state.nextRetryMs
});

// Network state changes
abrovaPush.onNetworkState((state) => {
  // state.isAvailable, state.networkType
});

// Tab visibility changes
abrovaPush.onAppState((state) => {
  // state.isVisible
});

// Clean up
unsub();

// Set user ID after login
await abrovaPush.setUserId('user_123');

// Clear user ID on logout — also detaches the user on the server,
// so this browser stops receiving the previous user's notifications
await abrovaPush.clearUserId();

// Register with user ID in one call
await abrovaPush.register({ userId: 'user_123' });

await abrovaPush.subscribeTopic('news');
await abrovaPush.subscribeTopic('promotions');

await abrovaPush.unsubscribeTopic('promotions');

abrovaPush.setBadgeCount(5);
abrovaPush.clearBadge();
const count = abrovaPush.getBadgeCount();

abrovaPush.inbox.onMessage((message) => render(message));
abrovaPush.inbox.onUnreadCountChange((count) => setBadge(count));

const { messages, unreadCount } = await abrovaPush.inbox.getMessages({ status: 'unread' });
await abrovaPush.inbox.markAsRead(messages[0].id);
await abrovaPush.inbox.markAllAsRead();

abrovaPush.setAnalyticsHandler((event, properties) => {
  analytics.track(`abrova_push_${event}`, properties);
});

// Disable if needed (e.g. for GDPR)
abrovaPush.disableAnalytics();

import { AbrovaPushLogLevel } from '@abrova/push-web';

abrovaPush.setLogLevel(AbrovaPushLogLevel.DEBUG);   // Development
abrovaPush.setLogLevel(AbrovaPushLogLevel.ERROR);   // Production

const connected = abrovaPush.isConnected();
const deviceId = abrovaPush.getDeviceId();
const network = abrovaPush.getNetworkState();
const appState = abrovaPush.getAppState();
const initialMessage = abrovaPush.getInitialMessage();

// Static checks
AbrovaPush.isSupported();
AbrovaPush.getPermissionStatus();

// Unregister the device
await abrovaPush.unregister();

const abrovaPush = new AbrovaPush({
  apiKey: 'ab_live_your_api_key',
  serviceWorkerPath: '/abrova-push-sw.js',
  autoRegisterServiceWorker: true,
  maxReconnectAttempts: 0,
  logLevel: AbrovaPushLogLevel.ERROR,
  appVersion: '2.0.0',
  autoRefresh: true,
});

import { SDK_VERSION } from '@abrova/push-web';

<!DOCTYPE html>
<html>
<head>
  <title>My App</title>
</head>
<body>
  <script src="/abrova-push.umd.js"></script>
  <script>
    const abrovaPush = new AbrovaPush.default({
      apiKey: 'ab_live_your_api_key',
    });

    abrovaPush.onMessage(function(message) {
      // message.title, message.body
    });

    abrovaPush.register().then(function(deviceId) {
      // Device registered
    });
  </script>
</body>
</html>