एक्सपो SDK बेसिक इंटीग्रेशन गाइड

इस सेक्शन में यह जानकारी दी गई है कि Pushwoosh Expo SDK को अपने एप्लिकेशन में कैसे इंटीग्रेट करें।

पूर्वापेक्षाएँ

Pushwoosh Expo SDK को अपने ऐप में इंटीग्रेट करने के लिए, आपको निम्नलिखित चीज़ों की आवश्यकता होगी:

आवश्यकताएँ

• एक Pushwoosh अकाउंट।
• आपके अकाउंट में सेटअप किया गया एक Pushwoosh प्रोजेक्ट।
• iOS इंटीग्रेशन के लिए:
  • पुश नोटिफिकेशन भेजने के लिए कॉन्फ़िगर किया गया एक iOS प्लेटफ़ॉर्म। हम सबसे सरल तरीके के रूप में टोकन-आधारित प्रमाणीकरण कॉन्फ़िगरेशन का उपयोग करने की सलाह देते हैं।
  • सिम्युलेटर पर पुश भेजने के लिए गेटवे को Sandbox पर सेट करें।
• एंड्रॉइड इंटीग्रेशन के लिए:
  • एक कॉन्फ़िगर किया गया एंड्रॉइड प्लेटफ़ॉर्म
  • आपके Firebase प्रोजेक्ट से project number (जिसे सेंडर आईडी भी कहा जाता है), google-services.json फ़ाइल और package name।
  • आपके एंड्रॉइड एप्लिकेशन से जुड़ा एक Firebase प्रोजेक्ट। यदि आवश्यक हो तो Firebase सेटअप गाइड का पालन करें।
• आपके एप्लिकेशन के लिए Pushwoosh कंट्रोल पैनल से आपका Pushwoosh Application Code और Pushwoosh Device API Token।

इंटीग्रेशन के चरण

1. प्लगइन इंस्टॉल करें

Expo CLI का उपयोग करके Pushwoosh Expo प्लगइन इंस्टॉल करें

expo install pushwoosh-expo-plugin

Pushwoosh React Native SDK इंस्टॉल करें

npm install pushwoosh-react-native-plugin --save

2. प्लगइन प्रॉपर्टीज़ सेट करें

आवश्यक प्रॉपर्टीज़ के साथ प्लगइन को प्लगइन ऐरे के सामने जोड़ें:

app.json/app.config.js

{
  "expo": {
    "plugins": [
      [
        "pushwoosh-expo-plugin",
        {
          "mode": "development",
          "ios": {
            "PW_API_TOKEN": "__YOUR_DEVICE_API_TOKEN__"
          },
          "android": {
            "apiToken": "__YOUR_DEVICE_API_TOKEN__"
          }
        }
      ]
    ]
  }
}

जहाँ:

• mode का उपयोग APNs एनवायरनमेंट एंटाइटलमेंट को कॉन्फ़िगर करने के लिए किया जाता है। “Development” या “production” मान उपलब्ध हैं।
• PW_API_TOKEN, apiToken आपका Pushwoosh Device API Token है।

3. Pushwoosh को इनिशियलाइज़ करें

आपके एप्लिकेशन के रूट कंपोनेंट में:

• pushwoosh-react-native-plugin प्लगइन को इम्पोर्ट करें।
• Pushwoosh SDK को इनिशियलाइज़ करें।
• पुश नोटिफिकेशन के लिए रजिस्टर करने के लिए अपनी इनिशियलाइज़ेशन लॉजिक में register() को कॉल करें।

index.tsx

import Pushwoosh from 'pushwoosh-react-native-plugin';

Pushwoosh.init({
    "pw_appid": "__YOUR_APP_ID__" ,
    "project_number": "__YOUR_FCM_SENDER_ID__"
});

Pushwoosh.register();

जहाँ:

• __YOUR_APP_ID__ Pushwoosh कंट्रोल पैनल से एप्लिकेशन कोड है।
• __YOUR_FCM_SENDER_ID__ Firebase कंसोल से Firebase प्रोजेक्ट नंबर है।

4. एंड्रॉइड नेटिव सेटअप

Firebase कॉन्फ़िगरेशन फ़ाइल जोड़ें:

1. अपनी google-services.json फ़ाइल को प्रोजेक्ट की रूट डायरेक्टरी में कॉपी करें।
2. googleServicesFile प्रॉपर्टी को अपनी google-services.json के पाथ पर सेट करें और package प्रॉपर्टी निर्दिष्ट करें:

app.json/app.config.js

  "expo": {
    "name": "sample",
  "android": {
    "package": "com.pushwoosh.sample",
    "googleServicesFile": "./google-services.json"
  },
  "plugins": [
    [
      "pushwoosh-expo-plugin",
      {
        "mode": "development",
        "ios": {
          "PW_API_TOKEN": "__YOUR_DEVICE_API_TOKEN__"
        },
        "android": {
          "apiToken": "__YOUR_DEVICE_API_TOKEN__"
        }
      }
    ]
  ]
}

5. iOS नेटिव सेटअप

bundleIdentifier प्रॉपर्टी को ios ऑब्जेक्ट पर सेट करें:

app.json/app.config.js

  "expo": {
    "name": "sample",
    "ios": {
      "bundleIdentifier": "com.pushwoosh.sample"
    },
    "plugins": [
    [
      "pushwoosh-expo-plugin",
      {
        "mode": "development",
        "ios": {
          "PW_API_TOKEN": "__YOUR_DEVICE_API_TOKEN__"
        },
        "android": {
          "apiToken": "__YOUR_DEVICE_API_TOKEN__"
        }
      }
    ]
  ]
}

6. ऐप को प्रीबिल्ड करें

प्रीबिल्ड चलाकर नेटिव कोड जेनरेट करें और प्रत्येक प्लेटफ़ॉर्म के लिए डिपेंडेंसी कॉन्फ़िगर करें:

npx expo prebuild

7. प्रोजेक्ट चलाएँ

1. प्रोजेक्ट को बिल्ड और रन करें:

Android

npx expo run:android

iOS

npx expo run:ios

2. Pushwoosh कंट्रोल पैनल पर जाएँ और एक पुश नोटिफिकेशन भेजें।
3. आपको ऐप में नोटिफिकेशन दिखना चाहिए।

विस्तारित इंटीग्रेशन

इस स्तर पर, आपने पहले ही SDK को इंटीग्रेट कर लिया है और पुश नोटिफिकेशन भेज और प्राप्त कर सकते हैं। अब, आइए मुख्य कार्यक्षमता का पता लगाएं

पुश नोटिफिकेशन इवेंट लिसनर्स

Pushwoosh SDK में दो इवेंट लिसनर हैं, जो पुश नोटिफिकेशन को संभालने के लिए डिज़ाइन किए गए हैं:

• onPushReceived इवेंट तब ट्रिगर होता है, जब कोई पुश नोटिफिकेशन प्राप्त होता है
• onPushAccepted इवेंट तब ट्रिगर होता है, जब कोई यूज़र नोटिफिकेशन खोलता है

आपको इन इवेंट लिसनर्स को एप्लिकेशन स्टार्टअप पर SDK के इनिशियलाइज़ेशन के ठीक बाद सेटअप करना चाहिए:

import { DeviceEventEmitter } from 'react-native';
import Pushwoosh from 'pushwoosh-react-native-plugin';

class PushwooshNotificationHandler {
  setupPushListeners(): void {

    DeviceEventEmitter.addListener("pushReceived", (e) => {
      console.warn("Push received: " + JSON.stringify(e));
    });

    DeviceEventEmitter.addListener("pushOpened", (e) => {
      console.warn("Push opened:" + JSON.stringify(e));
    });

  }
}

यूज़र कॉन्फ़िगरेशन

व्यक्तिगत यूज़र के व्यवहार और वरीयताओं पर ध्यान केंद्रित करके, आप व्यक्तिगत सामग्री प्रदान कर सकते हैं, जिससे यूज़र की संतुष्टि और वफादारी में वृद्धि होती है

import Pushwoosh from 'pushwoosh-react-native-plugin';

class Registration {
  afterUserLogin(user: User): void {

    // Set user ID
    Pushwoosh.setUserId(user.getId());

    // Set user email
    Pushwoosh.setEmails(user.getEmailList());

    // Setting additional user information as tags for Pushwoosh
    Pushwoosh.setTags({
      "age": user.getAge(),
      "name": user.getName(),
      "last_login": user.getLastLoginDate()
    });
  }
}

टैग्स

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

import Pushwoosh from 'pushwoosh-react-native-plugin';

class UpdateUser {
  afterUserUpdateProfile(user: User): void {

    // Set list of favorite categories
    Pushwoosh.setTags({
      "favorite_categories": user.getFavoriteCategoriesList()
    });

    // Set payment information
    Pushwoosh.setTags({
      "is_subscribed": user.isSubscribed(),
      "payment_status": user.getPaymentStatus(),
      "billing_address": user.getBillingAddress()
    });
  }
}

इवेंट्स

इवेंट्स ऐप के भीतर विशिष्ट यूज़र एक्शन या घटनाएँ होती हैं जिन्हें व्यवहार का विश्लेषण करने और संबंधित संदेशों या कार्यों को ट्रिगर करने के लिए ट्रैक किया जा सकता है

import Pushwoosh from 'pushwoosh-react-native-plugin';

class Registration {

  // Track login event
  afterUserLogin(user: User): void {
    Pushwoosh.postEvent("login", {
      "name": user.getName(),
      "last_login": user.getLastLoginDate()
    });
  }

  // Track purchase event
  afterUserPurchase(product: Product): void {
    Pushwoosh.postEvent("purchase", {
      "product_id": product.getId(),
      "product_name": product.getName(),
      "price": product.getPrice(),
      "quantity": product.getQuantity()
    });
  }
}

iOS के लिए मैसेज डिलीवरी ट्रैकिंग

आपको अपने प्रोजेक्ट में एक नोटिफिकेशन सर्विस एक्सटेंशन टारगेट जोड़ना होगा। यह सटीक डिलीवरी ट्रैकिंग और iOS पर रिच मीडिया जैसी सुविधाओं के लिए आवश्यक है।

एक्सटेंशन टारगेट और उसके भीतर आवश्यक Pushwoosh कोड जोड़ने के लिए नेटिव गाइड के चरणों का पालन करें।

अतिरिक्त प्लगइन प्रॉपर्टीज़

प्रॉपर्टी	डिफ़ॉल्ट	विवरण
iOS प्रॉपर्टीज़
Pushwoosh_LOG_LEVEL	INFO	iOS के लिए लॉग लेवल। संभावित मान: NONE, ERROR, WARN, INFO, DEBUG, NOISE
एंड्रॉइड प्रॉपर्टीज़
logLevel	INFO	एंड्रॉइड के लिए लॉग लेवल। इनमें से एक: NONE, ERROR, WARN, INFO, DEBUG, NOISE
multiNotificationMode	true	यदि आप यूज़र के लिए केवल अंतिम नोटिफिकेशन प्रदर्शित करना चाहते हैं तो इसे false में बदला जा सकता है
icon	-	एंड्रॉइड के लिए कस्टम नोटिफिकेशन आइकन का पाथ

समस्या निवारण

यदि आपको इंटीग्रेशन प्रक्रिया के दौरान कोई समस्या आती है, तो कृपया समर्थन और समुदाय सेक्शन देखें।

FCM रजिस्ट्रेशन त्रुटि: टोकन प्राप्त करने में विफल। क्या firebase सही ढंग से कॉन्फ़िगर किया गया है?

सुनिश्चित करें कि आपकी Firebase googleServicesFile प्रॉपर्टी एक्सपो कॉन्फ़िगरेशन फ़ाइल में सेटअप है और google-services.json फ़ाइल आपके प्रोजेक्ट की रूट डायरेक्टरी में जोड़ी गई है:

app.json/app.config.js

"expo": {
  "name": "sample",
  "android": {
    "package": "com.pushwoosh.sample",
    "googleServicesFile": "./google-services.json"
  },
  "plugins": [
    [
      "pushwoosh-expo-plugin",
      {
        "mode": "development",
        "ios": {
          "PW_API_TOKEN": "__YOUR_DEVICE_API_TOKEN__"
        },
        "android": {
          "apiToken": "__YOUR_DEVICE_API_TOKEN__"
        }
      }
    ]
  ]
}

TypeError: Cannot read property ‘init’ of null

डिवाइस पर ऐप चलाने का प्रयास करते समय आपको यह त्रुटि मिल सकती है।
इस समस्या को हल करने के लिए, सुनिश्चित करें कि आपने प्रीबिल्ड चरण पूरा कर लिया है। यह नेटिव कोड जेनरेट करता है और प्रत्येक प्लेटफ़ॉर्म के लिए डिपेंडेंसी कॉन्फ़िगर करता है।

npx expo prebuild