Sending notifications to specific user with expo - react native

See more:

react-native

Platform: React Native (IOS target)

This is my code:

const ProfilesScreen: React.FC<Props> = ({ navigation, route }) => {
  const [expoPushToken, setExpoPushToken] = useState("");
  const [notification, setNotification] = useState(false);
  const [notificationRes, setNotifcationRes] = useState([]);
  const notificationListener = useRef();
  const responseListener = useRef();
  const [data, setData] = useState<any>([]);
  const [notificationsSentUids, setNotificationSentUids] = useState<any>([]);
  const [notificationsCount, setNotificationsCount] = useState<number>(0);
  const [activeIndex, setActiveIndex] = useState<number>(0);
  const [storageData, setStorageData] = useState({});

  async function sendPushNotification(expoPushToken) {
    const message = {
      to: expoPushToken,
      sound: "default",
      title: "My message",
      body: storageData
        ? `${storageData?.name} wants to connect with you`
        : null,
      data: { someData: "goes here" },
    };
    await fetch("https://exp.host/--/api/v2/push/send", {
      method: "POST",
      headers: {
        Accept: "application/json",
        "Accept-encoding": "gzip, deflate",
        "Content-Type": "application/json",
      },
      body: JSON.stringify(message),
    });
  }
  async function registerForPushNotificationsAsync() {
    let token;
    if (Device.isDevice) {
      const { status: existingStatus } =
        await Notifications.getPermissionsAsync();
      let finalStatus = existingStatus;
      if (existingStatus !== "granted") {
        const { status } = await Notifications.requestPermissionsAsync();
        finalStatus = status;
      }
      if (finalStatus !== "granted") {
        alert("Failed to get push token for push notification!");
        return;
      }
      token = (await Notifications.getExpoPushTokenAsync()).data;
      setExpoPushToken(token);
    } else {
      // alert("Must use physical device for Push Notifications");
    }
    return token;
  }
  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 => {
        setNotifcationRes(response);
    return () => {
      Notifications.removeNotificationSubscription(
        notificationListener.current
      );
      Notifications.removeNotificationSubscription(responseListener.current);
    };
  }, []);
  return ....
};

What I have tried:

Hi,

I am trying to build a way to send push notifications ( it's basically an app simillar to any datting app where you click a user and it sends them a notification to let them know I want to connect).

The notifications are being received fine on Expo Go but I don't know how to target a specific individual? Do I need backend for this?