Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/infobip/mobile-messaging-cordova-plugin
Mobile Messaging SDK plugin for Cordova projects
https://github.com/infobip/mobile-messaging-cordova-plugin
android cordova huawei ionic ios push-notifications sdk
Last synced: 3 months ago
JSON representation
Mobile Messaging SDK plugin for Cordova projects
- Host: GitHub
- URL: https://github.com/infobip/mobile-messaging-cordova-plugin
- Owner: infobip
- Created: 2016-11-29T12:52:45.000Z (about 8 years ago)
- Default Branch: master
- Last Pushed: 2024-04-19T08:24:03.000Z (9 months ago)
- Last Synced: 2024-04-20T08:25:24.139Z (9 months ago)
- Topics: android, cordova, huawei, ionic, ios, push-notifications, sdk
- Language: JavaScript
- Homepage:
- Size: 62.6 MB
- Stars: 19
- Watchers: 17
- Forks: 10
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Mobile Messaging SDK plugin for Cordova
[](https://www.npmjs.com/package/com-infobip-plugins-mobilemessaging)
Mobile Messaging SDK is designed and developed to easily enable push notification channel in your mobile application. In almost no time of implementation you get push notification in your application and access to the features of [Infobip IP Messaging Platform](https://www.infobip.com/en/products/mobile-app-messaging).
The document describes library integration steps for your Cordova project.
* [Requirements](#requirements)
* [Quick start guide](#quick-start-guide)
* [Initialization configuration](#initialization-configuration)
## Requirements
- cordova 12.0.0 (`sudo npm install -g cordova`)
- npm (version 8.13.x or higher)
- node (version 16.10.0 or higher)
For iOS project:
- Xcode 15
- Carthage >= 0.39.0 (`brew install carthage`)
- Minimum deployment target 12.0
- [[email protected]](https://cordova.apache.org/announcements/2023/07/10/cordova-ios-7.0.0.html)
- Ruby (2.7.x - 3.1.x)
For Android project:
- Android Studio
- Supported API Levels: 22 ( Android 5.1 - [Lollipop](https://developer.android.com/about/versions/lollipop)) - 34 (Android 14.0)
- [[email protected]](https://cordova.apache.org/announcements/2023/05/22/cordova-android-12.0.0.html)
For Huawei:
- Android Studio
- Installed AppGallery with HMS Core at device
- Supported API Levels: 22 ( Android 5.1 - [Lollipop](https://developer.android.com/about/versions/lollipop)) - 31 (Android 12.0)
## Quick start guide
This guide is designed to get you up and running with Mobile Messaging SDK plugin for Cordova:
1. Make sure to [setup application at Infobip portal](https://www.infobip.com/docs/mobile-app-messaging/getting-started#create-and-enable-a-mobile-application-profile), if you haven't already.
2. Add MobileMessaging plugin to your project, run in terminal:
```bash
$ cordova plugin add com-infobip-plugins-mobilemessaging --save
```
You can add typings if you are using TypeScript in yours project
```bash
npm install --save-dev @types/mobile-messaging-cordova
```
expand to see Ionic code
```bash
ionic cordova plugin add com-infobip-plugins-mobilemessaging --save
npm install @awesome-cordova-plugins/mobile-messaging --save
```
3. Configure platforms
1. **iOS**: [Integrate Notification Service Extension](https://github.com/infobip/mobile-messaging-cordova-plugin/wiki/Delivery-improvements-and-rich-content-notifications) into your app in order to obtain:
- more accurate processing of messages and delivery stats
- support of rich notifications on the lock screen
2. **Android**:
1. Get the Firebase configuration file (google-services.json) as described in `Firebase documentation` and put it to the root application folder.
2. Add following to your config.xml
```xml
...
```
> ### Notice (when targeting Android 13):
> Starting from Android 13, Google requires to ask user for notification permission. Follow this guide to make a permission request.
4. Configure Huawei build
1. Configure Huawei application
2. Change `plaform/android/build.gradle`
```gradle
buildscript {
repositories {
mavenCentral()
google()
maven { url 'https://developer.huawei.com/repo/' } // Added for Huawei support
}
dependencies {
...
classpath 'com.huawei.agconnect:agcp:1.6.0.300' // Added for Huawei support
}
}
allprojects {
repositories {
mavenCentral()
google()
maven {url 'https://developer.huawei.com/repo/'} // Added for Huawei support
}
...
}
```
3. Change `plaform/android/app/build.gradle`
```gradle
apply plugin: 'com.android.application'
apply plugin: 'com.huawei.agconnect' // Added for Huawei support
dependencies {
implementation 'com.huawei.hms:push:6.3.0.302' // Added for Huawei support
}
```
4. Sign your app to provide config for Generated Signing Certificate Fingerprint at previous step.
You can change `plaform/android/app/build.gradle` or write sign config to `build.json`
```gradle
android {
signingConfigs {
release {
storeFile file()
storePassword ""
keyAlias ""
keyPassword ""
}
}
buildTypes {
release {
signingConfig signingConfigs.release
}
debug {
signingConfig signingConfigs.release
}
}
...
```
5. Download `agconnect-services.json` from AppGallery Connect and copy it to `platforms/android/app`.
a. Find your App from the list and click the link under Android App in the Mobile phone column.
b. Go to Develop > Overview.
c. In the App information area, Click `agconnect-services.json` to download the configuration file.
6. Add [`Huawei App ID`](https://developer.huawei.com/consumer/en/doc/development/HMSCore-Guides/android-config-agc-0000001050170137) via plugin variable in `config.xml` :
```xml
```
You can take this value from `agconnect-services.json`.
7. Remove, if following was added to `config.xml`
```xml
...
```
8. Run `cordova build android --hms` to make build for HMS.
**Note** that if you are developing / testing FCM and HMS at the same device then better to remove cache for installed app, remove app and after that install build with other push cloud.
5. Add code to your project to initialize the library after `deviceready` event with configuration options and library event listener:
```javascript
onDeviceReady: function () {
...
MobileMessaging.init({
applicationCode: '',
geofencingEnabled: '',
ios: {
notificationTypes: ['alert', 'badge', 'sound']
},
android: {
notificationIcon: ,
multipleNotifications: ,
notificationAccentColor:
}
},
function(error) {
console.log('Init error: ' + error.description);
}
);
MobileMessaging.register('messageReceived',
function(message) {
console.log('Message Received: ' + message.body);
}
);
...
}
```
expand to see Ionic code
#### Add this code to app.module.ts::
```typescript
import { MobileMessaging } from '@ionic-native/mobile-messaging/ngx';
...
@NgModule({
...
providers: [
...
MobileMessaging
...
]
...
})
export class AppModule { }
```
#### Usage sample:
```typescript
import {Message, MobileMessaging, UserData} from '@ionic-native/mobile-messaging/ngx';
...
@Component({
selector: 'app-root',
templateUrl: 'app.component.html',
styleUrls: ['app.component.scss']
})
export class AppComponent {
constructor(
private platform: Platform,
private splashScreen: SplashScreen,
private statusBar: StatusBar,
private mobileMessaging: MobileMessaging
) {
this.initializeApp();
}
...
this.mobileMessaging.init({
applicationCode: '',
geofencingEnabled: '',
ios: {
notificationTypes: ['alert', 'badge', 'sound']
},
android: {
notificationIcon: ,
multipleNotifications: ,
notificationAccentColor:
}}, (err) => {
...
});
this.mobileMessaging.register('messageReceived', function (message: any) {
...
});
```
## Initialization configuration
```javascript
MobileMessaging.init({
applicationCode: ,
ios: {
notificationTypes:
},
android: { // optional
notificationIcon: ,
multipleNotifications: ,
notificationAccentColor:
},
geofencingEnabled: , // optional
messageStorage: , // optional
defaultMessageStorage: , // optional
notificationCategories: [ // optional
{
identifier: ,
actions: [
{
identifier: ,
title: ,
foreground: ,
textInputPlaceholder: ,
moRequired: ,
// iOS only
authenticationRequired: ,
destructive: ,
textInputActionButtonTitle: ,
// Android only
icon:
}
]
}
],
privacySettings: { // optional
carrierInfoSendingDisabled: ,
systemInfoSendingDisabled: ,
userDataPersistingDisabled:
}
},
function(error) {
console.log('Init error: ' + error.description);
}
);
```
#### More details on SDK features and FAQ you can find on [Wiki](https://github.com/infobip/mobile-messaging-cordova-plugin/wiki)
NEXT STEPS: Users and installations
| If you have any questions or suggestions, feel free to send an email to [email protected] or create an issue. |
|---|