首页 > 解决方案 > ReactJS 应用程序中的 oneSignal 集成问题

问题描述

我在 React JS 应用程序中集成 oneSignal 推送通知。我发现了很多关于 react native 的帮助,但它们不是 react JS 的文档。所以我们开始使用 JavaScript 进行集成。

我们正在使用 Helmet 模块将 oneSignal 配置放在 head 标签中,但 oneSignal 没有被初始化。oneSignal 的官方文档链接是 https://documentation.onesignal.com/docs/web-push-typical-setup

render () {
if (this.state.isLoading) {
  return (
    <Loader/>
  )
}
return (  
<JssProvider generateClassName={generateClassName}>
    <div className="main-container">
      <Helmet>
        <link rel="manifest" href="/manifest.json"/>
        <script src="https://cdn.onesignal.com/sdks/OneSignalSDK.js" async=""></script>
          var OneSignal = window.OneSignal || [];
          OneSignal.push(function()
          OneSignal.init(
            appId: "a00000aa-000a-0ad0-aaa0-000a0aa0aa00",
            allowLocalhostAsSecureOrigin: true,
          );
        );
      </Helmet>
    </div>
  </JssProvider>
)}}

实际上,我必须使用头盔将所有这些代码放入 React JS 标头中。请找到这个接受的答案。我必须在使用 web-push-sdk 通过网页响应 JS OneSignal 订阅用户时做完全相同的事情

标签: javascriptreactjsonesignal

解决方案


例如,您可以检查用户是否登录,然后初始化一个信号。如果用户登录,则将此 cdn <script src="https://cdn.onesignal.com/sdks/OneSignalSDK.js" async=""></script>文件放在 index.html 的 head 部分中

this.initOneSignalNotification();

当您的应用程序第一次加载时。

否则用户未登录然后调用

this.initOneSignalNotification();

用户登录后。我认为此解决方案将解决您的问题。

initOneSignalNotification(){
var OneSignal = window.OneSignal || [];
          OneSignal.push(function()
          OneSignal.init(
            appId: "a00000aa-000a-0ad0-aaa0-000a0aa0aa00",
            allowLocalhostAsSecureOrigin: true,
          );
        );
}

推荐阅读