7be915c8.9ed05cc3.js

(window.webpackJsonp=window.webpackJsonp||[]).push([[20],{107:function(e,t,n){"use strict";n.r(t),n.d(t,"frontMatter",(function(){return m})),n.d(t,"metadata",(function(){return h})),n.d(t,"rightToc",(function(){return g})),n.d(t,"default",(function(){return O}));var a=n(3),i=n(8),o=n(0),c=n.n(o),r=n(111),s=n(140),l=n(113),p=n(89),b=n.n(p);const A=37,d=39;var u=function(e){const{lazy:t,block:n,children:a,defaultValue:i,values:r,groupId:p,className:u}=e,{tabGroupChoices:f,setTabGroupChoices:m}=Object(s.a)(),[h,g]=Object(o.useState)(i);if(null!=p){const e=f[p];null!=e&&e!==h&&r.some((t=>t.value===e))&&g(e)}const j=e=>{g(e),null!=p&&m(p,e)},O=[];return c.a.createElement("div",null,c.a.createElement("ul",{role:"tablist","aria-orientation":"horizontal",className:Object(l.a)("tabs",{"tabs--block":n},u)},r.map((({value:e,label:t})=>c.a.createElement("li",{role:"tab",tabIndex:0,"aria-selected":h===e,className:Object(l.a)("tabs__item",b.a.tabItem,{"tabs__item--active":h===e}),key:e,ref:e=>O.push(e),onKeyDown:e=>{((e,t,n)=>{switch(n.keyCode){case d:((e,t)=>{const n=e.indexOf(t)+1;e[n]?e[n].focus():e[0].focus()})(e,t);break;case A:((e,t)=>{const n=e.indexOf(t)-1;e[n]?e[n].focus():e[e.length-1].focus()})(e,t)}})(O,e.target,e)},onFocus:()=>j(e),onClick:()=>{j(e)}},t)))),t?Object(o.cloneElement)(a.filter((e=>e.props.value===h))[0],{className:"margin-vert--md"}):c.a.createElement("div",{className:"margin-vert--md"},a.map(((e,t)=>Object(o.cloneElement)(e,{key:t,hidden:e.props.value!==h})))))};var f=function({children:e,hidden:t,className:n}){return c.a.createElement("div",Object(a.a)({role:"tabpanel"},{hidden:t,className:n}),e)},m={id:"notif-00",title:"Push Notification with Amplify",sidebar_label:"Push Notification"},h={unversionedId:"notif-00",id:"notif-00",isDocsHomePage:!1,title:"Push Notification with Amplify",description:"Push notifications play an essential role in any Application. It can considerably increase the user engagement, and it might be an asked feature from the end-user.",source:"@site/docs/notif00.md",slug:"/notif-00",permalink:"/docs/notif-00",editUrl:"https://github.com/facebook/docusaurus/edit/master/website/docs/notif00.md",version:"current",sidebar_label:"Push Notification",sidebar:"someSidebar",previous:{title:"DataStore - CRUD (Create Read Update Delete)",permalink:"/docs/amplify-04"}},g=[{value:"Create a new project",id:"create-a-new-project",children:[{value:"Android - Setting up the Firebase",id:"android---setting-up-the-firebase",children:[]}]},{value:"Setting up the Amplify for FCM",id:"setting-up-the-amplify-for-fcm",children:[]},{value:"iOS - Setup",id:"ios---setup",children:[{value:"Configure App",id:"configure-app",children:[]}]},{value:"Working with API",id:"working-with-api",children:[]},{value:"onRegister",id:"onregister",children:[]},{value:"onNotification",id:"onnotification",children:[]},{value:"onNotificationOpened",id:"onnotificationopened",children:[]},{value:"requestIOSPermissions",id:"requestiospermissions",children:[]},{value:"Testing",id:"testing",children:[]},{value:"Done \u2705",id:"done-",children:[]},{value:"References:",id:"references",children:[]}],j={rightToc:g};function O(e){var t=e.components,o=Object(i.a)(e,["components"]);return Object(r.b)("wrapper",Object(a.a)({},j,o,{components:t,mdxType:"MDXLayout"}),Object(r.b)("p",null,"Push notifications play an essential role in any Application. It can considerably increase the user engagement, and it might be an asked feature from the end-user."),Object(r.b)("p",null,Object(r.b)("img",{alt:"Push Notifications",src:n(259).default})),Object(r.b)("p",null,"Setting up a push notification from scratch can be a bit challenging. Fortunately, the Amplify provides the push notification services and SDK for our apps. In this tutorial, we learn how to integrate our app with this service."),Object(r.b)("p",null,Object(r.b)("img",{alt:"Step01",src:n(116).default})),Object(r.b)("h2",{id:"create-a-new-project"},"Create a new project"),Object(r.b)("p",null,"Whether you are going to implement only for IOS or Android, the following steps are required. If you are not working on a project, then the first step is creating one by the following command:"),Object(r.b)("pre",null,Object(r.b)("code",Object(a.a)({parentName:"pre"},{className:"language-bash"}),"npx react-native init amplifyPush\n")),Object(r.b)("pre",null,Object(r.b)("code",Object(a.a)({parentName:"pre"},{className:"language-bash"}),"cd amplifyPush\n")),Object(r.b)("p",null,"Initialize our AWS Amplify project in the root directory."),Object(r.b)("pre",null,Object(r.b)("code",Object(a.a)({parentName:"pre"},{className:"language-bash"}),"amplify init\n")),Object(r.b)("p",null,"Here is how the answers can be:"),Object(r.b)("p",null,Object(r.b)("img",{alt:"Initialize Amplify",src:n(260).default})),Object(r.b)("ul",null,Object(r.b)("li",{parentName:"ul"},"Add the required dependencies with:")),Object(r.b)("pre",null,Object(r.b)("code",Object(a.a)({parentName:"pre"},{className:"language-bash"}),"npm install --save aws-amplify @aws-amplify/pushnotification\n")),Object(r.b)("p",null,"or"),Object(r.b)("pre",null,Object(r.b)("code",Object(a.a)({parentName:"pre"},{className:"language-bash"}),"yarn add aws-amplify @aws-amplify/pushnotification\n")),Object(r.b)("p",null,"You need to link the push notification dependency with:"),Object(r.b)("pre",null,Object(r.b)("code",Object(a.a)({parentName:"pre"},{className:"language-bash"}),"react-native link @aws-amplify/pushnotification\n")),Object(r.b)("div",{className:"admonition admonition-caution alert alert--warning"},Object(r.b)("div",Object(a.a)({parentName:"div"},{className:"admonition-heading"}),Object(r.b)("h5",{parentName:"div"},Object(r.b)("span",Object(a.a)({parentName:"h5"},{className:"admonition-icon"}),Object(r.b)("svg",Object(a.a)({parentName:"span"},{xmlns:"http://www.w3.org/2000/svg",width:"16",height:"16",viewBox:"0 0 16 16"}),Object(r.b)("path",Object(a.a)({parentName:"svg"},{fillRule:"evenodd",d:"M8.893 1.5c-.183-.31-.52-.5-.887-.5s-.703.19-.886.5L.138 13.499a.98.98 0 0 0 0 1.001c.193.31.53.501.886.501h13.964c.367 0 .704-.19.877-.5a1.03 1.03 0 0 0 .01-1.002L8.893 1.5zm.133 11.497H6.987v-2.003h2.039v2.003zm0-3.004H6.987V5.987h2.039v4.006z"})))),"caution")),Object(r.b)("div",Object(a.a)({parentName:"div"},{className:"admonition-content"}),Object(r.b)("p",{parentName:"div"},"To prevent an ",Object(r.b)("a",Object(a.a)({parentName:"p"},{href:"https://github.com/aws-amplify/amplify-js/issues/5010"}),"error")," in the future add the ",Object(r.b)("inlineCode",{parentName:"p"},"netinfo")," library. You can add it to your project by the following command (in case your don't have it):"),Object(r.b)("pre",{parentName:"div"},Object(r.b)("code",Object(a.a)({parentName:"pre"},{className:"language-bash"}),"npm install --save @react-native-community/netinfo\n")),Object(r.b)("pre",{parentName:"div"},Object(r.b)("code",Object(a.a)({parentName:"pre"},{className:"language-bash"}),"yarn add @react-native-community/netinfo\n")))),Object(r.b)("p",null,Object(r.b)("img",{alt:"Step02",src:n(117).default})),Object(r.b)("h3",{id:"android---setting-up-the-firebase"},"Android - Setting up the Firebase"),Object(r.b)("ol",null,Object(r.b)("li",{parentName:"ol"},"Open the ",Object(r.b)("a",Object(a.a)({parentName:"li"},{href:"https://console.firebase.google.com/"}),"Firebase console"),"."),Object(r.b)("li",{parentName:"ol"},"Open or create a project for further steps."),Object(r.b)("li",{parentName:"ol"},"Select the ",Object(r.b)("inlineCode",{parentName:"li"},"Cloud Messaging")," in the dashboard.")),Object(r.b)("p",null,Object(r.b)("img",{alt:"Cloud Messaging",src:n(261).default})),Object(r.b)("ol",{start:4},Object(r.b)("li",{parentName:"ol"},"Click on the Android and follow the following steps:")),Object(r.b)("ul",null,Object(r.b)("li",{parentName:"ul"},"Fill in the form and register the app. ",Object(r.b)("inlineCode",{parentName:"li"},"Android package name")," can be found in ",Object(r.b)("inlineCode",{parentName:"li"},"android/app/build.gradle"),". It is stored as ",Object(r.b)("inlineCode",{parentName:"li"},"applicationId")," like this:")),Object(r.b)("pre",null,Object(r.b)("code",Object(a.a)({parentName:"pre"},{className:"language-java"}),'   gradle title="android/app/build.gradle"\n      defaultConfig {\n       applicationId "com.amplifypush"\n      }\n')),Object(r.b)("ul",null,Object(r.b)("li",{parentName:"ul"},"Download the config file to ",Object(r.b)("inlineCode",{parentName:"li"},"android/app")," directory of the project."),Object(r.b)("li",{parentName:"ul"},"Add the Firebase SDK as the instructions. Consider the ",Object(r.b)("inlineCode",{parentName:"li"},"<project>")," the ",Object(r.b)("inlineCode",{parentName:"li"},"android")," and ",Object(r.b)("inlineCode",{parentName:"li"},"<app-module>")," the ",Object(r.b)("inlineCode",{parentName:"li"},"app")," directory in the react native project. Don't forget to add the latest version of ",Object(r.b)("inlineCode",{parentName:"li"},"firebase-messaging")," from ",Object(r.b)("a",Object(a.a)({parentName:"li"},{href:"https://firebase.google.com/docs/android/setup#available-libraries"}),"here")," as well ad the ",Object(r.b)("inlineCode",{parentName:"li"},"firebase-analytics")," in ",Object(r.b)("inlineCode",{parentName:"li"},"dependencies"),"."),Object(r.b)("li",{parentName:"ul"},"Run the project in Android and you will see that the verification of Firebase. (you can skip this step)"),Object(r.b)("li",{parentName:"ul"},"Open the ",Object(r.b)("inlineCode",{parentName:"li"},"android/app/src/main/AndroidManifest.xml")," and add the following code in the ",Object(r.b)("inlineCode",{parentName:"li"},"application")," element:")),Object(r.b)("pre",null,Object(r.b)("code",Object(a.a)({parentName:"pre"},{className:"language-java"}),'xml title="android/app/src/main/AndroidManifest.xml"\n\x3c!--[START Push notification config --\x3e\n        \x3c!-- [START firebase_service] --\x3e\n        <service\n            android:name="com.amazonaws.amplify.pushnotification.RNPushNotificationMessagingService">\n            <intent-filter>\n                <action android:name="com.google.firebase.MESSAGING_EVENT"/>\n            </intent-filter>\n        </service>\n        \x3c!-- [END firebase_service] --\x3e\n        \x3c!-- [START firebase_iid_service] --\x3e\n        <service\n            android:name="com.amazonaws.amplify.pushnotification.RNPushNotificationDeviceIDService">\n            <intent-filter>\n                <action android:name="com.google.firebase.INSTANCE_ID_EVENT"/>\n            </intent-filter>\n        </service>\n        <receiver\n            android:name="com.amazonaws.amplify.pushnotification.modules.RNPushNotificationBroadcastReceiver"\n            android:exported="false" >\n            <intent-filter>\n                <action android:name="com.amazonaws.amplify.pushnotification.NOTIFICATION_OPENED"/>\n            </intent-filter>\n        </receiver>\n    \x3c!-- [END Push notification config --\x3e\n')),Object(r.b)("p",null,Object(r.b)("img",{alt:"Step03",src:n(120).default})),Object(r.b)("h2",{id:"setting-up-the-amplify-for-fcm"},"Setting up the Amplify for FCM"),Object(r.b)("ol",null,Object(r.b)("li",{parentName:"ol"},"Add the push notification service to amplify by the following command in the project directory:")),Object(r.b)("pre",null,Object(r.b)("code",Object(a.a)({parentName:"pre"},{className:"language-bash"})," amplify add notifications\n")),Object(r.b)("ol",{start:2},Object(r.b)("li",{parentName:"ol"},"Choose ",Object(r.b)("inlineCode",{parentName:"li"},"FCM")," when promoted:")),Object(r.b)("pre",null,Object(r.b)("code",Object(a.a)({parentName:"pre"},{className:"language-bash"})," ? Choose the push notification channel to enable.\n APNS\n \u276f FCM\n Email\n SMS\n")),Object(r.b)("ol",{start:3},Object(r.b)("li",{parentName:"ol"},"Fill the pinpoint resource name (or just press enter without filling anything)."),Object(r.b)("li",{parentName:"ol"},"You will be asked for ",Object(r.b)("inlineCode",{parentName:"li"},"ApiKey"),". For getting that, you should do the following steps:")),Object(r.b)("ul",null,Object(r.b)("li",{parentName:"ul"},"Open the ",Object(r.b)("a",Object(a.a)({parentName:"li"},{href:"https://console.firebase.google.com/"}),"Firebase console")," and open the app you created in previous steps."),Object(r.b)("li",{parentName:"ul"},"Click on the gear icon in the ",Object(r.b)("inlineCode",{parentName:"li"},"Project Overview")," section of the dashboard and select the ",Object(r.b)("inlineCode",{parentName:"li"},"Project settings"),".")),Object(r.b)("p",null,Object(r.b)("img",{alt:"Project settings",src:n(262).default})),Object(r.b)("ul",null,Object(r.b)("li",{parentName:"ul"},"Select the ",Object(r.b)("inlineCode",{parentName:"li"},"Cloud Messaging")," tab and copy the value of the ",Object(r.b)("inlineCode",{parentName:"li"},"Server key"),".")),Object(r.b)("p",null,Object(r.b)("img",{alt:"Project settings",src:n(263).default})),Object(r.b)("ol",{start:5},Object(r.b)("li",{parentName:"ol"},"Paste the value for requested ",Object(r.b)("inlineCode",{parentName:"li"},"ApiKey"),"."),Object(r.b)("li",{parentName:"ol"},"After the setup is completed, run the ",Object(r.b)("inlineCode",{parentName:"li"},"amplify push")," command.")),Object(r.b)("p",null,Object(r.b)("img",{alt:"Step04",src:n(121).default})),Object(r.b)("h2",{id:"ios---setup"},"iOS - Setup"),Object(r.b)("ol",null,Object(r.b)("li",{parentName:"ol"},"Add the ",Object(r.b)("inlineCode",{parentName:"li"},"@react-native-community/push-notification-ios")," by the following command:")),Object(r.b)(u,{defaultValue:"yarn",values:[{label:"yarn",value:"yarn"},{label:"npm",value:"npm"}],mdxType:"Tabs"},Object(r.b)(f,{value:"yarn",mdxType:"TabItem"},Object(r.b)("pre",null,Object(r.b)("code",Object(a.a)({parentName:"pre"},{className:"language-bash"}),"yarn add @react-native-community/push-notification-ios`\n"))),Object(r.b)(f,{value:"npm",mdxType:"TabItem"},Object(r.b)("pre",null,Object(r.b)("code",Object(a.a)({parentName:"pre"},{className:"language-bash"}),"npm install --save @react-native-community/push-notification-ios\n")))),"2. Run the following commands: ```bash cd ios && pod install && cd .. ``` 3. Add the notifications to the amply for iOS by `amplify add notifications` command:",Object(r.b)("pre",null,Object(r.b)("code",Object(a.a)({parentName:"pre"},{}),"1. Choose `APNS` when promoted:\n ```bash\n ? Choose the push notification channel to enable.\n    > APNS\n    FCM\n    Email\n    SMS\n ```\n2. Then you will be prompted for the authentication method. It is recommended to choose the certificate.\n\n ```bash\n? Choose authentication method used for APNs (Use arrow keys)\n> Certificate\nKey\n ```\n\n3. If you have chosen the certificate, then you will be prompted for the .p12 certificate path file. (You can use this [tutorial](https://mobincube.zendesk.com/hc/en-us/articles/200511933-How-to-get-the-p12-file-and-provisioning-profile-for-publishing-an-app-on-App-Store) to get that).\n")),Object(r.b)("ol",{start:4},Object(r.b)("li",{parentName:"ol"},Object(r.b)("p",{parentName:"li"},"Run ",Object(r.b)("inlineCode",{parentName:"p"},"amplify push"),".")),Object(r.b)("li",{parentName:"ol"},Object(r.b)("p",{parentName:"li"},"Open the ",Object(r.b)("inlineCode",{parentName:"p"},".xcworkspace")," project with the XCode.")),Object(r.b)("li",{parentName:"ol"},Object(r.b)("p",{parentName:"li"},"Select the project and select the project name in ",Object(r.b)("inlineCode",{parentName:"p"},"TARGETS")," section. Select the ",Object(r.b)("inlineCode",{parentName:"p"},"Signing & Capabilities")," and press the ",Object(r.b)("inlineCode",{parentName:"p"},"+")," before the ",Object(r.b)("inlineCode",{parentName:"p"},"Capability"),". Choose ",Object(r.b)("inlineCode",{parentName:"p"},"Background Mode - Remote Notifications"),"."))),Object(r.b)("p",null,Object(r.b)("img",{alt:"Step05",src:n(122).default})),Object(r.b)("h3",{id:"configure-app"},"Configure App"),Object(r.b)("p",null,"As it was told before, The ",Object(r.b)("inlineCode",{parentName:"p"},"Analytics")," should be integrated along with the notifications. It will help to track the notifications. Though it is possible to use custom properties, It is advised to use the ",Object(r.b)("inlineCode",{parentName:"p"},"aws-exports")," file.\nin ",Object(r.b)("inlineCode",{parentName:"p"},"App.js")," file add the configuration as follow:"),Object(r.b)("pre",null,Object(r.b)("code",Object(a.a)({parentName:"pre"},{className:"language-js"}),"...\nimport Amplify from 'aws-amplify';\nimport PushNotification from '@aws-amplify/pushnotification';\nimport awsconfig from './aws-exports';\n\nAmplify.configure(awsconfig);\n\nPushNotification.configure(awsconfig);\n...\n")),Object(r.b)("p",null,Object(r.b)("img",{alt:"Step06",src:n(123).default})),Object(r.b)("h2",{id:"working-with-api"},"Working with API"),Object(r.b)("p",null,"Usually, what we want is sending push notifications to specific users for various purposes. The API gives us various methods for handling our users & push notifications."),Object(r.b)("h2",{id:"onregister"},"onRegister"),Object(r.b)("p",null,"Each device can be recognized by the push token by which you can specify the device you want to get a push notification. When the user opens the app for the first time, the pushed token is fetched and stored in the device. You should be aware of the fact this method may get called again in the future, so you should be prepared for this situation to update your data according to it."),Object(r.b)("p",null,"You can add the following code in ",Object(r.b)("inlineCode",{parentName:"p"},"App.js"),":"),Object(r.b)("pre",null,Object(r.b)("code",Object(a.a)({parentName:"pre"},{className:"language-js"}),"PushNotification.onRegister(token => {\n  console.log('in app registration', token)\n  PushNotification.updateEndpoint(token)\n})\n")),Object(r.b)("div",{className:"admonition admonition-caution alert alert--warning"},Object(r.b)("div",Object(a.a)({parentName:"div"},{className:"admonition-heading"}),Object(r.b)("h5",{parentName:"div"},Object(r.b)("span",Object(a.a)({parentName:"h5"},{className:"admonition-icon"}),Object(r.b)("svg",Object(a.a)({parentName:"span"},{xmlns:"http://www.w3.org/2000/svg",width:"16",height:"16",viewBox:"0 0 16 16"}),Object(r.b)("path",Object(a.a)({parentName:"svg"},{fillRule:"evenodd",d:"M8.893 1.5c-.183-.31-.52-.5-.887-.5s-.703.19-.886.5L.138 13.499a.98.98 0 0 0 0 1.001c.193.31.53.501.886.501h13.964c.367 0 .704-.19.877-.5a1.03 1.03 0 0 0 .01-1.002L8.893 1.5zm.133 11.497H6.987v-2.003h2.039v2.003zm0-3.004H6.987V5.987h2.039v4.006z"})))),"Attention")),Object(r.b)("div",Object(a.a)({parentName:"div"},{className:"admonition-content"}),Object(r.b)("p",{parentName:"div"},"There can be an issue in android that this method never be called! However a ",Object(r.b)("a",Object(a.a)({parentName:"p"},{href:"https://github.com/aws-amplify/amplify-js/issues/2643#issuecomment-523610933"}),"workaround")," can be like this anywhere you might need the token:"),Object(r.b)("pre",{parentName:"div"},Object(r.b)("code",Object(a.a)({parentName:"pre"},{className:"language-js"}),"...\nimport {NativeModules} from 'react-native';\n...\nNativeModules.RNPushNotification.getToken((token) => {\n  console.log(`PushToken: ${token}`);\n});\n...\n")))),Object(r.b)("h2",{id:"onnotification"},"onNotification"),Object(r.b)("p",null,"In case you want to do something when the notification is recieved the ",Object(r.b)("inlineCode",{parentName:"p"},"onNotification")," method is for acting based on the recieved notification. Don't forget to that the notification object structure is diffrent from Android and IOS. In IOS, You ",Object(r.b)("a",Object(a.a)({parentName:"p"},{href:"https://reactnative.dev/docs/pushnotificationios.html#finish"}),"Should")," use the ",Object(r.b)("inlineCode",{parentName:"p"},"finish")," method. You can add the following code to ",Object(r.b)("inlineCode",{parentName:"p"},"App.js"),":"),Object(r.b)("pre",null,Object(r.b)("code",Object(a.a)({parentName:"pre"},{className:"language-js"}),"...\nimport PushNotificationIOS from '@react-native-community/push-notification-ios';\n...\nPushNotification.onNotification((notification) => {\n  console.log('in app notification', notification);\n  if (Platform.OS === 'ios') {\n    notification.finish(PushNotificationIOS.FetchResult.NoData);\n  }\n});\n")),Object(r.b)("h2",{id:"onnotificationopened"},"onNotificationOpened"),Object(r.b)("p",null,"A common scenario is reacting to when user opens a push notification (eg: opening a message etc). Whenever the user opens a push notification, the ",Object(r.b)("inlineCode",{parentName:"p"},"onNotificationOpened")," is called. The code can be in ",Object(r.b)("inlineCode",{parentName:"p"},"App.js")," as follow:"),Object(r.b)("pre",null,Object(r.b)("code",Object(a.a)({parentName:"pre"},{className:"language-js"}),"PushNotification.onNotificationOpened(notification => {\n  console.log('the notification is opened', notification)\n})\n")),Object(r.b)("h2",{id:"requestiospermissions"},"requestIOSPermissions"),Object(r.b)("p",null,"Push notification works only on a real device and it won't recieve any notification unless the end user give the permission. The ",Object(r.b)("inlineCode",{parentName:"p"},"requestIOSPermissions")," is for getting this permission. It either can be called without any parameters, or you can customize by an object as follows:"),Object(r.b)("pre",null,Object(r.b)("code",Object(a.a)({parentName:"pre"},{className:"language-js"}),"PushNotification.requestIOSPermissions()\n// or\nPushNotification.requestIOSPermissions({\n  alert: true,\n  badge: true,\n  sound: false\n})\n")),Object(r.b)("p",null,Object(r.b)("img",{alt:"Step07",src:n(124).default})),Object(r.b)("h2",{id:"testing"},"Testing"),Object(r.b)("p",null,"First of all, we want to take a look at the ",Object(r.b)("inlineCode",{parentName:"p"},"App.js")," file. Though you can work with the API anywhere in your code, It can be something like this:"),Object(r.b)("pre",null,Object(r.b)("code",Object(a.a)({parentName:"pre"},{className:"language-js"}),"import React from 'react'\nimport { SafeAreaView, Platform, Text, NativeModules } from 'react-native'\n\nimport PushNotificationIOS from '@react-native-community/push-notification-ios'\nimport Analytics from '@aws-amplify/analytics'\nimport Amplify from 'aws-amplify'\nimport PushNotification from '@aws-amplify/pushnotification'\nimport awsconfig from './aws-exports'\n\nAmplify.configure(awsconfig)\nPushNotification.configure(awsconfig)\n\nPushNotification.onRegister(async token => {\n  console.log('in app registration', token)\n  PushNotification.updateEndpoint(token)\n})\n\n// In case PushNotification.onRegister didn't work\nNativeModules.RNPushNotification.getToken(token => {\n  console.log(`PushToken: ${token}`)\n})\n\nPushNotification.onNotification(notification => {\n  console.log('in app notification', notification)\n  if (Platform.OS === 'ios') {\n    notification.finish(PushNotificationIOS.FetchResult.NoData)\n  }\n})\n\nPushNotification.onNotificationOpened(notification => {\n  console.log('the notification is opened', notification)\n})\n\nconst endpointId = Analytics.getPluggable('AWSPinpoint')._config.endpointId\nconsole.log(`endpoint ID: ${endpointId}`)\n\nif (Platform.OS === 'ios') {\n  PushNotification.requestIOSPermissions()\n}\n\nconst App: () => React$Node = () => {\n  return (\n    <SafeAreaView>\n      <Text>Push Notification</Text>\n    </SafeAreaView>\n  )\n}\n\nexport default App\n")),Object(r.b)("p",null,"Now we run our program:"),Object(r.b)("pre",null,Object(r.b)("code",Object(a.a)({parentName:"pre"},{className:"language-bash"}),"react-native run-android\n")),Object(r.b)("p",null,"To go further, we need one of the ",Object(r.b)("inlineCode",{parentName:"p"},"endpoint ID")," or ",Object(r.b)("inlineCode",{parentName:"p"},"Push Token"),".\n",Object(r.b)("a",Object(a.a)({parentName:"p"},{href:"https://docs.aws.amazon.com/pinpoint/latest/apireference/apps-application-id-endpoints.html"}),"Here")," is an explanation of ",Object(r.b)("inlineCode",{parentName:"p"},"endpoint")," in ",Object(r.b)("inlineCode",{parentName:"p"},"aws")," services:"),Object(r.b)("blockquote",null,Object(r.b)("p",{parentName:"blockquote"},"An endpoint represents a destination that you can send messages to, such as a mobile device, email address, or phone number.")),Object(r.b)("p",null,Object(r.b)("inlineCode",{parentName:"p"},"Push Token")," is a unique id, Which is generated and assigned by ",Object(r.b)("inlineCode",{parentName:"p"},"GCM"),"(Android) or ",Object(r.b)("inlineCode",{parentName:"p"},"APNS"),"(IOS) to your application in a specific device."),Object(r.b)("p",null,"The most apparent difference between these two is that the ",Object(r.b)("inlineCode",{parentName:"p"},"endpoint")," is generated from ",Object(r.b)("inlineCode",{parentName:"p"},"aws"),", and defines the app in a device regardless of the platform(IOS/Android). But the push token is generated either by the ",Object(r.b)("inlineCode",{parentName:"p"},"Apple")," or ",Object(r.b)("inlineCode",{parentName:"p"},"Google"),", depending on the platform."),Object(r.b)("p",null,"We use ",Object(r.b)("inlineCode",{parentName:"p"},"console.log")," to copy and keep these keys for the next steps. Go into the dev mode and copy the following values in your console:"),Object(r.b)("p",null,Object(r.b)("img",{alt:"Tokens",src:n(264).default})),Object(r.b)("p",null,"Although there are multiple ways to send a test push notification to a specific device, We're going to learn the easiest way possible."),Object(r.b)("ol",null,Object(r.b)("li",{parentName:"ol"},"Run the following command in the root of the project:")),Object(r.b)("pre",null,Object(r.b)("code",Object(a.a)({parentName:"pre"},{className:"language-bash"}),"amplify notification console\n")),Object(r.b)("ol",{start:2},Object(r.b)("li",{parentName:"ol"},Object(r.b)("p",{parentName:"li"},"The console of the app will be opened in the browser automatically.")),Object(r.b)("li",{parentName:"ol"},Object(r.b)("p",{parentName:"li"},"Select the ",Object(r.b)("inlineCode",{parentName:"p"},"Test messaging")," in the left sidebar:"))),Object(r.b)("p",null,Object(r.b)("img",{alt:"Test messaging",src:n(265).default})),Object(r.b)("ol",{start:4},Object(r.b)("li",{parentName:"ol"},Object(r.b)("p",{parentName:"li"},"In the ",Object(r.b)("inlineCode",{parentName:"p"},"Channel")," section, select the ",Object(r.b)("inlineCode",{parentName:"p"},"Push notifications"),".")),Object(r.b)("li",{parentName:"ol"},Object(r.b)("p",{parentName:"li"},"The ",Object(r.b)("inlineCode",{parentName:"p"},"Destinations")," section is as follow:"))),Object(r.b)("p",null,Object(r.b)("img",{alt:"Destinations",src:n(266).default})," 1. ",Object(r.b)("inlineCode",{parentName:"p"},"Destination type")," defines whether you want to use ",Object(r.b)("inlineCode",{parentName:"p"},"Endpoint IDs")," or ",Object(r.b)("inlineCode",{parentName:"p"},"Device Tokens"),"(or ",Object(r.b)("inlineCode",{parentName:"p"},"Push token")," in previous steps) in the next text input. 2. Paste the token you want to use, Based on the selected ",Object(r.b)("inlineCode",{parentName:"p"},"Destination type"),". 3. If you have chosen the ",Object(r.b)("inlineCode",{parentName:"p"},"Endpoint IDs")," and used endpoint, then the ",Object(r.b)("inlineCode",{parentName:"p"},"Push notifications service")," can automatically detect your device. Otherwise, if you have used ",Object(r.b)("inlineCode",{parentName:"p"},"Device token"),", for IOS, choose the ",Object(r.b)("inlineCode",{parentName:"p"},"APNS")," and for Android choose the ",Object(r.b)("inlineCode",{parentName:"p"},"FCM"),"."),Object(r.b)("ol",{start:6},Object(r.b)("li",{parentName:"ol"},"You can fill the ",Object(r.b)("inlineCode",{parentName:"li"},"Message")," section like below and press the ",Object(r.b)("inlineCode",{parentName:"li"},"Send message")," button.")),Object(r.b)("p",null,Object(r.b)("img",{alt:"Destinations",src:n(267).default})),Object(r.b)("ol",{start:7},Object(r.b)("li",{parentName:"ol"},"You will get a success message like below if everything is ok.")),Object(r.b)("p",null,Object(r.b)("img",{alt:"Success",src:n(268).default}),"\nAfter a couple of seconds, You will see the push notification in your device:"),Object(r.b)("p",null,Object(r.b)("img",{alt:"Push notification result",src:n(269).default})),Object(r.b)("h2",{id:"done-"},"Done \u2705"),Object(r.b)("h2",{id:"references"},"References:"),Object(r.b)("p",null,Object(r.b)("a",Object(a.a)({parentName:"p"},{href:"https://docs.amplify.aws/lib/push-notifications/getting-started/q/platform/js"}),"Amplify Docs")),Object(r.b)("p",null,Object(r.b)("a",Object(a.a)({parentName:"p"},{href:"https://medium.com/@dantasfiles/setting-up-android-push-notifications-with-aws-amplify-e6334c6356d8"}),"Setting up Android Push Notifications with AWS Amplify")),Object(r.b)("p",null,Object(r.b)("a",Object(a.a)({parentName:"p"},{href:"https://medium.com/@dantasfiles/testing-push-notifications-with-aws-amplify-9126bd621d3a"}),"Testing Push Notifications with AWS Amplify & CLI")),Object(r.b)("p",null,Object(r.b)("a",Object(a.a)({parentName:"p"},{href:"https://www.patreon.com/bePatron?u=34467235"}),Object(r.b)("img",{alt:"Become a Patron!",src:n(112).default}))))}O.isMDXComponent=!0},111:function(e,t,n){"use strict";n.d(t,"a",(function(){return b})),n.d(t,"b",(function(){return u}));var a=n(0),i=n.n(a);function o(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function c(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);t&&(a=a.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,a)}return n}function r(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?c(Object(n),!0).forEach((function(t){o(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):c(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function s(e,t){if(null==e)return{};var n,a,i=function(e,t){if(null==e)return{};var n,a,i={},o=Object.keys(e);for(a=0;a<o.length;a++)n=o[a],t.indexOf(n)>=0||(i[n]=e[n]);return i}(e,t);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);for(a=0;a<o.length;a++)n=o[a],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(i[n]=e[n])}return i}var l=i.a.createContext({}),p=function(e){var t=i.a.useContext(l),n=t;return e&&(n="function"==typeof e?e(t):r(r({},t),e)),n},b=function(e){var t=p(e.components);return i.a.createElement(l.Provider,{value:t},e.children)},A={inlineCode:"code",wrapper:function(e){var t=e.children;return i.a.createElement(i.a.Fragment,{},t)}},d=i.a.forwardRef((function(e,t){var n=e.components,a=e.mdxType,o=e.originalType,c=e.parentName,l=s(e,["components","mdxType","originalType","parentName"]),b=p(n),d=a,u=b["".concat(c,".").concat(d)]||b[d]||A[d]||o;return n?i.a.createElement(u,r(r({ref:t},l),{},{components:n})):i.a.createElement(u,r({ref:t},l))}));function u(e,t){var n=arguments,a=t&&t.mdxType;if("string"==typeof e||a){var o=n.length,c=new Array(o);c[0]=d;var r={};for(var s in t)hasOwnProperty.call(t,s)&&(r[s]=t[s]);r.originalType=e,r.mdxType="string"==typeof e?e:a,c[1]=r;for(var l=2;l<o;l++)c[l]=n[l];return i.a.createElement.apply(null,c)}return i.a.createElement.apply(null,n)}d.displayName="MDXCreateElement"},112:function(e,t,n){"use strict";n.r(t),t.default=n.p+"assets/images/patreon-15b4e66595efdb2e079faf18b89cff7c.png"},113:function(e,t,n){"use strict";function a(e){var t,n,i="";if("string"==typeof e||"number"==typeof e)i+=e;else if("object"==typeof e)if(Array.isArray(e))for(t=0;t<e.length;t++)e[t]&&(n=a(e[t]))&&(i&&(i+=" "),i+=n);else for(t in e)e[t]&&(i&&(i+=" "),i+=t);return i}t.a=function(){for(var e,t,n=0,i="";n<arguments.length;)(e=arguments[n++])&&(t=a(e))&&(i&&(i+=" "),i+=t);return i}},116:function(e,t,n){"use strict";n.r(t),t.default=n.p+"assets/images/01-a23cc15b10aa8903a2768742f2d5f639.png"},117:function(e,t,n){"use strict";n.r(t),t.default=n.p+"assets/images/02-d8f056a9ee77817d5fa34ed27b8a9ded.png"},120:function(e,t,n){"use strict";n.r(t),t.default=n.p+"assets/images/03-99e9f84b954c87f14c5b1c2a2fc7beb5.png"},121:function(e,t,n){"use strict";n.r(t),t.default=n.p+"assets/images/04-b7fa82403420155f5bc0c2e2b713251f.png"},122:function(e,t,n){"use strict";n.r(t),t.default=n.p+"assets/images/05-1c1a60851841e4476b56c3edf139208b.png"},123:function(e,t,n){"use strict";n.r(t),t.default=n.p+"assets/images/06-e6c67e52061de238f27f3c609644f4b9.png"},124:function(e,t,n){"use strict";n.r(t),t.default=n.p+"assets/images/07-8a3ce13813e6679ceb6d32560f619235.png"},140:function(e,t,n){"use strict";var a=n(0),i=n(141);t.a=function(){const e=Object(a.useContext)(i.a);if(null==e)throw new Error("`useUserPreferencesContext` is used outside of `Layout` Component.");return e}},141:function(e,t,n){"use strict";var a=n(0);const i=Object(a.createContext)(void 0);t.a=i},259:function(e,t,n){"use strict";n.r(t),t.default=n.p+"assets/images/00-bb54ea9c41331fb068a6a1494ebc205e.png"},260:function(e,t,n){"use strict";n.r(t),t.default=n.p+"assets/images/notif_amplify_init-4e19e5008a62f73e98596743ac4d8438.png"},261:function(e,t,n){"use strict";n.r(t),t.default=n.p+"assets/images/notif_cloud_messaging-752f4b952cad0854bddffcdc314a8458.png"},262:function(e,t,n){"use strict";n.r(t),t.default=n.p+"assets/images/notif_project_settings-0de4e5b72abb577cd4454925e75e3913.png"},263:function(e,t,n){"use strict";n.r(t),t.default=n.p+"assets/images/notif_api_key-272ca723ce4509852f36817b5648936c.png"},264:function(e,t,n){"use strict";n.r(t),t.default=n.p+"assets/images/notif_console_tokens-a4351a223de2e813114b6fd87566012b.png"},265:function(e,t,n){"use strict";n.r(t),t.default=n.p+"assets/images/notif_aws_notif_console-fa8d732c943d4c69b95281d5cae14e39.png"},266:function(e,t,n){"use strict";n.r(t),t.default=n.p+"assets/images/notif_testing_message_dest-e91e9ba133059cac3ec5ab177e277735.png"},267:function(e,t,n){"use strict";n.r(t),t.default=n.p+"assets/images/notif_testing_message_message-c2adcea0a5845a100e5ca9c733a213e3.png"},268:function(e,t,n){"use strict";n.r(t),t.default="data:image/png;base64,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"},269:function(e,t,n){"use strict";n.r(t),t.default=n.p+"assets/images/notif_android_push_result-c84bb6e144fe1c6724329ec3f2ea82a4.png"}}]);