بدء سريع لـ Capacitor SDK

ابدأ باستخدام Pushwoosh Capacitor SDK من خلال هذا المثال السريع والبسيط.

المتطلبات الأساسية

لدمج Pushwoosh Capacitor SDK في تطبيقك، ستحتاج إلى ما يلي:

المتطلبات

• حساب Pushwoosh.
• مشروع Pushwoosh تم إعداده في حسابك.
• لتكامل iOS:
  • منصة iOS مهيأة لإرسال إشعارات الدفع. نوصي باستخدام إعداد المصادقة المستندة إلى الرمز المميز (Token-Based Authentication) كأبسط طريقة.
  • أثناء الإعداد، قم بتعيين Gateway إلى Sandbox لإرسال الإشعارات إلى جهاز محاكاة.
• لتكامل Android:
  • منصة Android مهيأة
  • project number (المعروف أيضًا باسم Sender ID)، وملف google-services.json، وpackage name من مشروع Firebase الخاص بك.
  • مشروع Firebase متصل بتطبيق Android الخاص بك. اتبع دليل إعداد Firebase إذا لزم الأمر.
• Pushwoosh Application Code الخاص بك و Pushwoosh Device API Token من لوحة تحكم Pushwoosh لتطبيقك.

تنزيل المشروع التجريبي

استنسخ مستودع SDK:

git clone https://github.com/Pushwoosh/pushwoosh-capacitor-plugin.git

انتقل إلى دليل المكون الإضافي:

cd pushwoosh-capacitor-plugin

بناء المكون الإضافي

قبل تشغيل التطبيق التجريبي، تحتاج إلى بناء مكون Capacitor الإضافي. قم بتثبيت تبعيات المكون الإضافي:

npm i

قم ببناء المكون الإضافي:

npm run build

تهيئة التطبيق التجريبي

انتقل إلى دليل التطبيق التجريبي:

cd example

قم بتثبيت تبعيات التطبيق:

npm i

قم ببناء أصول الويب:

npm run build

افتح src/js/example.js وقم بتحديث استدعاء Pushwoosh.onDeviceReady:

Pushwoosh.onDeviceReady({
    projectid: "__YOUR_FCM_SENDER_ID__",
    appid: "__YOUR_APP_CODE__"
});

حيث:

__YOUR_APP_CODE__ هو رمز التطبيق من Pushwoosh Control Panel. __YOUR_FCM_SENDER_ID__ هو رقم مشروع Firebase من Firebase Console.

iOS

1. تثبيت تبعيات CocoaPods

انتقل إلى دليل منصة iOS وقم بتثبيت تبعيات CocoaPods:

cd ios/App
pod install --repo-update
cd ../..

2. مزامنة Capacitor مع iOS

بعد تثبيت CocoaPods، قم بمزامنة تهيئة Capacitor:

npx cap sync ios

3. افتح مشروع iOS

افتح المشروع في Xcode:

npx cap open ios

3. تعيين Bundle Identifier

في Xcode، قم بتعيين Bundle Identifier إلى اسم حزمة تطبيقك (على سبيل المثال، com.example.pushwoosh).

5. إضافة الإمكانيات

لتمكين Push Notifications، تحتاج إلى إضافة بعض الإمكانيات.

في قسم Signing & Capabilities، أضف الإمكانيات التالية:

• Push Notifications
• Background Modes. بعد إضافة هذه الإمكانية، حدد المربع الخاص بـ Remote notifications.

6. تعيين API Token

افتح ios/App/App/Info.plist في Xcode وأضف الإدخال التالي باستخدام Pushwoosh Device API Token الخاص بك:

Info.plist

<key>Pushwoosh_API_TOKEN</key>
<string>__YOUR_PUSHWOOSH_DEVICE_API_TOKEN__</string>

Android

1. مزامنة Capacitor مع Android

قم بمزامنة تهيئة Capacitor مع منصة Android:

npx cap sync android

2. إعداد google-services.json

انسخ ملف google-services.json الخاص بك إلى دليل android/app.

3. تعيين اسم الحزمة

افتح android/app/build.gradle وقم بتعيين applicationId إلى اسم حزمة تطبيقك (على سبيل المثال، com.example.pushwoosh).

4. تعيين API Token

افتح ملف android/app/src/main/AndroidManifest.xml الخاص بك وأضف البيانات الوصفية التالية داخل علامة <application>:

AndroidManifest.xml

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

استبدل __YOUR_PUSHWOOSH_DEVICE_API_TOKEN__ بـ Pushwoosh Device API Token الخاص بك.

5. افتح مشروع Android

افتح المشروع في Android Studio:

npx cap open android

تشغيل المشروع

1. قم ببناء وتشغيل المشروع.
2. اضغط على زر “Click Me!”.
3. امنح الإذن لإشعارات Push. سيتم تسجيل الجهاز في Pushwoosh.

إرسال إشعار Push

ارجع إلى Pushwoosh Control Panel و أرسل إشعار Push إلى جهازك المسجل.