Question

我将开发一个使用Firebase Push Notification的react-native应用程序，当我从Firebase Console发送推送通知时，它既可以在应用程序的后台运行，也可以在前台运行，但是当我使用PHP从服务器发送通知时（ WordPress）仅在应用程序处于前台而不是后台时发送通知，但通知消息结果显示成功。在这里，我将提供一些代码

移动端：

        import React, { Component } from "react";

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

    import FCM, { FCMEvent, RemoteNotificationResult, WillPresentNotificationResult, NotificationType } from "react-native-fcm";

    export default class PushNotificationController extends
      Component {
      constructor(props) {
        super(props);
        console.ignoredYellowBox = ['Setting a timer'];

        this.state = {
          firebase_token :'',
        }
      }
      saveFirebaseToken() {
        console.log("------------- as "+this.state.firebase_token+" ---------- ");
        AsyncStorage.setItem('firebase_token', this.state.firebase_token);
      }
      componentDidMount() {
        FCM.requestPermissions();

        FCM.getFCMToken().then(token => {
          console.log(token+' on getFCMToken');

          this.setState({

            firebase_token: token,
          })
          this.saveFirebaseToken()
        });

        FCM.getInitialNotification().then(notif => {
          console.log("INITIAL NOTIFICATION", notif)
        });

        this.notificationListner = FCM.on    (FCMEvent.Notification, notif => {
          console.log("Notification", notif);
          if (notif.local_notification) {
            return;
          }
          if (notif.opened_from_tray) {
            return;
          }

          if (Platform.OS === 'ios') {
            //optional
            //iOS requires developers to call completionHandler to end notification process. If you do not call it your background remote notifications could be throttled, to read more about it see the above documentation link.
            //This library handles it for you automatically with default behavior (for remote notification, finish with NoData; for WillPresent, finish depend on "show_in_foreground"). However if you want to return different result, follow the following code to override
            //notif._notificationType is available for iOS platfrom
            switch (notif._notificationType) {
              case NotificationType.Remote:
                notif.finish(RemoteNotificationResult.NewData) //other types available: RemoteNotificationResult.NewData, RemoteNotificationResult.ResultFailed
                break;
              case NotificationType.NotificationResponse:
                notif.finish();
                break;
              case NotificationType.WillPresent:
                notif.finish(WillPresentNotificationResult.All) //other types available: WillPresentNotificationResult.None
                break;
            }
          }
          this.showLocalNotification(notif);
        });

        this.refreshTokenListener = FCM.on(FCMEvent.RefreshToken, token => {
          console.log("TOKEN (refreshUnsubscribe)", token);
        });
      }

      showLocalNotification(notif) {
        FCM.presentLocalNotification({
          title: notif.title,
          body: notif.body,
          priority: "high",
          click_action: notif.click_action,
          show_in_foreground: true,
          local: true
        });
      }

      componentWillUnmount() {
        this.notificationListner.remove();
        this.refreshTokenListener.remove();
      }
      render() {
        return null;
      }
    }

在清单中添加了代码：

    <receiver android:name="com.evollu.react.fcm.FIRLocalMessagingPublisher"/>
     <receiver android:enabled="true" android:exported="true"  android:name="com.evollu.react.fcm.FIRSystemBootEventReceiver">
         <intent-filter>
             <action android:name="android.intent.action.BOOT_COMPLETED"/>
            <action android:name="android.intent.action.QUICKBOOT_POWERON"/>
             <action android:name="com.htc.intent.action.QUICKBOOT_POWERON"/>
             <category android:name="android.intent.category.DEFAULT" />
         </intent-filter>
     </receiver>
       <service android:name="com.evollu.react.fcm.MessagingService" android:enabled="true" android:exported="true">
    <intent-filter>
      <action android:name="com.google.firebase.MESSAGING_EVENT"/>
    </intent-filter>
  </service>

  <service android:name="com.evollu.react.fcm.InstanceIdService" android:exported="false">
    <intent-filter>
      <action android:name="com.google.firebase.INSTANCE_ID_EVENT"/>
    </intent-filter>
 </service>

这是服务器代码：

        function send_notification($tokens, $message)
    {


        $url = 'https://fcm.googleapis.com/fcm/send';
        $fields = array(
             'registration_ids' => $tokens,
             'data' => $message
            );
        $headers = array(
            'Authorization:key = My_KEY',
            'Content-Type: application/json'
            );

       $ch = curl_init();
       curl_setopt($ch, CURLOPT_URL, $url);
       curl_setopt($ch, CURLOPT_POST, true);
       curl_setopt($ch, CURLOPT_HTTPHEADER, $headers);
       curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
       curl_setopt ($ch, CURLOPT_SSL_VERIFYHOST, 0);  
       curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false);
       curl_setopt($ch, CURLOPT_POSTFIELDS, json_encode($fields));
       $result = curl_exec($ch);           
       if ($result === FALSE) {
           die('Curl failed: ' . curl_error($ch));
       }
       curl_close($ch);

       return $result;
    }

Answer 1

希望我能找到一个我的朋友并在底部链接的帮助下解决此问题。

解决方案：，我需要重新格式化发送给Firbase服务器的数据，此处涉及用于自定义数据发送和通知的有效负载问题。

function send_notification($tokens, $message)
  {


      $url = 'https://fcm.googleapis.com/fcm/send';


      $msg = array
             (
                'body'      => $data,
                'title'     => "New Job",
                'sound'     => 'default',
                'vibrate'   => 1,
                'largeIcon' => 'large_icon',
                'smallIcon' => 'small_icon'

            );

            $dat = array
            (
                'job_id'     => "90",
                'emp_id'     => "9000",
                'cand_id'     => "1010001"
            );

            $fields = array
            (
                'registration_ids'  => array($tokens),
                'notification'      => $msg,
                'data'       => $dat
            );

      $headers = array(
          'Authorization:key = My_KEY',
          'Content-Type: application/json'
          );

     $ch = curl_init();
     curl_setopt($ch, CURLOPT_URL, $url);
     curl_setopt($ch, CURLOPT_POST, true);
     curl_setopt($ch, CURLOPT_HTTPHEADER, $headers);
     curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
     curl_setopt ($ch, CURLOPT_SSL_VERIFYHOST, 0);  
     curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false);
     curl_setopt($ch, CURLOPT_POSTFIELDS, json_encode($fields));
     $result = curl_exec($ch);           
     if ($result === FALSE) {
         die('Curl failed: ' . curl_error($ch));
     }
     curl_close($ch);

     return $result;
  }

同样，功劳归功于@HarikumarAlangode。

Make a custom data for parameter on firebase to call on push notification

Answer 2

通知有效负载对象

$ docker-compose up --build
Building apollo
Step 1/10 : FROM node:current-slim
 ---> f3f62dfcc735
Step 2/10 : WORKDIR /app
 ---> Using cache
 ---> 33088e65c748
Step 3/10 : ENV PATH=/app/node_modules/.bin:$PATH
 ---> Using cache
 ---> c7f742267b26
Step 4/10 : COPY package.json .
 ---> Using cache
 ---> 76285ea4a8ca
Step 5/10 : RUN npm init --yes
 ---> Using cache
 ---> 29a3d715136b
Step 6/10 : RUN npm install --save cors apollo-server-express express graphql reflect-metadata type-graphql apollo-datasource-rest soap jsonwebtoken --yes
 ---> Running in 1e4472bcd901
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR! 
npm ERR! While resolving: apollo-express-server@1.0.0
npm ERR! Found: graphql@15.4.0
npm ERR! node_modules/graphql
npm ERR!   graphql@"^15.3.0" from the root project
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer graphql@"^0.12.0 || ^0.13.0 || ^14.0.0" from graphql-middleware@4.0.2
npm ERR! node_modules/graphql-middleware
npm ERR!   graphql-middleware@"^4.0.2" from the root project
npm ERR! 
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR! 
npm ERR! See /root/.npm/eresolve-report.txt for a full report.

npm ERR! A complete log of this run can be found in:
npm ERR!     /root/.npm/_logs/2020-11-05T16_19_42_605Z-debug.log
ERROR: Service 'apollo' failed to build : The command '/bin/sh -c npm install --save cors apollo-server-express express graphql reflect-metadata type-graphql apollo-datasource-rest soap jsonwebtoken --yes' returned a non-zero code: 1

有关更多信息：https://firebase.google.com/docs/cloud-messaging/concept-options

Firebase推送通知不会使用react-native在后台发送通知

2 个答案: