वेब पुश SDK 3.0

आवश्यक शर्तें

अपनी HTTPS वेबसाइट पर वेब पुश SDK के एकीकरण के साथ आगे बढ़ने के लिए, आपको निम्नलिखित करना चाहिए:

अपना Pushwoosh एप्लिकेशन कोड खोजें।
Chrome और Firefox: अपनी Firebase API कुंजी और प्रेषक आईडी खोजें। ऐसा करने के लिए, कृपया Chrome और Firefox कॉन्फ़िगरेशन गाइड के चरण 1-3 का पालन करें।
Safari: अपनी वेबसाइट पुश आईडी खोजें।
Pushwoosh वेब पुश SDK डाउनलोड करें।

एकीकरण

GitHub पर एकीकरण का नमूना

Pushwoosh वेब पुश SDK प्राप्त करें और इसे अनज़िप करें। आपके पास निम्नलिखित फाइलें होनी चाहिए:

pushwoosh-service-worker.js

इन सभी फाइलों को अपनी वेबसाइट डायरेक्टरी के टॉप-लेवल रूट में रखें।

SDK को इनिशियलाइज़ करें:

हमारे CDN से SDK को असिंक्रोनस रूप से शामिल करें।

<script type="text/javascript" src="//cdn.pushwoosh.com/webpush/v3/pushwoosh-web-notifications.js" async></script>

वेब पुश SDK को इनिशियलाइज़ करें और सुनिश्चित करें कि SDK पूरी तरह से लोड होने तक इनिशियलाइज़ेशन को कतार में रखें।

<script type="text/javascript">
var Pushwoosh = Pushwoosh || [];
Pushwoosh.push(['init', {
    logLevel: 'info', // संभावित मान: error, info, debug
    applicationCode: 'XXXXX-XXXXX', // Pushwoosh कंट्रोल पैनल से आपका एप्लिकेशन कोड
    apiToken: 'XXXXXXX', //  डिवाइस API टोकन
    safariWebsitePushID: 'web.com.example.domain', //  अद्वितीय रिवर्स-डोमेन स्ट्रिंग, जो आपके Apple डेवलपर पोर्टल में प्राप्त होती है। केवल तभी आवश्यक है जब आप Safari ब्राउज़र पर पुश सूचनाएं भेजते हैं
    defaultNotificationTitle: 'Pushwoosh', // पुश सूचनाओं के लिए एक डिफ़ॉल्ट शीर्षक सेट करता है
    defaultNotificationImage: 'https://yoursite.com/img/logo-medium.png', // कस्टम सूचना छवि का URL
    autoSubscribe: false, // या true। यदि true है, तो SDK इनिशियलाइज़ेशन पर उपयोगकर्ता को पुश के लिए सदस्यता लेने के लिए प्रेरित करता है
    subscribeWidget: {
      enable: true
    },
    userId: 'user_id', // वैकल्पिक, कस्टम उपयोगकर्ता आईडी सेट करें
    tags: {
        'Name': 'John Smith'     // वैकल्पिक, कस्टम टैग सेट करें
    }
}]);
</script>

वेब पॉपअप

अपनी साइट पर वेब पॉपअप अभियान सक्षम करने के लिए अपने init ऑब्जेक्ट में webPopups जोड़ें।

webPopups: {
  enable: true,
  autoShow: true, // वैकल्पिक, पॉपअप को स्वचालित रूप से प्रदर्शित किए बिना लोड करने के लिए false पर सेट करें — नीचे WebPopups विधियाँ देखें
  colorScheme: 'auto', // वैकल्पिक, 'auto' (डिफ़ॉल्ट) | 'light' | 'dark'
},

वेब पॉपअप अभियान आपके द्वारा कंट्रोल पैनल में कॉन्फ़िगर किए गए ओवरले प्रदर्शित करते हैं जैसे प्रोमो, घोषणाएं, या लीड कैप्चर फॉर्म। कस्टम सदस्यता पॉपअप (subscribePopup) के विपरीत, जो केवल वेब पुश ऑप्ट-इन को संभालता है, वेब पॉपअप अभियान आपके द्वारा कॉन्फ़िगर की गई कोई भी सामग्री प्रदर्शित कर सकते हैं। कंट्रोल पैनल में सेटअप के लिए, वेब पॉपअप को समझना देखें।

colorScheme यह चुनता है कि डार्क मोड के साथ कॉन्फ़िगर किया गया पॉपअप किस पैलेट के साथ रेंडर होगा:

'auto' (डिफ़ॉल्ट): विज़िटर के OS-स्तरीय कलर स्कीम (prefers-color-scheme) का पालन करता है।
'light' या 'dark': विज़िटर की OS सेटिंग के बावजूद, हमेशा उस पैलेट को रेंडर करता है।

संपादक में डार्क मोड के बिना कॉन्फ़िगर किया गया पॉपअप हमेशा लाइट रेंडर होता है — colorScheme का उस पर कोई प्रभाव नहीं पड़ता है।

प्रोग्रामेटिक नियंत्रण के लिए, WebPopups विधियाँ और वेब पॉपअप इवेंट्स देखें।

पुश सदस्यता बटन

अपने उपयोगकर्ताओं को पुश सूचनाओं के लिए सदस्यता लेने के लिए प्रेरित करने के लिए, हम आपकी वेबसाइट पर एक पुश सदस्यता बटन लागू करने की सलाह देते हैं। उपयोगकर्ता अनुभव को बढ़ाएं और अधिक ग्राहक प्राप्त करें!

कॉन्फ़िगरेशन

अपनी वेबसाइट में पुश सूचनाओं को लागू करना समाप्त करने के लिए, आपको हमारे चरण-दर-चरण गाइड का पालन करते हुए अपने Pushwoosh कंट्रोल पैनल में वेब प्लेटफॉर्म को कॉन्फ़िगर करना होगा:

एक अलग स्कोप में सर्विस वर्कर को पंजीकृत करना

कभी-कभी आप सर्विस वर्कर फ़ाइल को वेबसाइट की रूट डायरेक्टरी में नहीं, बल्कि एक सबडायरेक्टरी में रख सकते हैं।

इस मामले में, एक पैरामीटर जोड़कर कॉन्फ़िगरेशन (चरण 4.3) को संशोधित करें

serviceWorkerUrl: “/push-notifications/pushwoosh-service-worker.js”

जहां /push-notifications/pushwoosh-service-worker.js pushwoosh-service-worker.js फ़ाइल का पथ है।

इवेंट हैंडलर

Pushwoosh वेब SDK 3.0 में आप कुछ इवेंट्स को ट्रैक करने के लिए सब्सक्राइब कर सकते हैं**,** या यदि आपको अब उन्हें ट्रैक करने की आवश्यकता नहीं है तो इवेंट्स से अनसब्सक्राइब कर सकते हैं।

वेब SDK 3.0 लोड को ट्रैक करने के लिए, onLoad इवेंट को इस प्रकार फायर करें:

// Load Event
Pushwoosh.push(['onLoad', (api) => {
  console.log('Pushwoosh load!');
}]);

सही वेब SDK इनिशियलाइज़ेशन को ट्रैक करने के लिए, onReady इवेंट को फायर करें:

// Ready Event
Pushwoosh.push((api) => {
  console.log('Pushwoosh ready!');
});

किसी भी SDK इवेंट से सब्सक्राइब या अनसब्सक्राइब करने के लिए, SDK लोड होने के बाद हैंडलर्स का उपयोग करें:

Pushwoosh.push(['onLoad', (api) => {
  function onEventNameHandler() {
    console.log('Triggered event: event-name!');
  }

  // To subscribe to an event:
  Pushwoosh.addEventHandler('event-name', onEventNameHandler)

  // To unsubscribe from an event:
  Pushwoosh.removeEventHandler('event-name', onEventNameHandler)
}]);

SDK इवेंट्स

सब्सक्राइब इवेंट

एक उपयोगकर्ता द्वारा पुश सूचनाएं प्राप्त करने के लिए सहमत होने के बाद निष्पादित होता है।

Pushwoosh.push(['onLoad', (api) => {
  Pushwoosh.addEventHandler('subscribe', (payload) => {
    console.log('Triggered event: subscribe');
  });
}]);

अनसब्सक्राइब इवेंट

एक डिवाइस को सूचनाओं से अपंजीकृत करने के बाद निष्पादित होता है।

Pushwoosh.push(['onLoad', (api) => {
  Pushwoosh.addEventHandler('unsubscribe', (payload) => {
    console.log('Triggered event: unsubscribe');
  });
}]);

सदस्यता विजेट इवेंट्स

एक सदस्यता प्रॉम्प्ट विजेट के प्रदर्शन को ट्रैक करें।

Pushwoosh.push(['onLoad', (api) => {
  // Executed on displaying of the Subscription Prompt widget
  Pushwoosh.addEventHandler('show-subscription-widget', (payload) => {
    console.log('Triggered event: show-subscription-widget');
  });

  // Executed on hiding of the Subscription Prompt widget
  Pushwoosh.addEventHandler('hide-subscription-widget', (payload) => {
    console.log('Triggered event: hide-subscription-widget');
  });
}]);

सूचना अनुमति संवाद इवेंट्स

देशी सदस्यता संवाद के प्रदर्शन को ट्रैक करें।

Pushwoosh.push(['onLoad', function (api) {
  // Executed on permission dialog displaying
  Pushwoosh.addEventHandler('show-notification-permission-dialog', (payload) => {
    console.log('Triggered event: show-notification-permission-dialog');
  });

  // Executed on hiding the permission dialog with one of three possible statuses:
  // 1. default - the dialog is closed
  // 2. granted - permission is granted
  // 3. denied - permission is denied
  Pushwoosh.addEventHandler('hide-notification-permission-dialog', (payload) => {
    console.log('Triggered event: hide-notification-permission-dialog', payload.permission);
  });
}]);

अनुमति इवेंट्स

SDK इनिशियलाइज़ेशन पर पुश सूचनाओं की अनुमति की स्थिति की जाँच करें; जब भी यह स्थिति अपडेट होती है तो उसे ट्रैक करें।

Pushwoosh.push(['onLoad', (api) => {
  // Executed during the SDK initialization if 'autoSubscribe: false' or/and if a user ignores a push notification prompt.
  Pushwoosh.addEventHandler('permission-default', (payload) => {
    console.log('Triggered event: permission-default');
  });

  // Executed during the SDK initialization if notifications are blocked or once a user blocks push notifications.
  Pushwoosh.addEventHandler('permission-denied', (payload) => {
    console.log('Triggered event: permission-denied');
  });

  // Executed during the SDK initialization if notifications are allowed or once a user allows push notifications.
  Pushwoosh.addEventHandler('permission-granted', (payload) => {
    console.log('Triggered event: permission-granted');
  });
}]);

पुश प्राप्त इवेंट

एक डिवाइस पर पुश डिलीवरी को ट्रैक करें।

Pushwoosh.push(['onLoad', (api) => {
  // Executed when a push notification is displayed.
  Pushwoosh.addEventHandler('receive-push', (payload) => {
    console.log('Triggered event: receive-push', payload.notification);
  });
}]);

सूचना इवेंट्स

ट्रैक करें कि क्या एक पुश सूचना उपयोगकर्ता द्वारा खोली या बंद की गई है।

Pushwoosh.push(['onLoad', (api) => {
  // Executed when a user clicks on notification.
  Pushwoosh.addEventHandler('open-notification', (payload) => {
    console.log('Triggered event: open-notification', payload.notification);
  });

  // Executed when a user closes a push notification.
  Pushwoosh.addEventHandler('hide-notification', (payload) => {
    console.log('Triggered event: hide-notification', payload.notification);
  });
}]);

इनबॉक्स इवेंट्स

इनबॉक्स में भेजे गए सूचनाओं को ट्रैक करें।

Pushwoosh.push(['onLoad', (api) => {
  // Executed by ServiceWorker after the Inbox Message is received and saved to indexedDB.
  Pushwoosh.addEventHandler('receive-inbox-message', (payload) => {
    console.log('Triggered event: receive-inbox-message', payload.message);
  });

  // Executed after the Inbox is updated automatically while the page is loading.
  Pushwoosh.addEventHandler('update-inbox-messages', (payload) => {
    console.log('Triggered event: receive-inbox-message', payload.messages);
  });
}]);

कस्टम सदस्यता पॉपअप इवेंट्स

कस्टम सदस्यता पॉपअप इवेंट्स को संभालने के बारे में विवरण के लिए, कृपया कस्टम सदस्यता पॉपअप इवेंट्स गाइड देखें।

वेब पॉपअप इवेंट्स

Pushwoosh.push(['onLoad', (api) => {
  // Executed once web popups have loaded and the automatic display pipeline has run for the current page
  Pushwoosh.addEventHandler('web-popups-ready', () => {
    console.log('Triggered event: web-popups-ready');
  });

  // Executed when a web popup is shown, automatically or via webPopups.show()
  Pushwoosh.addEventHandler('show-web-popup', (payload) => {
    console.log('Triggered event: show-web-popup', payload.code, payload.trigger); // trigger: 'auto' | 'api'
  });

  // Executed when a web popup is hidden
  Pushwoosh.addEventHandler('hide-web-popup', (payload) => {
    console.log('Triggered event: hide-web-popup', payload.code, payload.reason); // reason: 'user' | 'api' | 'preempted'
  });
}]);

API

वेब पुश SDK के इनिशियलाइज़ होने के बाद, आप Pushwoosh API पर निम्नलिखित कॉल कर सकते हैं। सभी विधियाँ Promise ऑब्जेक्ट लौटाती हैं।

Pushwoosh.push((api) => {
  // एक उपयोगकर्ता के लिए टैग सेट करें
  api.setTags({
    'Tag Name 1': 'value1',
    'Tag Name 2': 'value2'
  });

  // सर्वर से एक उपयोगकर्ता के लिए टैग प्राप्त करें
  api.getTags();

  // उपयोगकर्ता आईडी पंजीकृत करें
  api.registerUser('user123');

    // उपयोगकर्ता ईमेल पंजीकृत करें
  api.registerEmail('user@example.com');

  // SMS नंबर पंजीकृत करें
  api.registerSmsNumber('+15551234567');

  // WhatsApp नंबर पंजीकृत करें
  api.registerWhatsappNumber('+1234567890');

  // एक इवेंट पोस्ट करें
  api.postEvent('myEventName', {attributeName: 'attributeValue'});

  //सूचनाओं से अपंजीकृत करें
  api.unregisterDevice();

  // डिवाइस की भाषा सेट करें ("भाषा" टैग में मान को ओवरराइड करता है)
  api.setLanguage('es');

  // वैकल्पिक रूप से उपयोगकर्ता को डिवाइस और चैनलों के साथ बहु-पंजीकृत करें
  api.multiRegisterDevice({
    user_id: 'user123',
    email: 'user@example.com',
    sms_phone_number: '+1234567890',
    tags: {
      'UserType': { operation: TTagOperationSet, value: 'Premium' },
      'Interests': { operation: TTagOperationAppend, values: ['sports', 'technology'] }
    }
  });
});

multiRegisterDevice

उन्नत पंजीकरण विधि जो एक ही API कॉल में कई डिवाइस और मैसेजिंग चैनलों के साथ एक उपयोगकर्ता प्रोफ़ाइल को पंजीकृत करने की अनुमति देती है। यह विधि विशेष रूप से क्रॉस-प्लेटफ़ॉर्म अनुप्रयोगों के लिए या ओमनीचैनल मैसेजिंग रणनीतियों को लागू करते समय उपयोगी है।

Pushwoosh.push((api) => {
  api.multiRegisterDevice({
    user_id: 'user123',              // Optional: User identifier
    email: 'user@example.com',       // Optional: Email for email messaging
    sms_phone_number: '+1234567890', // Optional: SMS phone number (E.164 format)
    whatsapp_phone_number: '+1234567890', // Optional: WhatsApp number (E.164 format)
    kakao_phone_number: '+1234567890',    // Optional: KakaoTalk number (E.164 format)
    language: 'en',                  // Optional: Language code (ISO 639-1)
    timezone: 'America/New_York',    // Optional: Timezone identifier
    city: 'New York',               // Optional: City for targeting
    country: 'US',                  // Optional: Country for targeting
    state: 'NY',                    // Optional: State for targeting
    tags: {                         // Optional: Tag values with operations
      'UserType': {
        operation: TTagOperationSet,     // Set tag value (0)
        value: 'Premium'
      },
      'Interests': {
        operation: TTagOperationAppend,  // Append to tag value (1)
        values: ['sports', 'technology']
      },
      'LoginCount': {
        operation: TTagOperationIncrement, // Increment tag value (3)
        value: '1'
      }
    },
    push_devices: [                 // Optional: Array of push devices
      {
        hwid: 'web-device-456',
        platform: TPlatformChrome, // Chrome platform (11)
        push_token: 'fcm-token-here',
        app_version: '2.1.0',
        platformData: {
          public_key: 'web-push-public-key',
          auth_token: 'web-push-auth-token',
          browser: 'chrome'
        }
      }
    ]
  })
  .then((response) => {
    console.log('Multi-registration successful:', response);
  })
  .catch((error) => {
    console.error('Multi-registration failed:', error);
  });
});

प्लेटफ़ॉर्म प्रकार:

TPlatformSafari (10): Safari प्लेटफ़ॉर्म
TPlatformChrome (11): Chrome प्लेटफ़ॉर्म
TPlatformFirefox (12): Firefox प्लेटफ़ॉर्म

टैग ऑपरेशन प्रकार:

TTagOperationSet (0): टैग मान सेट करें (मौजूदा मान को बदलें)
TTagOperationAppend (1): टैग मान में जोड़ें (सूची में जोड़ें)
TTagOperationRemove (2): टैग मान हटाएं (सूची से हटाएं)
TTagOperationIncrement (3): टैग मान बढ़ाएं (संख्यात्मक वृद्धि)

लाभ:

एकल API कॉल: एक साथ कई डिवाइस और चैनल पंजीकृत करें
परमाणु ऑपरेशन: सभी पंजीकरण एक साथ सफल या विफल होते हैं
उपयोगकर्ता-केंद्रित: सभी डिवाइस को एक ही उपयोगकर्ता प्रोफ़ाइल से जोड़ता है
उन्नत टैगिंग: जटिल टैग संचालन का समर्थन करता है
क्रॉस-प्लेटफ़ॉर्म: एक साथ कई प्लेटफ़ॉर्म संभालें

Pushwoosh को टैग भेजने का उदाहरण:

Pushwoosh.push((api) => {
  var myCustomTags = {
    'Tag 1': 123,
    'Tag 2': 'some string'
  };
  api.setTags(myCustomTags)
    .then((res) => {
      var skipped = res && res.skipped || [];
      if (!skipped.length) {
        console.log('success');
      }
      else {
        console.warn('skipped tags:', skipped);
      }
    })
    .catch((err) => {
      console.error('setTags error:', err);
    });
});

टैग मान बढ़ाएँ

एक नंबर टैग के मान को बढ़ाने के लिए, operation पैरामीटर का उपयोग ‘increment’ मान के साथ इस प्रकार करें:

Pushwoosh.push((api) => {
  api.setTags({
    'Tag 1': {
      operation: 'increment',
      value: 1
    }
  })
});

टैग मान जोड़ें

मौजूदा सूची टैग में नए मान जोड़ने के लिए, operation पैरामीटर का उपयोग ‘append’ मान के साथ इस प्रकार करें:

Pushwoosh.push((api) => {
  api.setTags({
    'Tag 3': {
      operation: 'append',
      value: ['Value3']
    }
  })
});

टैग मान हटाएं

एक सूची टैग से एक मान हटाने के लिए, operation पैरामीटर का उपयोग ‘remove’ मान के साथ इस प्रकार करें:

Pushwoosh.push((api) =>{
  api.setTags({
    'Tag 3': {
      operation: 'remove',
      value: ['Value2']
    }
  })
});

सार्वजनिक विधियाँ

Pushwoosh.subscribe()

इस विधि का उपयोग उपयोगकर्ता से पुश सूचनाओं के लिए अनुमति का अनुरोध करने के लिए किया जाता है। यदि कोई उपयोगकर्ता पहले से ही सब्सक्राइब है, तो विधि निष्पादित होना बंद कर देगी।

यदि किसी उपयोगकर्ता ने अभी तक पुश के लिए सब्सक्राइब नहीं किया है:

1. पुश सूचनाओं के लिए अनुमति का अनुरोध किया जाता है।

2. यदि कोई उपयोगकर्ता सूचनाओं की अनुमति देता है, तो onSubscribe इवेंट ट्रिगर होता है।

Pushwoosh.subscribe() स्वचालित रूप से निष्पादित होता है यदि SDK इनिशियलाइज़ेशन के दौरान autoSubscribe: true सेट किया गया है।

इस विधि को कॉल करें यदि आपने इनिशियलाइज़ेशन के दौरान autoSubscribe: false पैरामीटर का उपयोग करके उपयोगकर्ता को पुश के लिए मैन्युअल रूप से सब्सक्राइब करने के लिए प्रेरित करने का विकल्प चुना है:

<button onclick="Pushwoosh.subscribe()">Subscribe</button>
<script>
  Pushwoosh.push(['onSubscribe', (api) => {
    console.log('User successfully subscribed');
  }]);
</script>

Pushwoosh.unsubscribe()

/unregisterDevice विधि निष्पादित होती है।
onUnsubscribe इवेंट ट्रिगर होता है।

<button onclick="Pushwoosh.unsubscribe()">Unsubscribe</button>
<script type="text/javascript">
  Pushwoosh.push(['onUnsubscribe', (api) => {
    console.log('User successfully unsubscribed');
  }]);
</script>

Pushwoosh.isSubscribed()

जांचता है कि क्या कोई उपयोगकर्ता सब्सक्राइब है और true/false फ्लैग लौटाता है।

Pushwoosh.isSubscribed().then((isSubscribed) => {
  console.log('isSubscribed', isSubscribed);
});

Pushwoosh.getHWID()

Pushwoosh HWID लौटाता है।

Pushwoosh.getHWID().then((hwid) => {
  console.log('hwid:', hwid);
});

Pushwoosh.getPushToken()

यदि उपलब्ध हो तो पुश टोकन लौटाता है।

Pushwoosh.getPushToken().then((pushToken) => {
  console.log('pushToken:', pushToken);
});

Pushwoosh.getUserId()

यदि उपलब्ध हो तो उपयोगकर्ता आईडी लौटाता है।

Pushwoosh.getUserId().then((userId) => {
  console.log('userId:', userId);
});

Pushwoosh.getParams()

निम्नलिखित मापदंडों की एक सूची लौटाता है:

Pushwoosh.getParams().then((params) => {
  params = params || {};
  var hwid = params.hwid;
  var pushToken = params.pushToken;
  var userId = params.userId;
});

Pushwoosh.isAvailableNotifications()

जांचता है कि क्या कोई ब्राउज़र Pushwoosh WebSDK 3.0 का समर्थन करता है, ‘true’ या ‘false’ लौटाता है।

Pushwoosh.isAvailableNotifications() // true/false

InboxMessages विधियाँ

messagesWithNoActionPerformedCount(): Promise<number>

खोले गए संदेशों की संख्या लौटाता है।

Pushwoosh.pwinbox.messagesWithNoActionPerformedCount()
  .then((count) => {
    console.log(`${count} messages opened`);
  });

unreadMessagesCount()

अपठित संदेशों की संख्या लौटाता है।

Pushwoosh.pwinbox.unreadMessagesCount()
  .then((count) => {
    console.log(`${count} messages unread`);
  });

messagesCount(): Promise<number>

संदेशों की कुल संख्या लौटाता है।

Pushwoosh.pwinbox.messagesCount()
  .then((count) => {
    console.log(`${count} messages`);
  });

loadMessages(): Promise<Array>

न हटाए गए संदेशों की सूची लोड करता है।

Pushwoosh.pwinbox.loadMessages()
  .then(() => {
    console.log('Messages have been loaded');
  });

readMessagesWithCodes(codes: Array<string>): Promise<void>

Inbox_Ids द्वारा संदेशों को पढ़े गए के रूप में चिह्नित करता है।

Pushwoosh.pwinbox.readMessagesWithCodes(codes)
  .then(() => {
    console.log('Messages have been read');
  });

performActionForMessageWithCode(code: string): Promise<void>

एक संदेश को सौंपे गए कार्य को करता है और संदेश को पढ़े गए के रूप में चिह्नित करता है।

Pushwoosh.pwinbox.performActionForMessageWithCode(code)
  .then(() => {
    console.log('Action has been performed');
  });

deleteMessagesWithCodes(codes: Array<string>): Promise<void>

संदेशों को हटाए गए के रूप में चिह्नित करता है।

Pushwoosh.pwinbox.deleteMessagesWithCodes([code])
  .then(() => {
    console.log('Messages have been deleted');
  });

syncMessages(): Promise<void>

सर्वर के साथ संदेशों को सिंक्रनाइज़ करता है।

Pushwoosh.pwinbox.syncMessages()
  .then(() => {
    console.log('Messages have been synchronized');
  });

WebPopups विधियाँ

प्रोग्रामेटिक वेब पॉपअप API के लिए init ऑब्जेक्ट में webPopups: {enable: true} की आवश्यकता होती है; यह web-popups-ready इवेंट के फायर होने के बाद Pushwoosh.moduleRegistry.webPopups के माध्यम से उपलब्ध है।

show(code: string): Promise<boolean>

एक पॉपअप को तुरंत दिखाता है, सभी प्रदर्शन शर्तों (देरी, पृष्ठ नियम, डिवाइस/आगंतुक प्रकार, आवृत्ति कैपिंग, ट्रिगर प्रकार) को दरकिनार करते हुए। जगह बनाने के लिए पहले से दिखाई दे रहे पॉपअप को बंद कर देता है। जब पॉपअप नहीं दिखाया जा सकता है तो अस्वीकार करने के बजाय false हल करता है।

Pushwoosh.moduleRegistry.webPopups.show('popup_code')
  .then((shown) => console.log('Popup shown:', shown));

hide(code?: string): boolean

दिखाई देने वाले पॉपअप को छिपाता है। यदि code पास किया जाता है, तो यह केवल तभी छिपाता है जब यह दिखाई देने वाले पॉपअप से मेल खाता हो। यदि कुछ भी नहीं छिपाया गया था तो false लौटाता है।

Pushwoosh.moduleRegistry.webPopups.hide();

hideAll(): boolean

दिखाई देने वाले पॉपअप को छिपाता है और वर्तमान पृष्ठ लोड के लिए अभी भी लंबित सब कुछ खारिज कर देता है। show() बाद में काम करता रहता है।

Pushwoosh.moduleRegistry.webPopups.hideAll();

isVisible(code?: string): boolean

जांचता है कि क्या कोई पॉपअप वर्तमान में दिखाई दे रहा है। code के बिना, जांचता है कि क्या कोई पॉपअप दिखाई दे रहा है।

Pushwoosh.moduleRegistry.webPopups.isVisible('popup_code');

getVisibleCode(): string | null

वर्तमान में स्क्रीन पर पॉपअप का कोड लौटाता है, या यदि कोई दिखाई नहीं दे रहा है तो null।

Pushwoosh.moduleRegistry.webPopups.getVisibleCode();

getAvailableCodes(): Array<string>

इस डिवाइस के लिए सर्वर द्वारा लौटाए गए प्रत्येक पॉपअप के कोड लौटाता है।

Pushwoosh.moduleRegistry.webPopups.getAvailableCodes();

getState(): object

वेब पॉपअप की स्थिति का एक स्नैपशॉट लौटाता है: visible (स्क्रीन पर कोड, या null), queued (डिस्प्ले स्लॉट की प्रतीक्षा कर रहे कोड), waiting (एक सशस्त्र विलंब टाइमर के साथ कोड), और available (सर्वर द्वारा लौटाया गया प्रत्येक कोड)।

Pushwoosh.moduleRegistry.webPopups.getState();

प्रोग्रेसिव वेब ऐप समर्थन

Pushwoosh को अपने प्रोग्रेसिव वेब एप्लिकेशन (PWA) में एकीकृत करने के लिए, नीचे वर्णित चरणों का पालन करें।

1. अपनी सर्विस वर्कर फ़ाइल का पथ कॉपी करें:

if ('serviceWorker' in navigator) {
  window.addEventListener('load', () => {
    navigator.serviceWorker.register('/service-worker.js') // <- your service worker url
  });
}

फिर, WebSDK को इनिशियलाइज़ करते समय serviceWorkerUrl पैरामीटर का उपयोग इस प्रकार करें:

var Pushwoosh = Pushwoosh || [];
Pushwoosh.push(['init', {
  logLevel: 'error',
  applicationCode: 'XXXXX-XXXXX',
  safariWebsitePushID: 'web.com.example.domain',
  defaultNotificationTitle: 'Pushwoosh',
  defaultNotificationImage: 'https://yoursite.com/img/logo-medium.png',
  serviceWorkerUrl: '/service-worker.js', // <- your service worker url
}]);

WebSDK नए सर्विस वर्कर को तुरंत पंजीकृत नहीं करता है; एक सर्विस वर्कर तब पंजीकृत होता है जब इसकी आवश्यकता होती है:

जब कोई डिवाइस एक पुश टोकन प्राप्त करता है (डिवाइस पंजीकरण या पुनः सदस्यता पर),
जब एक पुश टोकन हटा दिया जाता है (उपयोगकर्ता आधार से एक डिवाइस को हटाने पर)।

यह सर्वर अनुरोधों की संख्या को कम करके आपके पृष्ठों की लोडिंग को तेज करता है।

ब्राउज़र एक ही समय में दो अलग-अलग सर्विस वर्करों को पंजीकृत करने की अनुमति नहीं देते हैं (और पढ़ें: https://github.com/w3c/ServiceWorker/issues/921), इसलिए आपके PWA को सही ढंग से काम करने के लिए, आपके कोडबेस और Pushwoosh कोडबेस के लिए एक सामान्य सर्विस वर्कर पंजीकृत होना चाहिए।

2. अपने सर्विस वर्कर में निम्नलिखित स्ट्रिंग जोड़ें (शुरुआत में या अंत में, इससे कोई फर्क नहीं पड़ता):

importScripts('https://cdn.pushwoosh.com/webpush/v3/pushwoosh-service-worker.js' + self.location.search);

इस प्रकार आप अपने सर्विस वर्कर के लिए Pushwoosh सेवाओं के माध्यम से भेजी गई पुश सूचनाओं को प्राप्त करने और संसाधित करने में सक्षम बनाते हैं।

गूगल टैग मैनेजर से इंस्टॉल करना

Pushwoosh SDK को इनिशियलाइज़ करने के लिए अपने गूगल टैग मैनेजर में निम्नलिखित कोड का उपयोग करें। एक कस्टम HTML टैग बनाएं और नीचे दिए गए कोड को पेस्ट करें। अपने Pushwoosh एप्लिकेशन कोड, Safari वेबसाइट आईडी, और डिफ़ॉल्ट सूचना छवि URL को बदलना सुनिश्चित करें।
साथ ही उच्च टैग फायरिंग प्राथमिकता (उदा: 100) सेट करें और इसे सभी पृष्ठों पर ट्रिगर करें। स्क्रीनशॉट के लिए नीचे देखें। कॉपी करें

<script type="text/javascript" src="//cdn.pushwoosh.com/webpush/v3/pushwoosh-web-notifications.js" async></script>
<script type="text/javascript">
  var Pushwoosh = Pushwoosh || [];
  Pushwoosh.push(['init', {
    logLevel: 'error',
    applicationCode: 'XXXXX-XXXXX',
    safariWebsitePushID: 'web.com.example.domain',
    defaultNotificationTitle: 'Pushwoosh',
    defaultNotificationImage: 'https://yoursite.com/img/logo-medium.png',
    autoSubscribe: true,
    subscribeWidget: {
      enable: false
    },
    userId: 'user_id'
  }]);
</script>