首页 > web前端 > js教程 > 排查 React Native Firebase 的常见问题 - 云消息传递

排查 React Native Firebase 的常见问题 - 云消息传递

Mary-Kate Olsen
发布: 2024-11-01 13:43:29
原创
332 人浏览过

Troubleshooting Common Issues of React Native Firebase- Cloud Messaging

来源:npm @react-native-firebase/app

您在实施 React Native Firebase 云消息传递时遇到问题吗?

考虑到每个平台所需的独特配置,在 Android 和 iOS 上设置并顺利运行通知有时可能具有挑战性。
本指南将引导您完成在 React Native 中设置 Firebase Cloud Messaging (FCM) 的重要步骤并解决一些常见错误:

配置 Firebase:

下载 GoogleService-Info.plist (iOS) 和 google-services.json (Android)。

从您的计算机中选择下载的 GoogleService-Info.plist 文件,并确保启用“根据需要复制项目”复选框

下载 google-services.json 文件并将其放置在项目内的以下位置:
/android/app/google-services.json.

在 Xcode 中启用 iOS 推送通知:

需要将推送通知功能添加到项目中。这可以通过“签名和功能”选项卡下的“功能”选项来完成:
单击“功能”按钮。
搜索“推送通知”。

选择后,该功能将显示在其他启用的功能下方。如果搜索时没有出现选项,则该功能可能已启用

需要启用后台模式功能以及后台获取和远程通知子模式。这可以通过“签名和功能”选项卡上的“功能”选项添加。

现在,确保“后台获取”和“远程通知”子模式均已启用

React Native FCM 设置指南

遵循官方 Firebase 云消息传递设置指南。本指南包括开始在 Android 和 iOS 上发送和接收通知的基本步骤。完成这些步骤后,您可以通过编写新的广告系列,直接从 Firebase 控制台的“消息”下测试通知。

注意
对于 M1 Mac 用户来说,设置 React Native Firebase 时 CocoaPods 的问题很常见。以下是一些快速解决方案:

  1. 使用 arch -x86_64 - M1 Mac 可能会遇到与 CocoaPods 的兼容性问题。使用 arch -x86_64 运行命令以使用 x86_64 架构:

arch -x86_64 pod install

  1. 更新 CocoaPods 存储库- 如果您遇到与过时的 Pod 版本相关的错误,请更新您的 CocoaPods 存储库:

arch -x86_64 pod 存储库更新

  1. 修复 ffi 错误- 您可能会遇到 ffi 库错误。要修复它,请专门为您的架构安装 ffi gem:

sudo arch -x86_64 gem install ffi

  1. 重新安装 Pod - 完成这些步骤后,重新运行 pod 安装命令:

arch -x86_64 pod install

在为 React Native 项目安装和管理 pod 时,遵循这些步骤应该有助于解决 M1 Mac 上特定于架构的问题。

注意
对于 Android 13 设备,您需要显式请求推送通知的运行时权限。将以下权限添加到您的 AndroidManifest.xml:

然后,在您的代码中,在运行时请求通知权限。你可以像这样直接处理Android权限:


import { Platform, PermissionsAndroid } from 'react-native';

async function requestNotificationPermission() {
// Version >= 33(`~project/build.gradle`)
  if (Platform.OS === 'android' ) {
    const granted = await PermissionsAndroid.request(
      PermissionsAndroid.PERMISSIONS.POST_NOTIFICATIONS,
    );

    if (granted === PermissionsAndroid.RESULTS.GRANTED) {
      console.log('Notification permission granted');
    } else {
      console.log('Notification permission denied');
    }
  }
}


登录后复制
登录后复制

在应用初始化期间或订阅通知之前调用 requestNotificationPermission() 以确保用户已授予权限。

确保兼容性

在深入设置之前,请确保 @react-native-firebase/app 和 @react-native-firebase/messaging 包已安装在您的项目中并且兼容。
一致的版本对于避免意外的集成问题至关重要。要验证版本兼容性,请参阅官方 React Native Firebase 发行文档。
确保您安装了这两个软件包的最新版本,以避免兼容性问题。

如果您在 iOS 设备上进行测试,请注意以下事项:

  • 一般需要实体iOS设备才能接收推送通知。
  • 如果您使用的是配备 Apple Silicon 的 macOS 13,您还可以使用运行 iOS 16 的 iOS 模拟器进行测试。

故障排除提示

完成设置后,您可能仍会遇到问题。以下是一些常见问题和解决方案:

模拟器未收到通知

如果 iOS 模拟器中没有出现通知,请尝试以下操作:

  • 通过删除所有内容和设置来重新启动或重置模拟器。
  • 重置后重试,因为有时重启模拟器可以解决问题。

我自己排查了几个小时后,发现快速重启是最简单的解决方案!

检查步骤和常见问题
仔细检查 Firebase 指南中的设置步骤,确保所有配置均正确。

安装 CocoaPods 时出错:
如果您遇到安装错误,例如:

<br>
   error: RPC failed; curl stream was reset<br>
   error: 6428 bytes of body are still expected<br>
   
登录后复制

这可能是由于网络问题造成的。尝试从 Wi-Fi 切换到移动热点(反之亦然),然后重试安装。有时,更改网络可以解决与连接相关的 Pod 安装问题。如果这不能解决问题,您可能需要尝试其他故障排除提示,例如清除 CocoaPods 缓存或更新 Xcode。

在 iOS 中允许 HTTP URL(应用程序传输安全):
如果您使用 HTTP URL 进行 API 请求(而不是 HTTPS),则需要更新 iOS Info.plist 文件,以避免由于应用程序传输安全 (ATS) 限制而阻止连接。在 Info.plist 文件中添加以下行:


import { Platform, PermissionsAndroid } from 'react-native';

async function requestNotificationPermission() {
// Version >= 33(`~project/build.gradle`)
  if (Platform.OS === 'android' ) {
    const granted = await PermissionsAndroid.request(
      PermissionsAndroid.PERMISSIONS.POST_NOTIFICATIONS,
    );

    if (granted === PermissionsAndroid.RESULTS.GRANTED) {
      console.log('Notification permission granted');
    } else {
      console.log('Notification permission denied');
    }
  }
}


登录后复制
登录后复制

这将允许您的应用程序不受干扰地发出 HTTP 请求。在生产应用程序中谨慎对待此设置,并尽可能将其限制在开发环境中。

确保应用程序传输安全 (ATS) 兼容性:
对于 iOS,请确保您使用的任何 HTTPS 端点均符合 ATS 标准。如果您使用临时服务器或自签名证书进行测试,请确保它们与 ATS 兼容,因为 Firebase 需要安全连接才能与 APN(Apple 推送通知服务)进行通信。

结论:
在 React Native 中设置 Firebase Cloud Messaging 非常简单,但轻微的设置错误或设备配置怪癖可能会导致问题。遵循本指南和故障排除提示应该可以帮助您顺利运行通知。对于任何其他问题,您可以查看官方文档、论坛或 GitHub 讨论,查找其他开发者分享的解决方案。

编码快乐!!!!!

以上是排查 React Native Firebase 的常见问题 - 云消息传递的详细内容。更多信息请关注PHP中文网其他相关文章!

来源:dev.to
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
作者最新文章
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板