Menghantar Pemberitahuan melalui API Tolak Expo
Hantar POST muatan pemberitahuan ke API Tolak Expo daripada pelayan atau arahan curl, sasarkan token peranti tertentu, dan sahkan penghantaran dalam papan pemuka Expo.
Menghantar Pemberitahuan melalui API Tolak Expo ialah pelajaran React Native Academy percuma di CoddyKit. Ini ialah pelajaran 2 daripada 4. Sebanyak 3 pelajaran dalam laluan pembelajaran ini boleh dibaca sepenuhnya secara percuma — selepas itu, CoddyKit PRO membuka akses kepada semua pelajaran, serta latihan praktikal dengan penyunting kod terbina dalam dan tutor kecerdasan buatan yang tersedia 24/7. Pelajaran ini merupakan sebahagian daripada laluan pembelajaran React Native Academy, dan kemajuan anda disegerakkan merentas web serta aplikasi CoddyKit. Kursus React Native Academy merangkumi sejumlah 4 pelajaran.
Perkhidmatan Pemberitahuan Push Expo
Perkhidmatan Pemberitahuan Push Expo (EPNS) ialah geganti yang berada antara pelayan anda dengan get laluan push khusus platform (Apple APNs dan Google FCM). Daripada berintegrasi dengan dua perkhidmatan berasingan, anda menghantar satu permintaan HTTP kepada API Expo dan API tersebut mengendalikan perbezaan platform untuk anda.
EPNS adalah percuma untuk aplikasi yang menggunakan aliran kerja terurus Expo serta mengendalikan pengurusan sijil, penghalaan token, pengumpulan dan pelaporan ralat. Untuk aplikasi pengeluaran dengan jumlah yang tinggi, anda boleh beralih kepada integrasi APNs/FCM terus, tetapi EPNS ialah titik permulaan yang sangat baik untuk kebanyakan aplikasi.
Titik Akhir API Push Expo
Hantar permintaan POST kepada https://exp.host/--/api/v2/push/send dengan isi JSON yang mengandungi satu atau lebih mesej pemberitahuan. Setiap mesej menyasarkan token push Expo tertentu dan merangkumi kandungan pemberitahuan.
API menerima sehingga 100 mesej bagi setiap permintaan untuk pengumpulan yang cekap. Sentiasa hantar dari pelayan anda, jangan sekali-kali daripada klien — klien tidak mengetahui token pengguna lain dan penghantaran daripada klien mendedahkan logik pelayan anda.
// From your backend server (Node.js example):
const response = await fetch('https://exp.host/--/api/v2/push/send', {
method: 'POST',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json',
},
body: JSON.stringify({
to: 'ExponentPushToken[AbCdEfGhIjKl...]',
title: 'New message',
body: 'Alice sent you a message!',
}),
});
const result = await response.json();
console.log(result);Medan Mesej Pemberitahuan
Objek mesej pemberitahuan menyokong beberapa medan:
- to (diperlukan) — token push Expo atau tatasusunan token
- title — tajuk pemberitahuan yang dicetak tebal
- body — teks mesej pemberitahuan
- data — objek JSON dengan muatan tersuai untuk dibaca oleh aplikasi apabila diketuk
- sound —
'default'untuk memainkan bunyi peranti - badge — integer untuk menetapkan bilangan lencana ikon aplikasi iOS
- channelId — ID saluran pemberitahuan Android
const message = {
to: 'ExponentPushToken[AbCdEfGhIjKl...]',
sound: 'default',
title: 'Order Shipped',
body: 'Your order #1234 is on its way!',
badge: 1,
channelId: 'orders',
data: {
type: 'order_update',
orderId: '1234',
screen: 'OrderDetail',
},
};Menghantar kepada Beberapa Peranti
Untuk menghantar pemberitahuan yang sama kepada beberapa peranti (contohnya, siaran atau pemberitahuan kepada semua peranti pengguna), hantar tatasusunan token kepada medan to. Setiap token akan menerima pemberitahuan tersebut.
Untuk khalayak yang besar, pecahkan senarai token anda kepada kelompok 100 dan hantar permintaan API berasingan bagi setiap kelompok. API Push Expo menguatkuasakan had kadar dan saiz kelompok, jadi pengumpulan diperlukan untuk skala besar.
// Send to multiple devices:
const messages = tokens.map((token) => ({
to: token,
title: 'New feature available!',
body: 'Check out what we built for you.',
data: { screen: 'WhatsNew' },
}));
// Chunk into batches of 100:
const chunks = [];
for (let i = 0; i < messages.length; i += 100) {
chunks.push(messages.slice(i, i + 100));
}
for (const chunk of chunks) {
await fetch('https://exp.host/--/api/v2/push/send', {
method: 'POST',
body: JSON.stringify(chunk),
});
}Menggunakan SDK Pelayan Expo
Daripada membuat permintaan HTTP mentah, gunakan pakej npm rasmi expo-server-sdk dalam bahagian belakang Node.js anda. Pakej ini menyediakan pembahagian kelompok, pengendalian ralat dan pemeriksaan resit secara terbina dalam. Pasangkannya dengan npm install expo-server-sdk.
Kaedah sendPushNotificationsAsync dalam SDK mengendalikan pengumpulan kelompok secara automatik dan mengembalikan objek tiket yang boleh anda gunakan untuk menyemak resit penghantaran kemudian. Pakej ini juga mengesahkan token sebelum penghantaran bagi mengelakkan panggilan API dibazirkan pada token yang tidak sah.
// Backend (Node.js):
const { Expo } = require('expo-server-sdk');
const expo = new Expo();
const messages = tokens
.filter(token => Expo.isExpoPushToken(token))
.map(token => ({
to: token,
title: 'Hello!',
body: 'This is a push notification',
data: { type: 'greeting' },
}));
const chunks = expo.chunkPushNotifications(messages);
const tickets = [];
for (const chunk of chunks) {
const ticketChunk = await expo.sendPushNotificationsAsync(chunk);
tickets.push(...ticketChunk);
}Resit Tolak: Mengesahkan Penghantaran
Menghantar kepada API Expo memberikan anda tickets serta-merta — tiket ini mengesahkan bahawa mesej telah diterima, bukannya bahawa mesej itu telah dihantar. Beberapa minit kemudian, semak receipts untuk mengesahkan penghantaran sebenar kepada APNs/FCM. Gunakan ID tiket daripada langkah penghantaran untuk mendapatkan resit daripada https://exp.host/--/api/v2/push/getReceipts.
Resit dengan status 'error' dan kod DeviceNotRegistered bermaksud token itu tidak lagi sah — buangkannya daripada pangkalan data anda supaya senarai token kekal bersih dan panggilan API tidak dibazirkan.
// After sending, check receipts (wait ~5 minutes):
const receiptIds = tickets
.filter(t => t.status === 'ok')
.map(t => t.id);
const receiptChunks = expo.chunkPushNotificationReceiptIds(receiptIds);
for (const chunk of receiptChunks) {
const receipts = await expo.getPushNotificationReceiptsAsync(chunk);
for (const [id, receipt] of Object.entries(receipts)) {
if (receipt.status === 'error') {
if (receipt.details.error === 'DeviceNotRegistered') {
await removeTokenFromDB(id); // clean up
}
}
}
}Menguji Notifikasi Tolak
Expo menyediakan alat pengujian notifikasi tolak di https://expo.dev/notifications. Masukkan token tolak Expo anda dan hantar notifikasi ujian terus daripada papan pemuka — tiada kod pelayan diperlukan. Alat ini amat berguna untuk menguji rupa dan penghantaran notifikasi pada peranti sebenar.
Anda juga boleh menggunakan perintah curl daripada terminal untuk menghantar notifikasi ujian. Cara ini lebih pantas semasa pembangunan dan membolehkan anda menguji muatan serta objek data sewenang-wenangnya tanpa menulis kod pelayan terlebih dahulu.
# Test push from terminal:
curl -H 'Content-Type: application/json' \
-X POST 'https://exp.host/--/api/v2/push/send' \
-d '{
"to": "ExponentPushToken[YOUR_TOKEN_HERE]",
"title": "Test Notification",
"body": "Hello from curl!",
"data": { "test": true }
}'
# Or use Expo dashboard:
# https://expo.dev/notificationsMenjadualkan Notifikasi daripada Aplikasi
Selain notifikasi tolak daripada pelayan, anda boleh menjadualkan notifikasi setempat daripada aplikasi itu sendiri — notifikasi ini berfungsi tanpa talian dan tidak memerlukan pelayan. Gunakan Notifications.scheduleNotificationAsync dengan pencetus yang menentukan masa notifikasi dicetuskan.
Jenis pencetus yang biasa: seconds — dicetuskan selepas kelewatan; date — dicetuskan pada masa tertentu; weekly — dicetuskan pada hari minggu dan masa tertentu. Notifikasi setempat amat sesuai untuk peringatan, penggera dan semakan berjadual.
// Schedule a local notification 10 seconds from now:
await Notifications.scheduleNotificationAsync({
content: {
title: 'Reminder',
body: 'Time to review your daily goals!',
data: { screen: 'Goals' },
},
trigger: {
seconds: 10, // fires after 10 seconds
},
});
// Schedule for a specific date:
await Notifications.scheduleNotificationAsync({
content: { title: 'Meeting in 5 minutes', body: 'Team standup' },
trigger: new Date(Date.now() + 5 * 60 * 1000),
});Keutamaan dan Penghantaran Notifikasi
Keutamaan notifikasi mempengaruhi tahap keagresifan OS menghantar sesuatu notifikasi. Notifikasi keutamaan tinggi menghidupkan skrin peranti serta-merta (digunakan untuk amaran segera seperti mesej). Notifikasi keutamaan biasa dikumpulkan dan dihantar apabila sesuai (digunakan untuk kandungan promosi).
Dalam API Tolak Expo, tetapkan priority: 'high' untuk notifikasi yang perlu dihantar tepat pada masanya. Gunakannya secara berhemat — menghantar terlalu banyak notifikasi berkeutamaan tinggi menyebabkan pengguna terbiasa mengabaikannya, dan Apple mungkin menurunkan keutamaan notifikasi aplikasi anda jika ciri ini disalahgunakan.
// High priority (message, call, alert):
{
to: token,
title: 'Incoming call',
body: 'Bob is calling you',
priority: 'high',
channelId: 'calls',
data: { screen: 'IncomingCall', callId: 'abc' },
}
// Normal priority (digest, update):
{
to: token,
title: 'Weekly summary ready',
body: 'See how you did this week!',
priority: 'normal',
channelId: 'digest',
}Mengendalikan Ketikan Notifikasi Semasa Pelancaran Aplikasi
Apabila pengguna mengetik notifikasi dan aplikasi ditutup sepenuhnya, aplikasi akan dilancarkan. Untuk pergi ke skrin yang betul berdasarkan notifikasi tersebut, baca respons notifikasi terakhir semasa pelancaran menggunakan Notifications.getLastNotificationResponseAsync().
Bacanya pada peringkat awal urutan but aplikasi anda (dalam App.js atau navigator akar anda) dan pergi ke skrin berkenaan apabila respons mengandungi muatan data.screen. Ini menghubungkan notifikasi tolak dengan navigasi mendalam dalam aplikasi anda.
useEffect(() => {
Notifications.getLastNotificationResponseAsync().then((response) => {
if (response) {
const { screen, id } = response.notification.request.content.data;
if (screen && navigationRef.isReady()) {
navigationRef.navigate(screen, { id });
}
}
});
}, []);Membatalkan dan Mengurus Notifikasi Berjadual
Batalkan notifikasi berjadual tertentu dengan Notifications.cancelScheduledNotificationAsync(identifier), dengan pengecam ialah rentetan yang dikembalikan daripada scheduleNotificationAsync. Batalkan semua notifikasi berjadual dengan Notifications.cancelAllScheduledNotificationsAsync().
Simpan pengecam notifikasi dalam AsyncStorage jika anda perlu membatalkannya selepas aplikasi dimulakan semula — contohnya, membatalkan peringatan apabila pengguna menandakan tugasan sebagai selesai.
// Schedule and save identifier:
const id = await Notifications.scheduleNotificationAsync({
content: { title: 'Take your medicine' },
trigger: { hour: 9, minute: 0, repeats: true },
});
await AsyncStorage.setItem('medicineReminderNotifId', id);
// Later, cancel it:
const notifId = await AsyncStorage.getItem('medicineReminderNotifId');
if (notifId) {
await Notifications.cancelScheduledNotificationAsync(notifId);
await AsyncStorage.removeItem('medicineReminderNotifId');
}Semakan Ringkas
Uji pemahaman anda tentang konsep Pembangunan Mudah Alih React Native daripada pelajaran ini.
Ulang Kaji Pelajaran
Dalam pelajaran ini, anda telah mempelajari bahawa: API Tolak Expo menerima permintaan POST ke exp.host dengan medan token, title, body dan data untuk menghantar notifikasi melalui APNs/FCM, resit tolak mengesahkan penghantaran sebenar dan ralat DeviceNotRegistered menandakan token yang perlu dipadamkan, serta notifikasi setempat boleh dijadualkan daripada aplikasi itu sendiri menggunakan Notifications.scheduleNotificationAsync dengan pencetus berasaskan masa. Seterusnya, kita akan mengendalikan peristiwa notifikasi latar hadapan dan latar belakang dalam aplikasi.
Pelajari JavaScript dengan tutor kecerdasan buatan — percuma
Tulis dan jalankan kod sebenar dalam pelayar anda, dapatkan bantuan segera daripada tutor kecerdasan buatan yang tersedia 24/7, dan sambung semula dari tempat anda berhenti di web atau dalam aplikasi.
- Kursus
- 30
- Pelajaran
- 120
Soalan Lazim
Adakah pelajaran “Menghantar Pemberitahuan melalui API Tolak Expo” percuma?
Ya — sebanyak 3 pelajaran dalam laluan pembelajaran React Native Academy, termasuk “Menghantar Pemberitahuan melalui API Tolak Expo”, boleh dibaca sepenuhnya secara percuma di web ini. Selepas itu, CoddyKit PRO membuka akses kepada semua pelajaran, serta latihan interaktif dengan penyunting kod terbina dalam dan tutor kecerdasan buatan yang tersedia 24/7. Kursus React Native Academy merangkumi sejumlah 4 pelajaran.
Apakah yang akan saya pelajari dalam “Menghantar Pemberitahuan melalui API Tolak Expo”?
Hantar POST muatan pemberitahuan ke API Tolak Expo daripada pelayan atau arahan curl, sasarkan token peranti tertentu, dan sahkan penghantaran dalam papan pemuka Expo. Anda berlatih React Native Academy menggunakan kod praktikal yang dijalankan terus dalam pelayar, manakala tutor kecerdasan buatan 24/7 menjawab soalan anda semasa anda mengikuti pelajaran.
Adakah saya memerlukan pengalaman untuk memulakan React Native Academy?
Tiada pengalaman terdahulu diperlukan. Pembelajaran React Native Academy di CoddyKit disusun untuk pelajar daripada peringkat pemula hingga lanjutan, jadi anda boleh bermula di sini atau dari awal dan belajar mengikut kadar anda sendiri. Ini ialah pelajaran 2 daripada 4.
Berapa lamakah pelajaran “Menghantar Pemberitahuan melalui API Tolak Expo” diambil?
Kebanyakan pelajaran CoddyKit mengambil masa kira-kira 5–10 minit. Setiap pelajaran ringkas dan interaktif, jadi anda boleh membuat kemajuan secara berterusan dan menyambung tepat dari tempat anda berhenti di web atau aplikasi.
Bolehkah saya menulis dan menjalankan kod dalam pelajaran React Native Academy ini?
Ya. Setiap pelajaran React Native Academy menyertakan penyunting kod terbina dalam, jadi anda boleh menulis dan menjalankan kod sebenar terus dalam pelayar serta menerima maklum balas kecerdasan buatan serta-merta — tanpa memerlukan persediaan setempat.
Semua pelajaran dalam kursus ini
- Meminta Kebenaran dan Mendapatkan Token Tolak
- Menghantar Pemberitahuan melalui API Tolak Expo
- Mengurus Pemberitahuan Latar Depan dan Latar Belakang
- Saluran Pemberitahuan dan Kandungan Kaya