Pubnub + React native - No banner notification on iOS real device - iphone

I have integrated Pubnub Javascript sdk-v4 with my react native project.
And have used https://github.com/zo0r/react-native-push-notification for react native push notification. In both simulators (android and iOS), the notification banner is shown when the app is running in the background (even if the app is closed). However, the notification banner isn't displayed when tested on a real device. The notification is only shown in the notification bar (when scrolled from the top of the screen). Any suggestion?
Code segment likes follows.
.
.
var PushNotification = require('react-native-push-notification');
var serviceCall = require('../../actions/serviceCall');
import PushController from '../../actions/pushController'
var PubNub = require('pubnub');
.
.
class SearchBar extends Component {
constructor(props) {
super(props);
this.state = {
...
...
};
this.constructor.childContextTypes = {
theme: React.PropTypes.object,
}
}
componentDidMount(){
var pubnub = new PubNub({
publishKey : 'pub-c-xxxxxx',
subscribeKey : 'sub-c-xxxxxx'
})
var notifyListener ={
message: function(message) {
console.warn(JSON.stringify(message));
PushNotification.localNotification({
message: message.message.text, // (required)
});
}
}
pubnub.addListener(notifyListener);
pubnub.subscribe({
channels: ['Channel-xxxxxxx']
});
}
return (
<Container>
<View theme={theme}>
<PushController/>
.
.
.
</View>
</Container>
)
}

I had to change the method of integration and this link was success.
Link: https://www.pubnub.com/docs/react-native-javascript/mobile-gateway

Related

Run action before Ionic Vue closes or app runs in background

How can i detect in Ionic Vue if the app closes or if the app is send to the background?
this.platformor platform isn't available or does not work?!
You can subscribe to the appStateChange event, like described here: https://capacitorjs.com/docs/apis/app
Example:
import { App } from '#capacitor/app'
export default {
created () {
App.addListener('appStateChange', state => {
if (!state.isActive) { // if isActive is true, App got sent to foreground, if it is false, it got sent to the background
...
}
})
}
}

How do i make flutter application that open another app within it and not webview

I have tried to make flutter app in which within it I have a list of another application. I want on tap of any app within a list to open that app, like the code below. How to do it in flutter ?
openExternalApp : function(packageName) {
try {
var KonyMain = java.import("com.konylabs.android.KonyMain");
var context = KonyMain.getAppContext();
var pm = KonyMain.getAppContext().getPackageManager();
var intent = pm.getLaunchIntentForPackage(packageName);
if(intent !== null && intent!== undefined){
context.startActivity(intent);
}
else {
var url = "https://play.google.com/store/apps/details?id="+packageName;
kony.application.openURL(url);
}
} catch(e) {
kony.print("error opening app external: "+e)
}
}
If i understood correctly you want to do something like kindle which allows the user to open a book (in this case an app) directly from your app.
That being the case, maybe this package can help you https://pub.dev/packages/device_apps
to check for installed apps List<Application> apps = await DeviceApps.getInstalledApplications();
and to launch the app DeviceApps.openApp('package.name');
This package currently only supports android.

Get and show live data from cordova plugin in ionic 4 page

im trying to code a simple step counter app, im using this plugin (https://github.com/leecrossley/cordova-plugin-pedometer) in android to get the step counter data, so i want to get this data and show it on my ionic page (front end view), i tryed to use ngZone to refresh the object while the method subscribe to the startPedometerUpdates function, but it takes many seconds to work and sometimes stucks few seconds and then start to show the counter again...
this is my code:
steps: any = []
constructor(private ngZone: NgZone, private pedometer: Pedometer) { }
ngOnInit() {
}
getSteps(){
this.pedometer.startPedometerUpdates()
.subscribe((data: IPedometerData) => {
this.ngZone.run(() => this.steps.push(data))
});
}
my html is simple for debug the data:
<ion-content>
{{this.steps | json}}
<ion-button (click)="getSteps()">Show steps</ion-button>
</ion-content>
so i want to show the data in "real time" with something simple as posible...
thanks in advance
you can't push data in subscribe even if you using NgZone bcoz push is a function ngZone doesn't work in the function
steps: any = []
constructor(private ngZone: NgZone, private pedometer: Pedometer) {
this.getSteps();
setInterval(()=>{
console.log('read in a sec')
},1000)
}
ngOnInit() {
}
getSteps(){
this.pedometer.startPedometerUpdates()
.subscribe((data: IPedometerData) => {
this.ngZone.run(() => this.steps.push(data))
});
}

Tracking all screens using Google Analytics in Ionic 3 project

I'm in the middle of finalizing an Ionic 3 build and would like to add Google Analytics to it. I added it successfully and can see in GA (real time) that the app is being used however I would like to track all page/screen views. Does anyone know of way to do that?
I'm using the following plugin: https://github.com/danwilson/google-analytics-plugin
Here is the code I am using to initialize GA
initGoogleAnalytics() {
var trackingId = 'UA-114720506-2';
if (/(android)/i.test(navigator.userAgent)) { // for android
trackingId = 'UA-114720506-2';
} else if (/(ipod|iphone|ipad)/i.test(navigator.userAgent)) { // for ios
trackingId = 'UA-114720506-2';
}
//platform is injected in the Constructor
this.platform.ready().then(() => {
this.ga.debugMode();
this.ga.startTrackerWithId(trackingId).then(()=> {
console.log("GoogleAnalytics Initialized with ****** : " + trackingId);
this.ga.trackView('schedule');
this.ga.trackView('speakerList');
this.ga.trackView('map');
this.ga.trackView('social');
this.ga.trackView('exhibitors');
this.ga.enableUncaughtExceptionReporting(true)
.then((_success) => {
console.log("GoogleAnalytics enableUncaughtExceptionReporting Enabled.");
}).catch((_error) => {
console.log("GoogleAnalytics Error enableUncaughtExceptionReporting : " + _error)
});
});
});
}
Essentially adding in the GA Module and initializing with ionViewDidEnter on in every page that I wanted to track did the trick.

implement Push Notifications in Ionic 2 with the Pub/Sub Model

Hi this is a duplicate of the question at
Push Notifications in Ionic 2 with the Pub/Sub Model
i have already implemented push notifications following this article >
https://medium.com/#ankushaggarwal/push-notifications-in-ionic-2-658461108c59#.xvoeao59a
what i want is to be able to send notifications to users when some events take place in the app like chat or booking or new job post.
how to go further , this is my first app.
NOTE: code is almost exactly the same as the tutorial, Java has only been converted to Kotlin
This is my acutal ionic side code (on login page). The push.on('registration') will be fired when the user opens the app, the variable this.device_id will later (on succesfull login) be sent to my Kotlin REST API so I know the device_id and have coupled it to a user. This way you can send targeted push notifications.
If you send a push notification from Kotlin (code shown below, looks a bit like Java), the (always open, even opens after startup) connection to Google will send your device (defined by the device_id a message with the notification data (title, message, etc.) after which your device will recognize the senderID and match it to use your ionic application.
initializeApp() {
this.platform.ready().then(() => {
let push = Push.init({
android: {
senderID: "1234567890"
},
ios: {
alert: "true",
badge: false,
sound: "true"
},
windows: {}
});
//TODO - after login
push.on('registration', (data) => {
this.device_id = data.registrationId;
});
push.on('notification', (data) => {
console.log('message', data.message);
let self = this;
//if user using app and push notification comes
if (data.additionalData.foreground) {
// if application open, show popup
let confirmAlert = this.alertCtrl.create({
title: data.title,
message: data.message,
buttons: [{
text: 'Negeer',
role: 'cancel'
}, {
text: 'Bekijk',
handler: () => {
//TODO: Your logic here
this.navCtrl.setRoot(EventsPage, {message: data.message});
}
}]
});
confirmAlert.present();
} else {
//if user NOT using app and push notification comes
//TODO: Your logic on click of push notification directly
this.navCtrl.setRoot(EventsPage, {message: data.message});
console.log("Push notification clicked");
}
});
push.on('error', (e) => {
console.log(e.message);
});
});
}
Kotlin code (converted from the Java example, basically the same
package mycompany.rest.controller
import mycompany.rest.domain.User
import java.io.OutputStream
import java.net.HttpURLConnection
import java.net.URL
class PushNotification {
companion object {
val SERVER_KEY = "sOmE_w31rD_F1r3Ba5E-KEy";
#JvmStatic fun sendPush(user: User, message: String, title: String) {
if(user.deviceId != "unknown"){
val pushMessage = "{\"data\":{\"title\":\"" +
title +
"\",\"message\":\"" +
message +
"\"},\"to\":\"" +
user.deviceId +
"\"}";
val url: URL = URL("https://fcm.googleapis.com/fcm/send")
val conn: HttpURLConnection = url.openConnection() as HttpURLConnection
conn.setRequestProperty("Authorization", "key=" + SERVER_KEY)
conn.setRequestProperty("Content-Type", "application/json")
conn.setRequestMethod("POST")
conn.setDoOutput(true)
//send the message content
val outputStream: OutputStream = conn.getOutputStream()
outputStream.write(pushMessage.toByteArray())
println(conn.responseCode)
println(conn.responseMessage)
}else {
println("Nope, not executed")
}
}
#JvmStatic fun sendPush(users: List<User>, message: String, title: String) {
for(u in users) {
PushNotification.sendPush(u, message, title)
}
}
}
}
Then the method can be called as PushNotification.sendPush(user1, "Hello world!", "my title");
(btw realized you won't need to run the pushnotification from a server (localhost/external). You can just create a main class which sends it with your hardcoded deviceId for testing purposes.