问题描述 #

我在React Native项目中集成OneSignal推送服务时遇到了报错，不管用Hooks还是类组件写法都会出现以下错误：

TypeError: _reactNativeOnesignal.default.init is not a function. (In '_reactNativeOnesignal.default.init('a6a1f13d-8823-4d98-86c9-d99aef433795')', '_reactNativeOnesignal.default.init' is undefined)

我的Hooks写法代码如下：

import OneSignal from 'react-native-onesignal';

// 省略其他组件代码
useEffect(() => { 
  OneSignal.setLogLevel(6, 0); 
  OneSignal.init('a6a1f13d-8823-4d98-86c9-d99aef433795', { 
    kOSSettingsKeyAutoPrompt: false, 
    kOSSettingsKeyInAppLaunchURL: false, 
    kOSSettingsKeyInFocusDisplayOption: 2, 
  }); 
  OneSignal.inFocusDisplaying(2); 
  OneSignal.addEventListener('received', onReceived); 
  OneSignal.addEventListener('opened', onOpened); 
  OneSignal.addEventListener('ids', onIds); 
  return () => { 
    OneSignal.removeEventListener('received', onReceived); 
    OneSignal.removeEventListener('opened', onOpened); 
    OneSignal.removeEventListener('ids', onIds); 
  }
}, []); 

const onReceived = (notification) => { 
  console.log('Notification received: ', notification);
} 

const onOpened = (openResult) => { 
  console.log('Message: ', openResult.notification.payload.body); 
  console.log('Data: ', openResult.notification.payload.additionalData); 
  console.log('isActive: ', openResult.notification.isAppInFocus); 
  console.log('openResult: ', openResult)
} 

const onIds = (device) => { 
  console.log('Device info: ', device)
}

解决方案 #

这个错误我之前在升级OneSignal的时候也碰到过，核心原因是OneSignal v4.x版本彻底重构了API，你写的是旧版（v3及以下）的代码，但安装的是新版包，所以找不到init方法。下面给你两种解决思路：

思路1：升级代码适配v4+版本 #

v4+版本把init改成了initialize，而且事件监听的API也做了调整，修改后的代码应该是这样：

import OneSignal from 'react-native-onesignal';

// 省略其他组件代码
useEffect(() => { 
  OneSignal.setLogLevel(6, 0); 
  // 把init换成initialize，只传入你的appId即可
  OneSignal.initialize('a6a1f13d-8823-4d98-86c9-d99aef433795');
  
  // 替换旧的inFocusDisplaying配置，自定义前台通知展示逻辑
  OneSignal.setNotificationWillShowInForegroundHandler(notificationReceivedEvent => {
    const notification = notificationReceivedEvent.getNotification();
    // 这里对应旧版的kOSSettingsKeyInFocusDisplayOption=2，直接展示通知
    notificationReceivedEvent.complete(notification);
  });

  // 替换旧的opened事件监听
  OneSignal.setNotificationOpenedHandler(openResult => {
    console.log('Message: ', openResult.notification.body); 
    console.log('Data: ', openResult.notification.additionalData); 
    console.log('isActive: ', openResult.notification.isAppInFocus); 
    console.log('openResult: ', openResult)
  });

  // 替换旧的ids事件监听，获取设备订阅ID
  OneSignal.addSubscriptionObserver(event => {
    if (event.subscription.userId) {
      console.log('Device info: ', { userId: event.subscription.userId });
    }
  });

  // 如果需要关闭自动弹窗（对应旧版kOSSettingsKeyAutoPrompt: false），可以手动触发授权弹窗
  // OneSignal.promptForPushNotificationsWithUserResponse(response => {
  //   console.log("用户授权结果:", response);
  // });

  // v4+版本不需要手动移除监听，组件卸载时内部会自动清理
}, []);

思路2：回退到v3.x版本继续使用旧代码 #

如果你不想修改现有代码，可以卸载当前版本，安装v3.x的稳定版：

# 先卸载当前的新版OneSignal
npm uninstall react-native-onesignal
# 安装v3.x最后一个稳定版本
npm install react-native-onesignal@3.9.3 --save

然后iOS端进入ios目录执行pod install，Android端同步一下项目（比如用Android Studio打开项目同步），这样你的原有代码就能正常运行了。

额外检查点 #

• 确认你的导入语句是正确的：import OneSignal from 'react-native-onesignal';，不要使用解构导入（比如import { OneSignal } from ...），旧版OneSignal不支持这种导入方式。
• 检查原生端配置是否完整：Android的AndroidManifest.xml和iOS的Info.plist有没有按照官方文档配置好推送权限和OneSignal的相关项，漏配置也可能导致奇怪的运行时错误。

内容的提问来源于stack exchange，提问作者code iam07