คู่มือการผสานการทำงานพื้นฐาน Cordova SDK

ส่วนนี้ประกอบด้วยข้อมูลเกี่ยวกับวิธีการผสานการทำงาน Pushwoosh Cordova SDK เข้ากับแอปพลิเคชันของคุณ

ในการผสานการทำงาน Pushwoosh Cordova SDK เข้ากับแอปของคุณ คุณจะต้องมีสิ่งต่อไปนี้:

เพิ่ม dependency ของ Pushwoosh Cordova SDK ไปยังโปรเจกต์ของคุณ:

cordova plugin add pushwoosh-cordova-plugin

ใน root component ของไฟล์ index.js ของคุณ:

• เริ่มต้นการทำงานของ Pushwoosh SDK
• เรียกใช้ registerDevice() ใน logic การเริ่มต้นของคุณเพื่อลงทะเบียนสำหรับ push notification

function onDeviceReady() {
    var pushwoosh = cordova.require("pushwoosh-cordova-plugin.PushNotification");

    pushwoosh.onDeviceReady({
        appid: "__YOUR_APP_ID__",
        projectid: "__YOUR_FCM_SENDER_ID__"
    });

    pushwoosh.registerDevice(
    function(status) {
        var pushToken = status.pushToken;
        // Handle successful registration
    },
    function(status) {
        // Handle registration error
  }
);

โดยที่:

• __YOUR_APP_ID__ คือ application code จาก Pushwoosh Control Panel
• __YOUR_FCM_SENDER_ID__ คือ project number ของ Firebase จาก Firebase Console

เพื่อเปิดใช้งาน Push Notifications ในโปรเจกต์ของคุณ คุณต้องเพิ่ม capabilities บางอย่าง

ในส่วน Signing & Capabilities ให้เพิ่ม capabilities ต่อไปนี้:

• Push Notifications
• Background Modes หลังจากเพิ่ม capability นี้แล้ว ให้ทำเครื่องหมายที่ช่องสำหรับ Remote notifications

หากคุณต้องการใช้ Time Sensitive Notifications (iOS 15+) ให้เพิ่ม capability Time Sensitive Notifications ด้วย

ในไฟล์ Runner/Info.plist ของคุณ ให้ตั้งค่าคีย์ __PUSHWOOSH_DEVICE_API_TOKEN__ เป็น Pushwoosh Device API Token ของคุณ:

<key>Pushwoosh_API_TOKEN</key>
<string>__PUSHWOOSH_DEVICE_API_TOKEN__</string>

คุณต้องเพิ่ม target Notification Service Extension ไปยังโปรเจกต์ของคุณ นี่เป็นสิ่งจำเป็นสำหรับการติดตามการส่งที่แม่นยำและฟีเจอร์ต่างๆ เช่น Rich Media บน iOS

ทำตาม ขั้นตอนในคู่มือ native เพื่อเพิ่ม extension target และโค้ด Pushwoosh ที่จำเป็นภายในนั้น

ตรวจสอบให้แน่ใจว่าได้เพิ่ม dependencies และ plugin ที่จำเป็นลงในสคริปต์ Gradle ของคุณแล้ว:

เพิ่ม Google Services Gradle plugin ไปยัง dependencies ใน build.gradle ระดับโปรเจกต์ของคุณ:

buildscript {
  dependencies {
    classpath 'com.google.gms:google-services:4.3.15'
  }
}

ใช้ plugin ในไฟล์ build.gradle ระดับแอปของคุณ:

apply plugin: 'com.google.gms.google-services'

วางไฟล์ google-services.json ลงในโฟลเดอร์ android/app ในไดเรกทอรีโปรเจกต์ของคุณ

ใน main/AndroidManifest.xml ของคุณ ให้เพิ่ม Pushwoosh Device API Token ภายในแท็ก <application>:

<meta-data android:name="com.pushwoosh.apitoken" android:value="__YOUR_DEVICE_API_TOKEN__" />

สำคัญ: ตรวจสอบให้แน่ใจว่าได้ให้สิทธิ์การเข้าถึงของโทเค็นกับแอปที่ถูกต้องใน Pushwoosh Control Panel ของคุณ เรียนรู้เพิ่มเติม

1. Build และรันโปรเจกต์
2. ไปที่ Pushwoosh Control Panel และ ส่ง push notification
3. คุณควรจะเห็น notification ในแอป

ณ จุดนี้ คุณได้ผสานการทำงาน SDK เรียบร้อยแล้วและสามารถส่งและรับ push notification ได้ ตอนนี้ เรามาดูฟังก์ชันการทำงานหลักกัน

ใน Pushwoosh SDK มี event listeners สองตัวที่ออกแบบมาเพื่อจัดการกับ push notification:

• event onPushReceived จะถูกเรียก (trigger) เมื่อได้รับ push notification
• event onPushAccepted จะถูกเรียก (trigger) เมื่อผู้ใช้เปิด notification

คุณควรตั้งค่า event listeners เหล่านี้ทันทีหลังจากการเริ่มต้น (initialization) ของ SDK ตอนที่แอปพลิเคชันเริ่มทำงาน:

class PushwooshNotificationHandler {
  setupPushListeners() {

    document.addEventListener('push-receive',
      function(event) {
        console.log("Push received: " + event.notification.message);
      }
    );

    document.addEventListener('push-notification',
      function(event) {
        console.log("Push accepted: " + event.notification.message);
      }
    );
  }
}

ด้วยการมุ่งเน้นไปที่พฤติกรรมและความชอบของผู้ใช้แต่ละราย คุณสามารถส่งมอบเนื้อหาที่ปรับให้เหมาะกับแต่ละบุคคล ซึ่งจะนำไปสู่ความพึงพอใจและความภักดีของผู้ใช้ที่เพิ่มขึ้น

class Registration {
  afterUserLogin(user) {

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

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

Tags คือคู่ key-value ที่กำหนดให้กับผู้ใช้หรืออุปกรณ์ ช่วยให้สามารถแบ่งกลุ่มตามคุณลักษณะต่างๆ เช่น ความชอบหรือพฤติกรรม เพื่อให้สามารถส่งข้อความแบบกำหนดเป้าหมายได้

class UpdateUser {
  afterUserUpdateProfile(user) {

    // 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()
    });
  }
}

Events คือการกระทำหรือเหตุการณ์ที่เกิดขึ้นโดยผู้ใช้ภายในแอป ซึ่งสามารถติดตามเพื่อวิเคราะห์พฤติกรรมและเรียก (trigger) ข้อความหรือการกระทำที่สอดคล้องกันได้

class Registration {

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

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

หากคุณพบปัญหาใดๆ ในระหว่างขั้นตอนการผสานการทำงาน โปรดดูที่ส่วน การสนับสนุนและชุมชน (support and community)