iospush-notificationapple-push-notificationsapnapple-wallet

Custom Push Notification for Apple Wallet Pass not Showing up on Phone

I've implemented pass generation and it's updated through Apple's silent notification, which updates the passes to their latest versions.

I want to send some marketing push notifications to the Apple Wallet App as shown in the attachment.

enter image description here

Here is the Silent notification implementation, which is working perfectly fine.

const options: apn.ProviderOptions = {
  token: {
    key: fs.readFileSync("./certs/APNs_AuthKey_7YYF346FU5.p8"),
    keyId: "******",
    teamId: "******",
  },
  pfx: fs.readFileSync("./certs/private_key.pem"),
  cert: fs.readFileSync("./certs/certificate.pem"),
  production: true,
  rejectUnauthorized: true,
};

const apnProvider = new apn.Provider(options);

async function sendSilentPushNotification(
  deviceTokens: string[],
  serialNumber: string
) {
  try {
    const notification = new apn.Notification();

    notification.topic = "pass.com.digital.passmaker";

    notification.payload = {
      aps: {
        "content-available": 1,
      },
      serialNumber,
    };

    notification.priority = 5;
    return await apnProvider.send(notification, deviceTokens);
  } catch (error) {
    logger.error("Apple Notification error: " + error);
    return error;
  }
}

Here is the marketing notification I am trying to send, it is working with success, but I don't see any notification on mobile phone.

please help me to fix it.

async function sendCustomPushNotification(
  deviceTokens: string[],
  serialNumber: string,
  title: string,
  body: string,
  category?: string,
  badge?: number
) {
  try {
    const notification = new apn.Notification();

    notification.topic = "pass.com.digital.passmaker";

    // Set the title and body of the notification
    notification.alert = {
      title: title,
      subtitle: "Pass Update",
      body: body,
    };

    // Set the sound to play when the notification is received
    notification.sound = "default";

    // Set the badge number on the app icon (optional)
    if (badge !== undefined) {
      notification.badge = badge;
    }

    notification.contentAvailable = true;
    notification.mutableContent = true;
    notification.aps.category = category;
    notification.aps.alert = {
      title: title,
      body: body,
    };
    notification.aps.badge = badge;
    notification.aps["content-available"] = 1;
    notification.aps["launch-image"] =
      "https://banner2.cleanpng.com/20180423/gkw/kisspng-google-logo-logo-logo-5ade7dc753b015.9317679115245306313428.jpg";

    // You can still include the serialNumber in the custom payload
    notification.payload = {
      serialNumber: serialNumber,
      aps: {
        "content-available": 1,
        "mutable-content": 1,
        "interruption-level": "time-sensitive",
      },
    };

    // Set to high priority
    notification.priority = 10;

    return await apnProvider.send(notification, deviceTokens);
  } catch (error) {
    logger.error("Apple Notification error: " + error);
    return error;
  }
}

I am building this with Typescript and deploying it on Firebase Cloud Functions.

I am using APN to build and send notifications.

Solution

  • I was wrong about the custom push notification for Apple Pass, as I was trying to send notifications from the backend.

    But, the Apple Wallet app automatically emits notifications when we update any pass field with changeMessage.

    For example: If I have the lastMessage field in pass data (backFields) then if I want to show the user a notification. I will update the lastMessage filed and push it with changeMessage as following:

        if (body.lastMessage) {
      console.log("found last message: ", body.lastMessage);

      payload.backFields?.push({
        key: "lastMessage",
        label: "Last Message",
        value: body.lastMessage,
        changeMessage: "%@",
      });
    }

    When the pass is updated the Wallet app will automatically generate a notification and notify the user.

    Notification Screenshot