Lesson 10: Server-Side Push Notifications

So far, all the notifications we have created have been "local"—triggered by the app itself on the same device. But what if you want to alert all your users about a flash sale? Or notify a user that they just received a message from a friend? This requires Push Notifications, which are triggered by a server (Backend).

In this lesson, we will master:

• The Expo Push Token: Understanding the unique "address" for each device.
• Token Acquisition: Programmatically retrieving the token from the hardware.
• The Expo Push Tool: Testing server-side delivery without writing a single line of backend code.
• Architecture Overview: How your server communicates with Expo's notification service.

1. What is a Push Token?

Think of a Push Token as a unique, secure "phone number" for a specific installation of your app on a specific device. To send a message, your server needs this token.

The beauty of Expo is that it provides a unified token format. You don't need to handle Google's Firebase (FCM) and Apple's Push Notification service (APNs) separately; Expo's service acts as a "bridge" to both.

2. Programmatic Token Registration

To get the token, we use getExpoPushTokenAsync. This requires a projectId, which you can find in your app.json or your Expo Dashboard.

index.tstypescript
Copy
import * as Notifications from 'expo-notifications';
import Constants from 'expo-constants';

const registerForPushNotifications = async () => {
  // 1. Get the Project ID from your config
  const projectId = Constants.expoConfig?.extra?.eas?.projectId;
  
  if (!projectId) {
    console.error("Project ID not found. Ensure EAS is configured.");
    return;
  }

  // 2. Request the Token
  const tokenData = await Notifications.getExpoPushTokenAsync({
    projectId: projectId,
  });
  
  const token = tokenData.data;
  console.log("Your Expo Push Token:", token);

  // 3. (Production Step) Send this token to your backend to save it
  // await myApi.saveUserToken(token);
  
  return token;
};

3. Testing with the Expo Push Tool

Before building a complex backend, you should verify your token works using the official Expo Push Tool.

1. Navigate to expo.dev/notifications.
2. Paste your device's token.
3. Enter a Title and Message.
4. Add dynamic data (e.g., { "promoCode": "WELCOME2024" }).
5. Click Send Notification.

If your device is registered and online, you will receive the notification instantly.

4. The Backend Perspective

In a real-world application, your backend (Node.js, Python, Ruby, etc.) will send an HTTP POST request to https://exp.host/--/api/v2/push/send.

The request body is a JSON object containing:

• to: The Expo Push Token.
• title & body: The message content.
• data: Your custom metadata.
• priority, sound, channelId: The behavioral settings we learned in previous lessons.

Technical Security Tip

Never expose your Expo Push Token publicly. Treat it like a password or a session token. If a malicious actor gets a user's token, they can send unauthorized notifications to that user's device.

Your Challenge

Retrieve your device's push token using the registration function. Use the Expo Push Tool to send a notification that includes a categoryIdentifier and a channelId you created in earlier lessons. Verify that the correct buttons and sounds are triggered!