Meminta Kebenaran dan Mendapatkan Token Tolak
Gunakan expo-notifications untuk meminta kebenaran pemberitahuan, mendapatkan token tolak Expo, dan menghantar token itu ke pelayan bahagian belakang untuk disimpan.
Meminta Kebenaran dan Mendapatkan Token Tolak ialah pelajaran React Native Academy percuma di CoddyKit. Ini ialah pelajaran 1 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.
Apakah Pemberitahuan Push?
Pemberitahuan push ialah mesej yang dihantar daripada pelayan anda ke peranti pengguna walaupun aplikasi ditutup. Pemberitahuan ini muncul dalam pusat pemberitahuan peranti, dipaparkan pada skrin kunci dan boleh mencetuskan bilangan lencana pada ikon aplikasi. Pada peranti mudah alih, pemberitahuan ini merupakan salah satu alat penglibatan semula yang paling berkesan.
Aliran pemberitahuan push melibatkan tiga pihak: aplikasi anda (mendaftarkan peranti), pelayan anda (menentukan masa penghantaran), dan get laluan push (Apple APNs untuk iOS, Google FCM untuk Android). Expo membungkus kedua-dua get laluan dengan perkhidmatan push yang seragam.
Memasang expo-notifications
Pakej expo-notifications menyediakan API seragam untuk pemberitahuan push pada iOS dan Android. Pasangnya dengan CLI Expo, yang mengendalikan pemasangan versi natif yang betul untuk SDK Expo anda.
Pemberitahuan push memerlukan binaan pembangunan (bukan Expo Go) kerana pemberitahuan ini memerlukan kelayakan APNs disertakan dalam perduaan aplikasi iOS. Push Android berfungsi dalam Expo Go, tetapi iOS tidak. Untuk pengeluaran, EAS Build mengendalikan konfigurasi sijil secara automatik.
// Install:
// npx expo install expo-notifications
// In app.json, configure notification appearance:
{
'expo': {
'notification': {
'icon': './assets/notification-icon.png',
'color': '#ffffff',
'androidMode': 'default',
'androidCollapsedTitle': '#{unread_notifications} new updates'
}
}
}Meminta Kebenaran Pemberitahuan
Sebelum menghantar atau menerima pemberitahuan, anda mesti meminta kebenaran daripada pengguna. Pada iOS, dialog kebenaran sistem dipaparkan buat kali pertama. Pada Android 13+ (API 33+), anda juga mesti meminta kebenaran secara jelas; pada versi Android yang lebih lama, kebenaran diberikan secara automatik.
Gunakan Notifications.requestPermissionsAsync() dan semak status yang dikembalikan. Statusnya ialah 'granted', 'denied' atau 'undetermined'. Jika ditolak, pengguna mesti mengaktifkannya semula secara manual dalam Tetapan — anda tidak boleh memaparkan dialog itu lagi.
import * as Notifications from 'expo-notifications';
async function requestPushPermission() {
const { status: existingStatus } = await Notifications.getPermissionsAsync();
let finalStatus = existingStatus;
if (existingStatus !== 'granted') {
const { status } = await Notifications.requestPermissionsAsync();
finalStatus = status;
}
if (finalStatus !== 'granted') {
console.log('Push permission denied');
return false;
}
return true;
}Mendapatkan Token Push Expo
Token Push Expo ialah pengecam unik untuk gabungan aplikasi+peranti+pengguna. Bentuknya seperti ExponentPushToken[xxxxxxxxxxxxxxxxxxxxxx]. Anda menghantar token ini kepada pelayan supaya pelayan boleh menghantar pemberitahuan kepada peranti khusus ini kemudian.
Gunakan Notifications.getExpoPushTokenAsync() untuk mendapatkan token. Fungsi ini mesti dipanggil selepas kebenaran diberikan. Untuk binaan pengeluaran (bukan Expo), anda juga perlu memberikan projectId daripada projek Expo anda.
import * as Notifications from 'expo-notifications';
import Constants from 'expo-constants';
async function getExpoPushToken() {
const token = await Notifications.getExpoPushTokenAsync({
projectId: Constants.expoConfig.extra.eas.projectId,
});
console.log('Push token:', token.data);
// 'ExponentPushToken[AbCdEfGhIjKl...]'
return token.data;
}Menyimpan Token pada Pelayan Anda
Token push hanya berguna jika pelayan anda memilikinya. Selepas mendapatkan token, hantarkannya kepada bahagian belakang anda melalui panggilan API dan simpannya bersama akaun pengguna. Pengguna mungkin menggunakan beberapa peranti — simpan satu token bagi setiap peranti untuk setiap pengguna.
Token boleh berubah — apabila pengguna memasang semula aplikasi atau menetapkan semula peranti mereka. Bina pelayan anda untuk mengendalikan kemas kini token: sama ada gantikan token lama untuk pengguna yang sama, atau simpan beberapa token bagi setiap pengguna dan kendalikan respons token tidak sah daripada get laluan push dengan membuang token yang lapuk.
async function registerForPushNotifications(userId) {
const hasPermission = await requestPushPermission();
if (!hasPermission) return;
const token = await getExpoPushToken();
// Send to your backend:
await fetch('https://api.myapp.com/users/' + userId + '/push-token', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ token }),
});
}Memanggil Pendaftaran pada Masa yang Tepat
Panggil fungsi pendaftaran pada masa yang sesuai dalam perjalanan pengguna — biasanya sejurus selepas pengguna log masuk atau melengkapkan penerangan awal. Meminta kebenaran push terlalu awal (semasa pelancaran pertama aplikasi), sebelum pengguna memahami nilai aplikasi, mengurangkan kadar penerimaan.
Gunakan useEffect dalam komponen akar yang disahkan untuk mencetuskan pendaftaran sekali apabila pengguna disahkan. Simpan status pendaftaran dalam AsyncStorage bagi mengelakkan permintaan kebenaran pada setiap pelancaran.
import { useEffect } from 'react';
import AsyncStorage from '@react-native-async-storage/async-storage';
function usePostLoginPushRegistration(userId) {
useEffect(() => {
if (!userId) return;
AsyncStorage.getItem('pushRegistered').then((registered) => {
if (!registered) {
registerForPushNotifications(userId).then(() => {
AsyncStorage.setItem('pushRegistered', 'true');
});
}
});
}, [userId]);
}Khusus Android: Saluran Pemberitahuan
Android 8+ memerlukan saluran pemberitahuan — kumpulan logik yang memberikan pengguna kawalan terperinci terhadap jenis pemberitahuan yang diterima. Cipta saluran dengan Notifications.setNotificationChannelAsync() sebelum menghantar sebarang pemberitahuan. Pada iOS, perkara ini tidak diperlukan.
Gunakan ID dan nama saluran yang jelas serta bermakna kepada pengguna pada halaman pemberitahuan Tetapan. Contohnya, messages, promotions dan system. Tetapkan tahap kepentingan yang sesuai — HIGH untuk pemberitahuan penting, DEFAULT untuk pemberitahuan biasa.
import * as Notifications from 'expo-notifications';
import { Platform } from 'react-native';
async function setupNotificationChannels() {
if (Platform.OS === 'android') {
await Notifications.setNotificationChannelAsync('messages', {
name: 'Messages',
importance: Notifications.AndroidImportance.HIGH,
vibrationPattern: [0, 250, 250, 250],
lightColor: '#FF231F7C',
});
await Notifications.setNotificationChannelAsync('promotions', {
name: 'Promotions',
importance: Notifications.AndroidImportance.DEFAULT,
});
}
}Mengkonfigurasi Paparan Pemberitahuan
Secara lalai, expo-notifications tidak memaparkan pemberitahuan apabila aplikasi berada di latar depan. Konfigurasikan pengendali pemberitahuan lalai dengan Notifications.setNotificationHandler untuk mengawal tingkah laku ini. Tetapkannya pada aras tertinggi aplikasi anda, sebelum sebarang komponen dipasang.
Fungsi pengendali menerima setiap pemberitahuan dan mengembalikan objek konfigurasi yang menentukan sama ada bunyi dimainkan, amaran dipaparkan dan bilangan lencana ditetapkan. Sediakan pengendali ini sekali sahaja dalam fail masukan aplikasi anda (App.js atau index.js).
import * as Notifications from 'expo-notifications';
// At app root level (outside components):
Notifications.setNotificationHandler({
handleNotification: async () => ({
shouldShowAlert: true,
shouldPlaySound: true,
shouldSetBadge: true,
}),
});
export default function App() {
return <NavigationContainer>...</NavigationContainer>;
}Mendapatkan Token Peranti Natif
Untuk aplikasi pengeluaran yang tidak menggunakan perkhidmatan push Expo (contohnya, berintegrasi terus dengan APNs atau FCM), gunakan Notifications.getDevicePushTokenAsync() dan bukannya token push Expo. Fungsi ini mengembalikan token peranti APNs atau FCM mentah yang boleh anda hantar terus kepada perkhidmatan tersebut.
Token natif ialah rentetan heksadesimal (iOS) atau token pendaftaran (Android). Kendalikan kedua-dua kes pada pelayan anda. Apabila menggunakan token natif, anda juga mesti mengendalikan persediaan sijil/kunci untuk APNs dan google-services.json untuk FCM secara berasingan.
// For direct APNs/FCM integration (not Expo push service):
const nativeToken = await Notifications.getDevicePushTokenAsync();
console.log('Native token type:', nativeToken.type); // 'ios' or 'android'
console.log('Native token data:', nativeToken.data); // raw APNs/FCM token
// Send to your server for direct gateway integration:Mengendalikan Penyegaran Token
Token push boleh menjadi tidak sah dan disegarkan oleh OS — contohnya apabila pengguna memulihkan daripada sandaran, memasang semula aplikasi atau menetapkan semula peranti mereka. Dengarkan perubahan token dengan Notifications.addPushTokenListener dan kemas kini pelayan anda dengan token baharu apabila perubahan ini berlaku.
Sistem pemberitahuan push yang kukuh sentiasa mengendalikan penyegaran token. Token yang tidak berdaftar menyebabkan kegagalan penghantaran senyap pada pelayan anda. Bersihkan token lapuk daripada pangkalan data apabila get laluan push mengembalikan ralat DeviceNotRegistered.
useEffect(() => {
const tokenSubscription = Notifications.addPushTokenListener(
async ({ data: newToken }) => {
console.log('Push token refreshed:', newToken);
// Update server with new token
await fetch('/api/push-token/refresh', {
method: 'PUT',
body: JSON.stringify({ token: newToken }),
});
}
);
return () => tokenSubscription.remove();
}, []);Privasi dan Amalan Terbaik
Amalan terbaik pengurusan token push:
- Jangan sekali-kali catat token dalam pengeluaran — token ialah bukti kelayakan yang mengenal pasti peranti tertentu.
- Sulitkan token semasa disimpan pada pelayan anda — pangkalan data token yang bocor boleh membolehkan spam pemberitahuan.
- Kaitkan token dengan pengguna — padamkan token apabila pengguna memadam akaun atau menarik diri daripada pemberitahuan.
- Kumpulkan kemas kini token — jangan panggil pelayan pada setiap pelancaran aplikasi, hanya apabila token berubah atau semasa pendaftaran pertama.
- Hormati pilihan pengguna — sediakan tetapan pemberitahuan dalam aplikasi dan patuhinya pada pelayan anda.
Semakan Pantas
Uji pemahaman anda tentang konsep Pembangunan Mudah Alih React Native daripada pelajaran ini.
Ulang Kaji Pelajaran
Dalam pelajaran ini, anda telah mempelajari bahawa: Notifications.requestPermissionsAsync() meminta kebenaran OS dan kebenaran itu mesti diberikan sebelum mendapatkan token push, Notifications.getExpoPushTokenAsync() mengembalikan token seperti ExponentPushToken[...] yang mengenal pasti peranti kepada bahagian belakang anda, serta token mesti disimpan pada pelayan anda dan dikemas kini apabila berubah untuk mengekalkan penghantaran yang boleh dipercayai. Seterusnya, kita akan menghantar pemberitahuan push kepada peranti menggunakan API Push Expo daripada pelayan.
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 “Meminta Kebenaran dan Mendapatkan Token Tolak” percuma?
Ya — sebanyak 3 pelajaran dalam laluan pembelajaran React Native Academy, termasuk “Meminta Kebenaran dan Mendapatkan Token Tolak”, 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 “Meminta Kebenaran dan Mendapatkan Token Tolak”?
Gunakan expo-notifications untuk meminta kebenaran pemberitahuan, mendapatkan token tolak Expo, dan menghantar token itu ke pelayan bahagian belakang untuk disimpan. 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 1 daripada 4.
Berapa lamakah pelajaran “Meminta Kebenaran dan Mendapatkan Token Tolak” 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