I am developing an android app using react-native, i want to use local push notification for that, like whenever i click on button, push notification should create. how can i do this?
someone please suggest me something.
You could try this with react-native-push-notification
import PushNotification from 'react-native-push-notification';
scheduleNotfication() {
PushNotification.localNotificationSchedule({
message: "My Notification Message", // message
date: new Date(Date.now() + (60 * 1000)) // your required time
});
}
Button
<Button title="title of button" onPress ={this.scheduleNotfication() } >
<Text>show</Text>
</Button>
import React, { Component } from 'react';
import {
AppRegistry,
StyleSheet,
Text,
View,
Button,
TouchableHighlight
} from 'react-native';
import PushNotification from 'react-native-push-notification';
export default class pn extends Component {
scheduleNotfication() {
PushNotification.localNotificationSchedule({
message: "My Notification Message", // message
date: new Date(Date.now() + (60 * 1000)) // your required time
});
}
render() {
return (
<View>
<TouchableHighlight onPress ={this.scheduleNotfication.bind(this) } >
<Text>show</Text>
</TouchableHighlight>
</View>
);
}
}
AppRegistry.registerComponent('pn', () => pn);
This is working perfect and getting local Push Notification for certain time.
You can also try
react-native-notifications
It helps you in local as well as a remote push notification.
1.Remote (push) notifications
2.Local notifications
3.Background/Managed notifications (notifications that can be cleared from the server, like Facebook messenger and Whatsapp web)
4.PushKit API (for VoIP and other background messages)
5.Interactive notifications (allows you to provide additional functionality to your users outside of your application such as action buttons)
Code snippets -->
import React, { Component } from 'react';
import {
AppRegistry,
StyleSheet,
Text,
View,
Button,
TouchableHighlight
} from 'react-native';
import {NotificationsAndroid} from 'react-native-notifications';
export default class pushLocalNotification extends Component {
get_Local_Notfication() {
NotificationsAndroid.localNotification({
title: "Local notification",
body: "This notification was generated by the app!",
extra: "data"
});
}
render() {
return (
<View>
<TouchableHighlight onPress =
{this.get_Local_Notfication.bind(this) } >
<Text>show</Text>
</TouchableHighlight>
</View>
);
}
}
AppRegistry.registerComponent('pushLocalNotification', () =>
pushLocalNotification);
This is working perfectly for me.
Related
I am creating a react native app and i want to send automatic email onpress
i did this in reactjs it is working fine but when applied this in react native, it is not working please tell me how to use in react native
import { View, Text, Button } from 'react-native'
import React from 'react'
import emailjs from '#emailjs/nodejs';
export default function App() {
function emailer() {
const templateParams = {
name: 'James',
notes: 'Check this out!',
};
emailjs
.send('service_hw72nhc','template_h5zuoxb', templateParams, {
publicKey: 'AYhHEr8nhLs3irJSN',
privateKey: '_6ql6C0rLYo1aWnsCaxKD', // optional, highly recommended for security reasons
})
.then(
(response) => {
console.log('SUCCESS!', response.status, response.text);
},
(err) => {
console.log('FAILED...', err);
},
);
console.log("buton pressed")
}
return (
<View style={{justifyContent:'center', alignItems:'center'}}>
<Button title='Send Email' onPress={emailer} />
</View>
)
}
I have tried this now please help
I've tried everything to get push notifications for Android to work with Pinpoint in my react native app.
The iOS integration works as expected.
In android, i'm able to record the endpoint, but when I export the endpoint from pinpoint, I can see that the field that controls push notification--OptOut--is set to ALL.
This is the integration that I have in my App.js to record the endpoints:
import React, {Component} from 'react';
import { StyleSheet, View, PushNotificationIOS, AsyncStorage, Text } from 'react-native'
//aws
import Amplify, { Auth } from 'aws-amplify'
import aws_exports from './aws-exports'
import PushNotification from '#aws-amplify/pushnotification'
Analytics.configure(aws_exports);
Amplify.configure(aws_exports)
console.log('exports',aws_exports)
PushNotification.configure(aws_exports);
type Props = {};
class App extends Component<Props> {
componentDidMount(){
console.log(PushNotification)
// get the notification data when notification is received
PushNotification.onNotification((notification) => {
// Note that the notification object structure is different from Android and IOS
console.log('in app notification', notification);
// required on iOS only (see fetchCompletionHandler docs: https://facebook.github.io/react-native/docs/pushnotificationios.html)
notification.finish(PushNotificationIOS.FetchResult.NoData);
});
// get the registration token
// This will only be triggered when the token is generated or updated.
PushNotification.onRegister((token) => {
console.log('in app registration', token);
});
}
render() {
...
}
}
export default codePush(codePushOptions)(App)
I am currently using the headless task to receive a push notification and show the local notification. I am currently using react-native-firebase to integrate firebase cloud messaging.
export default bgMessaging = (message) => {
console.log('hello', message)
return Promise.resolve();
}
This is the piece of code which I am using to create task.
And in index.js
AppRegistry.registerHeadlessTask('RNFirebaseBackgroundMessage', () => bgMessaging);
I am using this to registerHeadlessTask.
But when the app is in the killed state I am not getting any console message and don't if my task is running.
Need help to know how can I debug the background task and show custom notification for the killed state.
I solved it as follows:
// index.js
import { AppRegistry, Alert } from 'react-native';
import messaging from '#react-native-firebase/messaging';
import App from './App';
import { name as appName } from './app.json';
messaging().setBackgroundMessageHandler(async remoteMessage => {
console.log('Message handled in the background!', remoteMessage);
});
//receive the message in the background
messaging().onMessage(async teste => {
console.log('teste:', teste);
const novo = (title, message) => {
return Alert.alert(title, message);
};
novo(teste.notification.title, teste.notification.body);
});
AppRegistry.registerComponent(appName, () => App);
This is because we have to validate when the push message arrives in the background in the app
I'm doing an task for listening message (even in background) and show it on UI.
I have done in listening messages real time. But if the app is in background, it doesn't receive messages in that time.
I ask for any ideas, helps.
I searched HeadlessJS, react-native-background-task but not work for me.
Actually, i want to run this app even in Background and Foreground.
Thank you for advanced.
It's my code until now
index.android.js
//Import libraries
import React, { Component } from 'react';
import {
AppRegistry,
Text
} from 'react-native';
import SmsListener from 'react-native-android-sms-listener';
//Main component
export default class Main extends Component {
state = {
lastMessage: ''
}
//Receive messages
listen = SmsListener.addListener(message => {
this.setState({ lastMessage: message.body });
console.log('message');
})
//render UI
render() {
return (
<Text> Message is: {this.state.lastMessage} </Text>
);
}
}
//Register component
AppRegistry.registerComponent('ReadMessageApp', () => Main);
I'm facing a really troubling issue with my React Native app and Pushwoosh.
If I close my app completely and send a notification from Pushwoosh control panel, it appears, I tap on it on my phone and my app receive push info.
But if my app is in background (for example, I've already opened it and just press "Home" button on my phone) and I send the notificacion from control panel, it appears, I tap on it BUT my app won't receive any push data.
It seems like onPushHandler function is being unregistered if my app is in background.
Here is my code (I removed a lot of useless code for this purpose):
import React, {
Component,
} from 'react';
import {
AppRegistry,
} from 'react-native';
class App extends Component {
constructor(props) {
super(props);
this.state = {};
this.pushHandler = this.pushHandler.bind(this);
}
componentDidMount() {
Pushwoosh.init(/* myconfig */);
Pushwoosh.register(
(token) => {
console.log('✓ Registered for pushes');
},
(error) => {
console.error('Failed to register: ' + error);
}
);
Pushwoosh.onPushOpen(this.pushHandler);
}
render() {
return (
<View><Text>Test</Text></View>
);
}
pushHandler(pushData) {
console.log(pushData);
Pushwoosh.onPushOpen(this.pushHandler);
}
}
AppRegistry.registerComponent('MyApp', () => App);