使用React-Native推送通知

要在React Native中实现推送通知，您可以使用第三方库react-native-push-notification，它为您处理Apple（APNs）和Android（FCM）的通知。

首先，确保您已安装了react-native-push-notification：

npm install --save react-native-push-notification

对于iOS：

使用 CocoaPods 安装 PushNotification 插件：在 ios 目录中运行以下命令： cd ios && pod install && cd ..
在 AppDelegate.m 中启用推送通知并配置相应的处理程序： #import <React/RCTBridge.h> #import <React/RCTBundleURLProvider.h> #import <React/RCTRootView.h> #import "RNSPushNotificationManager.h" - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions { // ... [RNSPushNotificationManager registerForRemoteNotificationsTypes:(UIUserNotificationTypeBadge | UIUserNotificationTypeSound | UIUserNotificationTypeAlert) categories:nil]; return YES; } // Required for the register and request permissions - (void)application:(UIApplication *)application didRegisterUserNotificationSettings:(UIUserNotificationSettings *)notificationSettings { [RNSPushNotificationManager didRegisterUserNotificationSettings:notificationSettings]; } // Required for the registrationError - (void)application:(UIApplication *)application didFailToRegisterForRemoteNotificationsWithError:(NSError *)error { [RNSPushNotificationManager didFailToRegisterForRemoteNotificationsWithError:error]; } // Required for the localNotification event - (void)application:(UIApplication *)application didReceiveLocalNotification:(UILocalNotification *)notification { [RNSPushNotificationManager didReceiveLocalNotification:notification]; } // Required for the remote notification event - (void)application:(UIApplication *)application didReceiveRemoteNotification:(NSDictionary *)userInfo fetchCompletionHandler:(void (^)(UIBackgroundFetchResult))completionHandler { [RNSPushNotificationManager didReceiveRemoteNotification:userInfo fetchCompletionHandler:completionHandler]; }

对于Android：

在 android/app/src/main/AndroidManifest.xml 中添加必要的权限： <uses-permission android:name="android.permission.INTERNET" /> <uses-permission android:name="com.google.android.c2dm.permission.RECEIVE" /> <uses-permission android:name="android.permission.WAKE_LOCK" /> <permission android:name="${applicationId}.permission.C2D_MESSAGE" android:protectionLevel="signature" /> <uses-permission android:name="${applicationId}.permission.C2D_MESSAGE" />
在 android/app/build.gradle 文件中添加依赖项： dependencies { implementation "com.facebook.react:react-native:+" implementation 'com.google.firebase:firebase-messaging:21.1.0' }
在 android/app/src/main/java/com/yourpackage/MyApplication.java 文件中配置 Firebase消息服务： import com.google.firebase.messaging.FirebaseMessaging; import com.google.firebase.remoteconfig.FirebaseRemoteConfig; import com.google.firebase.remoteconfig.FirebaseRemoteConfigSettings; public class MyApplication extends Application implements ReactApplication { // ... @Override public void onCreate() { super.onCreate(); FirebaseMessaging.getInstance().subscribeToTopic("all"); } }
在 android/app/src/main/java/com/yourpackage/RNPushNotificationListenerService.java 文件中处理通知： import com.facebook.react.bridge.ReactApplicationContext; import com.facebook.react.bridge.WritableMap; import com.facebook.react.bridge.Arguments; import com.facebook.react.modules.core.DeviceEventManagerModule; import com.facebook.react-native.android.PushNotificationPackage; public class RNPushNotificationListenerService extends PushNotificationListenerService { private void sendEvent(RemoteMessage remoteMessage) { // ... WritableMap params = Arguments.createMap(); params.putString("message", message); getReactApplicationContext() .getJSModule(DeviceEventManagerModule.RCTDeviceEventEmitter.class) .emit("remoteNotificationReceived", params); } }
在 AndroidManifest.xml 文件中添加以下权限： <service android:name=".RNPushNotificationListenerService" android:exported="false"> <intent-filter> <action android:name="com.google.firebase.MESSAGING_EVENT" /> </intent-filter> </service>

现在，您已经在React Native中设置了推送通知。接下来，您可以实现一些自定义功能，例如本地推送通知或远程推送通知。