البدء السريع لـ 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. __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. إضافة القدرات (capabilities)

لتمكين الإشعارات الفورية (Push Notifications)، تحتاج إلى إضافة قدرات معينة.

في قسم Signing & Capabilities، أضف القدرات التالية:

• Push Notifications
• Background Modes. بعد إضافة هذه القدرة، حدد مربع Remote notifications.

6. تعيين رمز API

افتح ios/App/App/Info.plist في Xcode وأضف الإدخال التالي مع رمز API لجهاز Pushwoosh (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

افتح ملف 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__ بـ رمز API لجهاز Pushwoosh (Pushwoosh Device API Token) الخاص بك.

5. فتح مشروع Android

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

npx cap open android

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

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

إرسال إشعار فوري

ارجع إلى لوحة تحكم Pushwoosh وأرسل إشعارًا فوريًا إلى جهازك المسجل.