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

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

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

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

आवश्यकताएँ

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

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

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

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

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 डिवाइस API टोकन है।

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__ फायरबेस कंसोल से फायरबेस प्रोजेक्ट नंबर है।

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

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

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 रजिस्ट्रेशन त्रुटि: टोकन प्राप्त करने में विफल। क्या फायरबेस सही ढंग से कॉन्फ़िगर किया गया है?

सुनिश्चित करें कि आपकी फायरबेस 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