Push Notification এবং Background Services

Mobile App Development - আয়নিক (Ionic)
341

Push Notifications এবং Background Services হল আধুনিক মোবাইল অ্যাপ্লিকেশনের দুটি গুরুত্বপূর্ণ ফিচার যা ব্যবহারকারীদের সাথে অ্যাপের ইন্টারঅ্যাকশন উন্নত করতে সাহায্য করে। Push Notifications ব্যবহারকারীদের কাছে অ্যাপের বিজ্ঞপ্তি পৌঁছানোর একটি উপায়, এবং Background Services অ্যাপের পিছনে চলতে থাকা কাজগুলিকে চালানোর জন্য ব্যবহৃত হয়, যেমন ডেটা সিঙ্ক্রোনাইজেশন, ফেচিং, এবং ব্যাকগ্রাউন্ডে কাজ চালানো।

এখানে Push Notification এবং Background Services এর জন্য Ionic অ্যাপে কীভাবে কাজ করা যায় তা বিস্তারিতভাবে আলোচনা করা হলো।


১. Push Notification in Ionic

Push Notification হল এমন একটি প্রযুক্তি যা অ্যাপ্লিকেশনগুলোকে ব্যবহারকারীদের কাছে বিজ্ঞপ্তি পাঠাতে সক্ষম করে। Ionic এ Push Notifications পাঠানোর জন্য সাধারণত Firebase Cloud Messaging (FCM) ব্যবহার করা হয়।

১.১ Push Notification Setup with Firebase

Firebase হল গুগলের একটি প্ল্যাটফর্ম যা মোবাইল অ্যাপ্লিকেশনগুলির জন্য বিভিন্ন ফিচার, যেমন authentication, cloud storage, এবং push notifications প্রদান করে। Ionic অ্যাপের মধ্যে Firebase Push Notification সেটআপ করতে নিম্নলিখিত ধাপগুলি অনুসরণ করতে হবে:

১.১.১ Firebase Project তৈরি করা
  1. Firebase Console-এ গিয়ে একটি নতুন প্রজেক্ট তৈরি করুন: Firebase Console.
  2. প্রজেক্ট তৈরি হওয়ার পর, Cloud Messaging ট্যাব থেকে Server Key এবং Sender ID নিন, যেগুলি আপনাকে অ্যাপের মধ্যে ব্যবহার করতে হবে।
১.১.২ Ionic অ্যাপে Firebase ইনস্টল করা
  1. Firebase এবং Push Notification সেটআপ করতে প্রথমে Ionic প্রকল্পে প্রয়োজনীয় প্যাকেজগুলো ইনস্টল করুন:
npm install @capacitor/push-notifications
npm install @ionic-native/push
npm install @capacitor/firebase
  1. Firebase সেটআপ করার জন্য Capacitor Firebase Plugin ইনস্টল করুন:
npm install @capacitor-community/firebase
১.১.৩ Push Notification Configuration
  1. Push Notification Setup: Firebase এর Server Key এবং Sender ID অ্যাপের মধ্যে কনফিগার করতে হবে। এই কনফিগারেশনগুলি সাধারণত app.module.ts বা অন্য কনফিগারেশন ফাইলে যোগ করা হয়।
import { PushNotifications } from '@capacitor/push-notifications';

initializePushNotifications() {
  PushNotifications.requestPermission().then((result) => {
    if (result.granted) {
      PushNotifications.register();
    } else {
      console.log('Push notification permission denied');
    }
  });

  PushNotifications.addListener('registration', (token) => {
    console.log('Push registration success, token:', token.value);
  });

  PushNotifications.addListener('pushNotificationReceived', (notification) => {
    console.log('Push notification received: ', notification);
  });
}

এখানে, PushNotifications.register() ফাংশনটি Push Notification রেজিস্টার করার জন্য ব্যবহৃত হচ্ছে এবং registration ইভেন্টে আপনার device এর registration token পাওয়া যায়। এই টোকেনটি Firebase server এ পাঠানো হয়, যাতে notification পাঠানো যেতে পারে।

১.১.৪ Sending Push Notifications

Push Notification পাঠানোর জন্য Firebase Console অথবা আপনার সার্ভার থেকে Firebase API ব্যবহার করা যাবে। Firebase API এর মাধ্যমে Notification পাঠানো হয়:

curl -X POST --header "Authorization: key=YOUR_SERVER_KEY" \
  --Header "Content-Type: application/json" \
  https://fcm.googleapis.com/fcm/send \
  -d '{
    "to": "USER_DEVICE_REGISTRATION_TOKEN",
    "notification": {
      "title": "Hello",
      "body": "You have a new message",
      "sound": "default"
    }
  }'

২. Background Services in Ionic

Background Services হল অ্যাপের এমন কার্যাবলী যা মূল অ্যাপ্লিকেশনটির UI থেকে আলাদা হয়ে ব্যাকগ্রাউন্ডে চলে। সাধারণত ডেটা সিঙ্ক্রোনাইজেশন, ব্যাকগ্রাউন্ড ফেচিং বা অন্য গুরুত্বপূর্ণ টাস্ক ব্যাকগ্রাউন্ডে চলতে থাকে। Ionic অ্যাপে background services তৈরি করতে Capacitor Background Task Plugin বা Cordova Background Service Plugin ব্যবহার করা হয়।

২.১ Capacitor Background Task Plugin Setup

Ionic অ্যাপে ব্যাকগ্রাউন্ড সার্ভিস তৈরি করার জন্য প্রথমে Capacitor Background Task Plugin ইনস্টল করতে হবে:

npm install @capacitor/background-task

এখন, অ্যাপের মধ্যে ব্যাকগ্রাউন্ড টাস্কের জন্য কোড লিখতে হবে:

২.১.১ Background Task Setup
import { Plugins } from '@capacitor/core';
const { BackgroundTask } = Plugins;

async function runBackgroundTask() {
  const taskId = BackgroundTask.beforeExit(async () => {
    console.log('Running background task');
    // Perform any background task here, e.g. data sync
    setTimeout(() => {
      BackgroundTask.finish({
        taskId,
      });
    }, 3000);  // Simulate a background task that takes 3 seconds
  });
}

এখানে, BackgroundTask.beforeExit() ফাংশনটি ব্যাকগ্রাউন্ড টাস্ক শুরু করার জন্য ব্যবহৃত হচ্ছে এবং BackgroundTask.finish() ফাংশনটি ব্যাকগ্রাউন্ড টাস্ক সম্পন্ন হওয়ার পর কল করা হয়।

২.১.২ Background Task Use Case

ধরা যাক আপনি একটি অ্যাপ তৈরি করছেন যেখানে ব্যবহারকারীর ডেটা অফলাইন অবস্থায় সিঙ্ক্রোনাইজ করতে হবে। ব্যাকগ্রাউন্ড টাস্ক ব্যবহার করে আপনি এ ধরনের কার্যাবলী চালিয়ে নিতে পারেন।

async function syncDataInBackground() {
  const taskId = BackgroundTask.beforeExit(async () => {
    console.log('Syncing data...');
    // Sync data to the server here
    await syncDataWithServer();
    BackgroundTask.finish({
      taskId,
    });
  });
}

২.২ Push Notification এবং Background Services Integration

Push Notification এবং Background Services একত্রে ব্যবহার করা যেতে পারে। উদাহরণস্বরূপ, যখন একটি নতুন Push Notification আসবে, তখন ব্যাকগ্রাউন্ড টাস্ক ব্যবহার করে ডেটা সিঙ্ক্রোনাইজ বা অন্য কার্যাবলী চালানো যেতে পারে।

PushNotifications.addListener('pushNotificationReceived', (notification) => {
  console.log('Push notification received: ', notification);
  runBackgroundTask();  // Start background task when notification is received
});

এভাবে আপনি Push Notification এবং Background Task একত্রে ব্যবহার করে ব্যবহারকারীর অভিজ্ঞতা উন্নত করতে পারেন।


সারাংশ

  • Push Notification: Ionic অ্যাপের মধ্যে Firebase Cloud Messaging (FCM) ব্যবহার করে Push Notification পাঠানো যায়। এটি ব্যবহারকারীদের কাছে বিজ্ঞপ্তি পাঠাতে ব্যবহৃত হয়।
  • Background Services: Ionic অ্যাপে background tasks পরিচালনা করতে Capacitor Background Task Plugin ব্যবহার করা যায়। এটি অ্যাপের ব্যাকগ্রাউন্ডে কাজ করতে সাহায্য করে, যেমন ডেটা সিঙ্ক্রোনাইজেশন বা ফেচিং।

Push Notification এবং Background Services ব্যবহার করে আপনি অ্যাপের কার্যকারিতা এবং ব্যবহারকারীর অভিজ্ঞতা উন্নত করতে পারেন।

Content added By

Push Notifications এর ধারণা

521

Push Notifications হলো একটি পদ্ধতি যার মাধ্যমে অ্যাপ্লিকেশন বা ওয়েব সার্ভার ব্যবহারকারীদের কাছে বার্তা বা তথ্য প্রেরণ করে, যেগুলি সরাসরি তাদের ডিভাইসে প্রদর্শিত হয়। এই বার্তাগুলি সাধারণত ব্যবহারকারীর মনোযোগ আকর্ষণ করতে, কোনো নতুন ইভেন্ট সম্পর্কে জানাতে, অথবা গুরুত্বপূর্ণ আপডেট প্রদান করতে ব্যবহৃত হয়। Push notifications ব্যবহারকারীদের কাছে সরাসরি এবং দ্রুত পৌঁছাতে সাহায্য করে, এমনকি যখন অ্যাপ্লিকেশনটি খোলা না থাকে বা ব্যাকগ্রাউন্ডে চলে যায়।


Push Notifications এর প্রধান উপাদান:

  1. Sender (Publisher):
    • যিনি বা যা পুশ নোটিফিকেশনটি পাঠায়, এটি হতে পারে কোনো সার্ভার, ওয়েব সার্ভিস বা অ্যাপ্লিকেশন।
  2. Recipient (Subscriber):
    • যিনি পুশ নোটিফিকেশনটি গ্রহণ করবেন, অর্থাৎ, ব্যবহারকারী বা ডিভাইস।
  3. Message (Notification Content):
    • পুশ নোটিফিকেশনে প্রদর্শিত বার্তা, যা একটি টেক্সট, ইমেজ, বা ইন্টারেকটিভ কন্টেন্ট হতে পারে।
  4. Push Notification Service:
    • এটি একটি প্ল্যাটফর্ম যা নোটিফিকেশন প্রেরণ ও গ্রহণের প্রক্রিয়া পরিচালনা করে। উদাহরণস্বরূপ, Firebase Cloud Messaging (FCM), Apple Push Notification Service (APNs) ইত্যাদি।
  5. Device Token:
    • এটি একটি অনন্য শনাক্তকারী যা প্রতিটি ডিভাইসের জন্য বরাদ্দ করা হয়। নোটিফিকেশন প্রেরণকারী সার্ভার এটি ব্যবহার করে ডিভাইস বা ব্যবহারকারীকে সনাক্ত করে এবং তাদের কাছে নোটিফিকেশন প্রেরণ করে।

Push Notifications এর ধরন:

  1. Mobile Push Notifications:
    • মোবাইল অ্যাপ্লিকেশনগুলির মাধ্যমে পাঠানো পুশ নোটিফিকেশন। এটি ব্যবহারকারীর স্মার্টফোন বা ট্যাবলেটে প্রদর্শিত হয়। উদাহরণস্বরূপ, একটি মেসেজিং অ্যাপ্লিকেশন থেকে নতুন মেসেজের নোটিফিকেশন।
  2. Web Push Notifications:
    • ওয়েবসাইট বা ওয়েব অ্যাপ্লিকেশন দ্বারা পাঠানো পুশ নোটিফিকেশন। এটি ব্যবহারকারীর ব্রাউজারে প্রদর্শিত হয়, যদিও ওয়েবসাইটটি বন্ধ থাকে বা ব্যবহারকারী অন্য পৃষ্ঠায় থাকে।
  3. Desktop Push Notifications:
    • ডেস্কটপ অ্যাপ্লিকেশনগুলি বা ওয়েবসাইটগুলি ব্যবহারকারীর কম্পিউটার বা ল্যাপটপে পুশ নোটিফিকেশন প্রেরণ করে।

Push Notifications এর কার্যপ্রণালী:

  1. Subscription:
    • প্রথমে, ব্যবহারকারী একটি অ্যাপ্লিকেশন বা ওয়েবসাইটে সাবস্ক্রাইব করে। এই সময়ে, ডিভাইসের জন্য একটি অনন্য device token তৈরি হয় যা নোটিফিকেশন প্রেরণের জন্য ব্যবহার করা হয়।
  2. Push Notification Service (PNS):
    • যখন কোন নতুন নোটিফিকেশন পাঠানো হয়, তখন Push Notification Service (যেমন FCM বা APNs) এটি গ্রহণ করে এবং ডিভাইসে প্রেরণ করে।
  3. Notification Display:
    • পুশ নোটিফিকেশনটি ব্যবহারকারীর ডিভাইসে প্রদর্শিত হয়। এটি টেক্সট, অ্যাকশন বাটন বা কোনো ইমেজ থাকতে পারে এবং ব্যবহারকারী এতে ক্লিক করলে তাকে অ্যাপ্লিকেশনে বা ওয়েবসাইটে নিয়ে যাওয়া হয়।

Push Notifications এর সুবিধা:

  1. Immediate Communication:
    • পুশ নোটিফিকেশন ব্যবহারকারীদের সঙ্গে তাৎক্ষণিক যোগাযোগের সুযোগ দেয়, এমনকি যখন অ্যাপ্লিকেশন বন্ধ থাকে।
  2. Engagement:
    • নোটিফিকেশনগুলি ব্যবহারকারীদের অ্যাপ্লিকেশন বা ওয়েবসাইটে ফিরিয়ে আনার জন্য সাহায্য করে, যার মাধ্যমে অ্যাপের ব্যবহার এবং এঙ্গেজমেন্ট বৃদ্ধি পায়।
  3. Personalized Updates:
    • নোটিফিকেশনগুলি কাস্টমাইজ করা যায়, এবং ব্যবহারকারীর আগ্রহ এবং প্রয়োজন অনুসারে বার্তা পাঠানো যায়, যেমন ব্যক্তিগত অফার বা খবর।
  4. Better User Retention:
    • নিয়মিত পুশ নোটিফিকেশন ব্যবহারকারীদের মনে করিয়ে দেয় অ্যাপের বিদ্যমানতা, যা অ্যাপের পুনঃব্যবহার বা রিটেনশন বৃদ্ধি করতে সহায়ক।
  5. Real-Time Alerts:
    • পুশ নোটিফিকেশন ব্যবহারকারীকে তাৎক্ষণিকভাবে গুরুত্বপূর্ণ সতর্কতা, আপডেট বা বার্তা জানাতে সাহায্য করে, যেমন নতুন ইভেন্ট, মেসেজ, বা অফার।

Push Notifications এর চ্যালেঞ্জ:

  1. Overuse:
    • অতিরিক্ত পুশ নোটিফিকেশন পাঠানো ব্যবহারকারীদের বিরক্ত করতে পারে এবং অ্যাপটি আনইন্সটল করার কারণ হতে পারে। তাই, নোটিফিকেশনগুলিকে পরিমিত এবং লক্ষ্যভিত্তিক হওয়া উচিত।
  2. User Consent:
    • পুশ নোটিফিকেশন পাঠানোর জন্য ব্যবহারকারীর সম্মতি প্রয়োজন। অ্যাপ্লিকেশনের মধ্যে একটি পরিষ্কার অপশন থাকতে হবে যাতে ব্যবহারকারী তাদের পছন্দ অনুযায়ী নোটিফিকেশন গ্রহণ বা বাতিল করতে পারে।
  3. Device Compatibility:
    • কিছু পুরনো ডিভাইস বা প্ল্যাটফর্মে পুশ নোটিফিকেশন সমর্থন নাও থাকতে পারে, যার ফলে কিছু ব্যবহারকারী সেগুলি গ্রহণ করতে পারে না।
  4. Notification Fatigue:
    • অনেক পুশ নোটিফিকেশন ব্যবহারকারীদের একসময় ক্লান্ত বা বিরক্ত করতে পারে, যার কারণে তারা নোটিফিকেশন বন্ধ করে দিতে পারে বা অ্যাপটি আনইন্সটল করতে পারে।

Push Notification Tools and Services

  1. Firebase Cloud Messaging (FCM):
    • Google এর FCM একটি জনপ্রিয় এবং শক্তিশালী প্ল্যাটফর্ম যা মোবাইল এবং ওয়েব অ্যাপ্লিকেশনে পুশ নোটিফিকেশন পাঠানোর জন্য ব্যবহৃত হয়।
  2. Apple Push Notification Service (APNs):
    • APNs হলো Apple এর অফিশিয়াল পুশ নোটিফিকেশন সিস্টেম, যা iOS এবং macOS অ্যাপ্লিকেশনের জন্য ব্যবহৃত হয়।
  3. OneSignal:
    • OneSignal একটি সহজ ব্যবহারযোগ্য প্ল্যাটফর্ম যা ফ্রি এবং পেইড সার্ভিস দিয়ে পুশ নোটিফিকেশন প্রেরণ করতে সহায়ক।
  4. Pushwoosh:
    • Pushwoosh একটি শক্তিশালী পুশ নোটিফিকেশন সিস্টেম, যা অ্যাপ্লিকেশনের ব্যবহারকারীদের লক্ষ্যভিত্তিক নোটিফিকেশন পাঠানোর সুবিধা দেয়।

সারাংশ

Push Notifications হলো একটি কার্যকরী টুল যা অ্যাপ্লিকেশন এবং ওয়েবসাইটের মাধ্যমে ব্যবহারকারীদের কাছে সরাসরি বার্তা পাঠায়। এটি ব্যবহারকারীদের সাথে যোগাযোগ রাখতে এবং অ্যাপ্লিকেশন বা সাইটের সাথে এঙ্গেজমেন্ট বৃদ্ধি করতে সাহায্য করে। তবে, সঠিকভাবে এবং পরিমিতভাবে নোটিফিকেশন পাঠানো গুরুত্বপূর্ণ, যাতে ব্যবহারকারীরা বিরক্ত না হন এবং অ্যাপটি তারা ব্যবহার করতে চায়।

Content added By

Firebase Cloud Messaging (FCM) এর সাহায্যে Notifications

346

Firebase Cloud Messaging (FCM) হল একটি শক্তিশালী সিস্টেম যা মোবাইল এবং ওয়েব অ্যাপ্লিকেশনে পুশ নোটিফিকেশন পাঠানোর জন্য ব্যবহৃত হয়। Ionic অ্যাপ্লিকেশনে Firebase Cloud Messaging ব্যবহার করে আপনি রিয়েল-টাইম পুশ নোটিফিকেশন পাঠাতে পারবেন।

এখানে Ionic অ্যাপে Firebase Cloud Messaging (FCM) ইন্টিগ্রেট করার জন্য বিস্তারিত গাইড দেয়া হলো।


১. Firebase প্রজেক্ট তৈরি করা

প্রথমে Firebase কনসোল থেকে একটি নতুন প্রজেক্ট তৈরি করতে হবে:

  1. Firebase কনসোল এ যান: Firebase Console
  2. "Add Project" এ ক্লিক করে একটি নতুন প্রজেক্ট তৈরি করুন।
  3. প্রজেক্ট তৈরি হওয়ার পর, Cloud Messaging সার্ভিসে প্রবেশ করুন।

২. Firebase Cloud Messaging সেটআপ করা

২.১ FCM সেবা সক্রিয় করা

  1. Firebase কনসোল থেকে আপনার প্রজেক্ট নির্বাচন করুন।
  2. Cloud Messaging ট্যাব এ ক্লিক করুন।
  3. Web Push Certificates বিভাগে, Firebase Cloud Messaging এর জন্য আপনার Server Key এবং Sender ID পাবেন, যা পরে Ionic অ্যাপে ব্যবহার করা হবে।

৩. Ionic প্রজেক্টে Firebase SDK ইনস্টল করা

Ionic অ্যাপে Firebase Cloud Messaging সেটআপ করতে Firebase SDK ইনস্টল করতে হবে।

৩.১ Firebase SDK ইনস্টল করা

npm install firebase @angular/fire

এই কমান্ডটি Firebase SDK এবং Angular Firebase লাইব্রেরি ইনস্টল করবে।


৪. Firebase সেটআপ এবং কনফিগারেশন

৪.১ Firebase কনফিগারেশন ডেটা

Firebase কনসোল থেকে আপনার প্রজেক্টের কনফিগারেশন ডেটা নিন (যেমন API Key, Auth Domain, Project ID, Storage Bucket, Messaging Sender ID ইত্যাদি)। এটি firebaseConfig হিসাবে সংরক্ষণ করুন।

import { Component } from '@angular/core';
import { initializeApp } from 'firebase/app';
import { getMessaging } from 'firebase/messaging';
import { getToken } from 'firebase/messaging';
import { environment } from '../environments/environment';

@Component({
  selector: 'app-home',
  templateUrl: 'home.page.html',
  styleUrls: ['home.page.scss'],
})
export class HomePage {

  constructor() {
    const firebaseConfig = {
      apiKey: "YOUR_API_KEY",
      authDomain: "YOUR_AUTH_DOMAIN",
      projectId: "YOUR_PROJECT_ID",
      storageBucket: "YOUR_STORAGE_BUCKET",
      messagingSenderId: "YOUR_SENDER_ID",
      appId: "YOUR_APP_ID"
    };

    // Firebase অ্যাপ ইনিশিয়ালাইজ করা
    const app = initializeApp(firebaseConfig);
    const messaging = getMessaging(app);

    // FCM Token রিট্রিভ করা
    this.getFCMToken(messaging);
  }

  async getFCMToken(messaging) {
    try {
      const currentToken = await getToken(messaging, {
        vapidKey: "YOUR_PUBLIC_VAPID_KEY"
      });
      if (currentToken) {
        console.log('FCM Token:', currentToken);
      } else {
        console.log('No registration token available.');
      }
    } catch (error) {
      console.error('An error occurred while retrieving token.', error);
    }
  }
}

এখানে:

  • firebaseConfig: এটি Firebase কনসোল থেকে পাওয়া কনফিগারেশন তথ্য।
  • getToken: এটি FCM টোকেন তৈরি করে, যা সার্ভার থেকে নোটিফিকেশন পাঠাতে ব্যবহৃত হয়।

৫. Push Notification এর জন্য FCM Subscription

৫.১ Push Notification Permission চাওয়া

প্রথমবার পুশ নোটিফিকেশন গ্রহণের জন্য ইউজারের কাছ থেকে অনুমতি নিতে হবে। এটি করার জন্য ব্রাউজারের Notification API ব্যবহার করা হয়।

import { Component } from '@angular/core';
import { initializeApp } from 'firebase/app';
import { getMessaging } from 'firebase/messaging';
import { getToken } from 'firebase/messaging';

@Component({
  selector: 'app-home',
  templateUrl: 'home.page.html',
  styleUrls: ['home.page.scss'],
})
export class HomePage {

  constructor() {
    const firebaseConfig = {
      apiKey: "YOUR_API_KEY",
      authDomain: "YOUR_AUTH_DOMAIN",
      projectId: "YOUR_PROJECT_ID",
      storageBucket: "YOUR_STORAGE_BUCKET",
      messagingSenderId: "YOUR_SENDER_ID",
      appId: "YOUR_APP_ID"
    };

    const app = initializeApp(firebaseConfig);
    const messaging = getMessaging(app);

    this.getPermission(messaging);
  }

  async getPermission(messaging) {
    try {
      Notification.requestPermission().then(permission => {
        if (permission === "granted") {
          this.getFCMToken(messaging);
        } else {
          console.log("Notification permission denied");
        }
      });
    } catch (error) {
      console.error("Error requesting permission", error);
    }
  }

  async getFCMToken(messaging) {
    try {
      const currentToken = await getToken(messaging, {
        vapidKey: "YOUR_PUBLIC_VAPID_KEY"
      });
      if (currentToken) {
        console.log('FCM Token:', currentToken);
      } else {
        console.log('No registration token available.');
      }
    } catch (error) {
      console.error('An error occurred while retrieving token.', error);
    }
  }
}

এখানে:

  • Notification.requestPermission(): এটি ইউজারের কাছ থেকে পুশ নোটিফিকেশন গ্রহণের অনুমতি চায়।

৬. Server Side: Firebase Cloud Messaging ব্যবহার করা

একবার FCM টোকেন পাওয়ার পর, সার্ভার সাইড থেকে Firebase Cloud Messaging API ব্যবহার করে পুশ নোটিফিকেশন পাঠানো যাবে। নিচে একটি Node.js উদাহরণ দেয়া হলো।

৬.১ Firebase Admin SDK ইনস্টল করা

npm install firebase-admin

৬.২ Node.js সার্ভার সাইড কোড

const admin = require("firebase-admin");

admin.initializeApp({
  credential: admin.credential.applicationDefault()
});

const message = {
  token: 'FCM_DEVICE_TOKEN',
  notification: {
    title: 'Hello!',
    body: 'This is a push notification sent from Firebase.'
  }
};

admin.messaging().send(message)
  .then((response) => {
    console.log('Successfully sent message:', response);
  })
  .catch((error) => {
    console.log('Error sending message:', error);
  });

এখানে:

  • FCM_DEVICE_TOKEN: এটি ফ্রন্টএন্ড থেকে প্রাপ্ত FCM টোকেন যা নির্দিষ্ট ডিভাইসে নোটিফিকেশন পাঠানোর জন্য ব্যবহৃত হয়।
  • admin.messaging().send(message): এটি সার্ভার থেকে পুশ নোটিফিকেশন পাঠায়।

৭. Push Notification ব্যবহারকারী ইন্টারফেস

নোটিফিকেশন দেখানোর জন্য, Ionic অ্যাপ্লিকেশনে Notification API এবং Ionic এর Push Notification প্যাকেজ ব্যবহার করা যেতে পারে।


সারাংশ

Firebase Cloud Messaging (FCM) এর সাহায্যে আপনি Ionic অ্যাপ্লিকেশনে পুশ নোটিফিকেশন পাঠাতে পারেন।

  • Firebase কনসোল থেকে আপনার প্রজেক্ট তৈরি করতে হবে এবং FCM সেটআপ করতে হবে।
  • Ionic অ্যাপে FCM টোকেন রিট্রিভ করার জন্য Firebase SDK ব্যবহার করতে হবে।
  • Server side থেকে Firebase Admin SDK ব্যবহার করে নোটিফিকেশন পাঠানো যাবে।

এভাবে আপনি রিয়েল-টাইম পুশ নোটিফিকেশন পাঠাতে এবং গ্রহণ করতে পারবেন।

Content added By

Background Services ব্যবহারের কৌশল

334

Ionic অ্যাপ্লিকেশনগুলোর জন্য Background Services গুরুত্বপূর্ণ হতে পারে, বিশেষত যখন আপনি অ্যাপের বাইরে থাকলেও কিছু প্রক্রিয়া চালিয়ে রাখতে চান, যেমন ডেটা সিঙ্ক করা, নোটিফিকেশন পাঠানো, অথবা ব্যাকগ্রাউন্ডে অডিও/ভিডিও প্লে করা। তবে, Ionic নিজে থেকে ব্যাকগ্রাউন্ড কাজ পরিচালনার জন্য ডিফল্টভাবে কোনও API সরবরাহ করে না, তবে আপনি কিছু প্লাগইন ব্যবহার করে ব্যাকগ্রাউন্ড কাজ করতে পারেন।

এখানে Ionic অ্যাপে ব্যাকগ্রাউন্ড সার্ভিস ব্যবহারের কৌশল এবং কিছু জনপ্রিয় প্লাগইন নিয়ে আলোচনা করা হবে।


১. Background Fetch (ফোরগ্রাউন্ড এবং ব্যাকগ্রাউন্ড কাজ)

Ionic অ্যাপে Background Fetch ব্যবহার করে আপনি ব্যাকগ্রাউন্ডে ডেটা সিঙ্ক করতে পারেন। এটি একটি প্লাগইন যা অ্যাপকে ব্যাকগ্রাউন্ডে ডেটা আপডেট করার সুবিধা দেয়।

Background Fetch প্লাগইন ইনস্টল করা

npm install @ionic-native/background-fetch

Platform সেটআপ

app.module.ts এ প্লাগইনটি ইনস্টল করুন:

import { BackgroundFetch } from '@ionic-native/background-fetch/ngx';

@NgModule({
  providers: [
    BackgroundFetch
  ]
})
export class AppModule {}

ব্যাকগ্রাউন্ড ফেচ শুরু করা

ব্যাকগ্রাউন্ড সার্ভিসে কাজ শুরু করতে, অ্যাপের এক্সিকিউটেবল কোডে (যেমন home.page.ts) নিচের কোড ব্যবহার করা যেতে পারে:

import { Component } from '@angular/core';
import { BackgroundFetch } from '@ionic-native/background-fetch/ngx';

@Component({
  selector: 'app-home',
  templateUrl: 'home.page.html',
  styleUrls: ['home.page.scss'],
})
export class HomePage {

  constructor(private backgroundFetch: BackgroundFetch) {}

  // Background fetch চালু করা
  startBackgroundFetch() {
    this.backgroundFetch.configure({
      minimumFetchInterval: 15,  // মিনিট হিসেবে
      stopOnTerminate: false,  // অ্যাপ বন্ধ হলেও কাজ চালু থাকবে
      startOnBoot: true  // ডিভাইস রিস্টার্ট হলে আবার চালু হবে
    }).then(() => {
      console.log('Background Fetch Initialized');
      this.backgroundFetch.finish(); // কাজ সম্পন্ন হলে
    }).catch(error => {
      console.error('Background fetch failed', error);
    });
  }
}

এখানে:

  • minimumFetchInterval: প্রতি কত মিনিট পর ব্যাকগ্রাউন্ড ফেচ চলবে তা নির্ধারণ করে।
  • stopOnTerminate: অ্যাপ টার্মিনেট হওয়ার পরও সার্ভিস চালু রাখবে কি না তা নির্ধারণ করে।
  • startOnBoot: ডিভাইস রিস্টার্ট হলে সার্ভিসটি আবার চালু হবে।

২. Background Geolocation (অবস্থান ট্র্যাকিং)

আপনি যদি ব্যবহারকারীর অবস্থান ট্র্যাক করতে চান, তবে Background Geolocation প্লাগইন ব্যবহার করতে পারেন। এটি ব্যবহারকারী যখন ব্যাকগ্রাউন্ডে থাকে তখনও তাদের অবস্থান ট্র্যাক করবে।

Background Geolocation প্লাগইন ইনস্টল করা

npm install @ionic-native/background-geolocation

Platform সেটআপ

app.module.ts এ প্লাগইনটি ইনস্টল করুন:

import { BackgroundGeolocation } from '@ionic-native/background-geolocation/ngx';

@NgModule({
  providers: [
    BackgroundGeolocation
  ]
})
export class AppModule {}

ব্যাকগ্রাউন্ড অবস্থান ট্র্যাকিং

import { Component } from '@angular/core';
import { BackgroundGeolocation } from '@ionic-native/background-geolocation/ngx';

@Component({
  selector: 'app-home',
  templateUrl: 'home.page.html',
  styleUrls: ['home.page.scss'],
})
export class HomePage {

  constructor(private backgroundGeolocation: BackgroundGeolocation) {}

  // Geolocation শুরু করা
  startTracking() {
    const config = {
      desiredAccuracy: 10,
      stationaryRadius: 20,
      distanceFilter: 30,
      debug: true,  // ডিবাগ মোড
      stopOnTerminate: false,
      startOnBoot: true
    };

    this.backgroundGeolocation.configure(config)
      .then(() => {
        console.log('Location tracking started');
        this.backgroundGeolocation.on('location', (location) => {
          console.log(location);  // অবস্থান তথ্য
        });

        this.backgroundGeolocation.start();
      })
      .catch((error) => {
        console.log('Error starting background geolocation: ', error);
      });
  }
}

এখানে:

  • desiredAccuracy: ব্যবহারকারীর অবস্থানের সঠিকতা নির্ধারণ করে।
  • stationaryRadius: ব্যবহারকারী যে সীমার মধ্যে স্থির থাকবে সে জন্য রেডিয়াস নির্ধারণ করা।
  • distanceFilter: অবস্থান পরিবর্তন হওয়া পর্যন্ত কিরকম দূরত্ব থাকতে হবে তা নির্ধারণ করে।
  • debug: ডিবাগ মোড চালু করে।
  • stopOnTerminate এবং startOnBoot: অ্যাপ বন্ধ হলে ট্র্যাকিং বন্ধ হবে না এবং ডিভাইস রিস্টার্ট হলে ট্র্যাকিং আবার শুরু হবে।

৩. Push Notifications (ব্যাকগ্রাউন্ড নোটিফিকেশন)

Push notifications ব্যবহার করে আপনি ব্যবহারকারীকে অ্যাপ বন্ধ থাকার পরেও নোটিফিকেশন পাঠাতে পারেন। Ionic অ্যাপে OneSignal বা Firebase Cloud Messaging (FCM) ব্যবহৃত হয়।

OneSignal প্লাগইন ইনস্টল করা

npm install @ionic-native/onesignal

OneSignal সেটআপ

import { OneSignal } from '@ionic-native/onesignal/ngx';

@Component({
  selector: 'app-home',
  templateUrl: 'home.page.html',
  styleUrls: ['home.page.scss'],
})
export class HomePage {

  constructor(private oneSignal: OneSignal) {}

  // OneSignal সেটআপ
  startPushNotifications() {
    this.oneSignal.startInit('your-app-id', 'your-sender-id');

    this.oneSignal.handleNotificationReceived().subscribe((data) => {
      console.log('Notification received:', data);
    });

    this.oneSignal.handleNotificationOpened().subscribe((data) => {
      console.log('Notification opened:', data);
    });

    this.oneSignal.endInit();
  }
}

এখানে:

  • Notification Received: ব্যবহারকারী যখন নোটিফিকেশন গ্রহণ করেন।
  • Notification Opened: ব্যবহারকারী যখন নোটিফিকেশন ওপেন করেন।

৪. Local Notifications (স্থানীয় নোটিফিকেশন)

Ionic অ্যাপে Local Notifications ব্যবহার করে আপনি অ্যাপের ভিতরে নিজস্ব নোটিফিকেশন পাঠাতে পারেন।

Local Notifications প্লাগইন ইনস্টল করা

npm install @ionic-native/local-notifications

Local Notifications সেটআপ

import { LocalNotifications } from '@ionic-native/local-notifications/ngx';

@Component({
  selector: 'app-home',
  templateUrl: 'home.page.html',
  styleUrls: ['home.page.scss'],
})
export class HomePage {

  constructor(private localNotifications: LocalNotifications) {}

  // স্থানীয় নোটিফিকেশন পাঠানো
  scheduleNotification() {
    this.localNotifications.schedule({
      id: 1,
      title: 'Hello!',
      text: 'This is a background notification',
      trigger: { at: new Date(new Date().getTime() + 5000) },  // 5 সেকেন্ড পর নোটিফিকেশন হবে
      led: 'FF0000',
      sound: null
    });
  }
}

এখানে:

  • trigger: নোটিফিকেশন কখন পাঠাতে হবে তা নির্ধারণ করে (এখানে 5 সেকেন্ড পর নোটিফিকেশন পাঠানো হবে)।

সারাংশ

Ionic অ্যাপে Background Services ব্যবহারের কৌশলগুলি ব্যাকগ্রাউন্ডে দীর্ঘ সময় ধরে চলতে থাকা প্রক্রিয়া (যেমন ডেটা সিঙ্ক, অবস্থান ট্র্যাকিং, বা নোটিফিকেশন পাঠানো) পরিচালনা করতে সহায়তা করে। এই প্লাগইনগুলো ব্যবহার করে আপনি বিভিন্ন ব্যাকগ্রাউন্ড টাস্ক সম্পন্ন করতে পারবেন:

  • Background Fetch: ব্যাকগ্রাউন্ডে ডেটা সিঙ্ক।
  • Background Geolocation: অবস্থান ট্র্যাকিং।
  • Push Notifications: অ্যাপ বন্ধ থাকলেও নোটিফিকেশন পাঠানো।
  • Local Notifications: অ্যাপের ভিতর থেকেই স্থানীয় নোটিফিকেশন পাঠানো।

এই প্লাগইনগুলো ব্যাকগ্রাউন্ড প্রক্রিয়া চালানোর জন্য সহজ এবং কার্যকরী উপায় সরবরাহ করে।

Content added By

Local Notifications সেটআপ

328

Ionic অ্যাপ্লিকেশনে Local Notifications ব্যবহার করার জন্য Capacitor অথবা Cordova প্লাগইন ব্যবহার করা যেতে পারে। এখানে আমরা Capacitor Local Notifications প্লাগইন ব্যবহার করে Local Notifications সেটআপ করার প্রক্রিয়া নিয়ে আলোচনা করবো, কারণ এটি Ionic অ্যাপ্লিকেশনের সাথে আধুনিক ও অফিশিয়াল সমর্থন পায়।


১. Capacitor Local Notifications প্লাগইন ইনস্টল করা

প্রথমে, Capacitor Local Notifications প্লাগইন ইনস্টল করতে হবে। এটি ইনস্টল করতে নিচের কমান্ডটি ব্যবহার করুন:

npm install @capacitor/local-notifications
npx cap sync

এই কমান্ডটি প্লাগইন ইনস্টল করবে এবং প্রয়োজনীয় ফাইল এবং কনফিগারেশন আপনার প্রজেক্টে সিঙ্ক্রোনাইজ করবে।


২. Capacitor প্লাগইন কনফিগারেশন

Capacitor Local Notifications প্লাগইন ইনস্টল করার পর, Android এবং iOS প্ল্যাটফর্মে এটি সঠিকভাবে কাজ করার জন্য কিছু কনফিগারেশন করতে হবে।

২.১ Android কনফিগারেশন

  1. AndroidManifext.xml ফাইলে INTERNET এবং WAKE_LOCK পারমিশন অ্যাড করুন:

    <uses-permission android:name="android.permission.INTERNET"/>
    <uses-permission android:name="android.permission.WAKE_LOCK"/>
    
  2. Notification Channel তৈরি করুন, Android 8.0 (API level 26) বা তার পরের সংস্করণে Local Notifications সঠিকভাবে কাজ করতে হলে Notification Channel প্রয়োজন।
import { LocalNotifications } from '@capacitor/local-notifications';

// Create the notification channel
const channel = await LocalNotifications.createChannel({
  id: 'default',
  name: 'Default notifications',
  description: 'A default channel',
  sound: 'beep.wav',
  importance: 3,
});

২.২ iOS কনফিগারেশন

iOS এর জন্য, Background Modes সক্রিয় করতে হবে:

  1. Xcode এ গিয়ে আপনার প্রজেক্ট খুলুন।
  2. Capabilities ট্যাবে গিয়ে Background Modes সক্রিয় করুন এবং Remote notifications নির্বাচন করুন।
  3. App Sandbox > Push notifications চালু করুন।

৩. Local Notifications পাঠানো

এখন আপনি Local Notification পাঠাতে পারবেন। নিচে উদাহরণ দেয়া হলো কিভাবে Ionic অ্যাপে একটি Local Notification পাঠানো যায়।

৩.১ Local Notification পাঠানো

import { LocalNotifications } from '@capacitor/local-notifications';

async function scheduleNotification() {
  await LocalNotifications.schedule({
    notifications: [
      {
        title: "My First Notification",
        body: "This is a test notification",
        id: 1,
        schedule: { at: new Date(new Date().getTime() + 1000 * 5) }, // 5 seconds later
        sound: null,
        attachments: null,
        actionTypeId: '',
        extra: null
      }
    ]
  });
}
  • title: নোটিফিকেশনের শিরোনাম।
  • body: নোটিফিকেশনের বডি বা বার্তা।
  • id: প্রতিটি নোটিফিকেশনের একটি ইউনিক আইডি।
  • schedule: কখন নোটিফিকেশনটি পাঠানো হবে। উদাহরণস্বরূপ, এখানে এটি ৫ সেকেন্ড পর পাঠানো হবে।
  • sound: আপনি যদি একটি সাউন্ড দিতে চান তবে তা এখানে নির্ধারণ করতে হবে।
  • attachments: ইমেজ বা অন্যান্য অ্যাটাচমেন্ট ব্যবহার করতে পারেন।

৩.২ নোটিফিকেশন হ্যান্ডলিং

একটি নোটিফিকেশন ক্লিক করার পর অ্যাপটি কি করবে তা নির্ধারণ করা যেতে পারে। এটি addListener ব্যবহার করে হ্যান্ডল করা যায়:

import { LocalNotifications } from '@capacitor/local-notifications';

LocalNotifications.addListener('localNotificationActionPerformed', (notification) => {
  console.log('Notification clicked:', notification);
  // Handle the notification action (e.g., navigate to a specific page)
});

এখানে, যখন কোনো নোটিফিকেশন ক্লিক করা হয় তখন তা কনসোলে লগ হবে এবং আপনি আপনার অ্যাপের নির্দিষ্ট পেজে নেভিগেট করার মতো কাজ করতে পারেন।


৪. Notifying the User with Ongoing Notifications

আপনি যদি ongoing notifications পাঠাতে চান, যেগুলি ইউজারের অ্যাকশন না হওয়া পর্যন্ত চলে, তখন সেগুলোর জন্য ongoing ফ্ল্যাগ ব্যবহার করতে পারেন।

import { LocalNotifications } from '@capacitor/local-notifications';

async function scheduleOngoingNotification() {
  await LocalNotifications.schedule({
    notifications: [
      {
        title: "Ongoing Notification",
        body: "This notification will remain ongoing until you interact with it",
        id: 2,
        schedule: { at: new Date(new Date().getTime() + 1000 * 5) }, // 5 seconds later
        ongoing: true,
        sound: null,
      }
    ]
  });
}
  • ongoing: যদি আপনি নোটিফিকেশনকে ongoing (অথবা স্থায়ী) করতে চান, তবে ongoing: true সেট করতে হবে।

৫. Notifying with a Custom Sound

আপনি কাস্টম সাউন্ডও ব্যবহার করতে পারেন নোটিফিকেশনগুলিতে। শুধুমাত্র আপনাকে একটি সাউন্ড ফাইল যুক্ত করতে হবে, যেমন beep.wav, এবং এটি আপনার নোটিফিকেশনের সাথে যুক্ত করা হবে।

import { LocalNotifications } from '@capacitor/local-notifications';

async function scheduleCustomSoundNotification() {
  await LocalNotifications.schedule({
    notifications: [
      {
        title: 'Notification with Sound',
        body: 'This is a test notification with custom sound',
        id: 3,
        schedule: { at: new Date(new Date().getTime() + 1000 * 5) },
        sound: 'beep.wav'
      }
    ]
  });
}

৬. Permission Handling

অ্যাপ্লিকেশন শুরু করার আগে, notification permission চাওয়ার জন্য আপনি এই কোডটি ব্যবহার করতে পারেন:

import { LocalNotifications } from '@capacitor/local-notifications';

async function requestPermission() {
  const permission = await LocalNotifications.requestPermission();
  if (permission.granted) {
    console.log('Permission granted');
  } else {
    console.log('Permission denied');
  }
}

উপসংহার

Local Notifications ব্যবহারের মাধ্যমে আপনার Ionic অ্যাপে ইউজারদেরকে তাদের অ্যাপের সাথে সম্পর্কিত গুরুত্বপূর্ণ তথ্য জানানোর জন্য সাহায্য করতে পারে। এটি মূলত অ্যাপ্লিকেশনের ভিতরে কার্যক্রমের জন্য যেমন রিমাইন্ডার, বিজ্ঞপ্তি, বা ইভেন্ট সম্পর্কিত নোটিফিকেশন পাঠানোর জন্য ব্যবহৃত হয়।

  • Capacitor Local Notifications প্লাগইন সেটআপ করার মাধ্যমে আপনি মোবাইল অ্যাপে সহজেই নোটিফিকেশন ব্যবস্থা কার্যকর করতে পারবেন।
  • Permission handling এবং notification scheduling এর মাধ্যমে আপনি সঠিক সময়ে ইউজারদের অবহিত করতে পারবেন।
  • কাস্টম সাউন্ড, ongoing notifications, এবং action-handling-এর মাধ্যমে আপনার নোটিফিকেশনসকে আরো ইন্টারঅ্যাক্টিভ ও ব্যবহারকারী-বান্ধব করতে পারবেন।
Content added By
Promotion
NEW SATT AI এখন আপনাকে সাহায্য করতে পারে।

Are you sure to start over?

Loading...