John Quiet
John Quiet

Reputation: 61

Why won't my React Native Expo app prompt the user to give permission for notifications?

I am creating a React Native app for Android using Expo, EAS Build.

Following the docs here, I set up notifications for my app, including Firebase Cloud Messaging.

In my code, which is mostly taken from the docs, I check for notifications permission upon app launch using UseEffect, and if the app does not have permission, I request the permissions.

However, when I load the app on my development server, the alert pops up stating, "Failed to get push token for push notification!"

Just to make sure everything else is working, I went and enabled notification permission manually on my device via settings. Then, the app works great. The notifications I am scheduling work. There are no problems.

But obviously, I don't want the user to have to manually go to settings. I'd like the prompt to appear.

Could this be an issue with the development server which will no longer exist once deployed?

Any help appreciated. Thanks.

Here is what I believe to be the relevant code below from my App.js. I expected a prompt to appear for the user when they open the app the first time asking them to give notification permission.

import * as Notifications from "expo-notifications";
// other import statements


Notifications.setNotificationHandler({
  handleNotification: async () => {
    return {
      shouldShowAlert: true,
      shouldPlaySound: true,
      shouldSetBadge: true,
    };
  },
});

// other code

export default function App() {

// other code

const notificationListener = useRef();
const responseListener = useRef();

useEffect(() => {
    registerForPushNotificationsAsync().then(token => setExpoPushToken(token));

    // This listener is fired whenever a notification is received while the app is foregrounded
    notificationListener.current = Notifications.addNotificationReceivedListener(notification => {
      setNotification(notification);
    });

    // This listener is fired whenever a user taps on or interacts with a notification (works when app is foregrounded, backgrounded, or killed)
    responseListener.current = Notifications.addNotificationResponseReceivedListener(response => {
      // console.log(response);
    });

    return () => {
      Notifications.removeNotificationSubscription(notificationListener.current);
      Notifications.removeNotificationSubscription(responseListener.current);
    };

    // other unrelated code

  }, []);
  
  // code related to the app itself

}

// below is the function i call above upon app launch in order to get notification
// but no prompt comes up for the user

async function registerForPushNotificationsAsync() {

  let token;
  if (Device.isDevice) {
    console.log('about to getPermissionsAsync');
    const { status: existingStatus } = await Notifications.getPermissionsAsync();
    let finalStatus = existingStatus;
    if (existingStatus !== 'granted') {
      console.log('about to requestPermissionsAsync');
      const { status } = await Notifications.requestPermissionsAsync();
      console.log('the status gotten by requestPermissionsAsync() is the line below this: ');
      console.log(status);
      finalStatus = status;
    }
    if (finalStatus !== 'granted') {
      alert('Failed to get push token for push notification!');
      return;
    }
    console.log('about to get token');
    token = (await Notifications.getExpoPushTokenAsync({
      experienceId: '@johnquiet/buglecallexplore ',
    })).data;
    console.log('should see token below this line');
    console.log(token);
  } else {
    alert('Must use physical device for Push Notifications');
  }

  if (Platform.OS === 'android') {
    Notifications.setNotificationChannelAsync('alarms', {
      name: 'Scheduled Notifications',
      importance: Notifications.AndroidImportance.MAX,
      vibrationPattern: [0, 250, 250, 250],
      lightColor: '#a7e7fa',
    });
  }

  return token;
}

// more unrelated code and styles

Upvotes: 0

Views: 4399

Answers (1)

Freddy
Freddy

Reputation: 136

On Android 13 the prompt asking to grant the permission will not appear until at least one notification channel is created. Make sure to call Notifications.setNotificationChannelAsync before calling Notifications.getExpoPushTokenAsync.

https://docs.expo.dev/versions/latest/sdk/notifications/#permissions

Upvotes: 5

Related Questions