在本机反应中通过 rest api 通知

Posted 2023-02-24

【中文标题】在本机反应中通过 rest api 通知

【英文标题】：Notification via rest api in react native

【发布时间】：2020-12-23 12:17:42

【问题描述】：

我正在尝试通过 rest api 在本机反应中发送通知。作为回应，我得到了成功：1。这里的问题是我在模拟器中没有收到通知。

  const token = await firebase.messaging().getToken();
  console.log("token in sendNotification ",token)

  const FIREBASE_API_KEY = "firebaseApiKey";
    const message = 
      to :token,
      notification: 
        title: "This is a Notification",
        boby: "This is the body of the Notification",
        vibrate: 1,
        sound: 1,
        show_in_foreground: true,
        priority: "high",
        content_available: true,
      
    
    
    let headers = new Headers(
      "Content-Type" : "application/json",
      Authorization: "key=" + FIREBASE_API_KEY,
    )
  
    try 
      let response = await fetch ("https://fcm.googleapis.com/fcm/send",
      method: "POST",
      headers,
      body: JSON.stringify(message),
    )
    response = await response.json();
    console.log("response ", response);
     catch (error) 
      console.log("error ", error);
    

【问题讨论】：

这是我的回复 ==> 回复 "canonical_ids": 0, "failure": 0, "multicast_id": 2350855586737790500, "results": ["message_id": "0:1608723466390973% 5c006c385c006c38"], "成功": 1

也许这就是你要找的东西***.com/a/20522130/12645152

firebaser here 您的方法要求您将 FCM 服务器密钥（称为 const FIREBASE_API_KEY = "firebaseApiKey"）放入在客户端计算机上运行的代码中。顾名思义，FCM 服务器密钥只能在受信任的环境中使用，因为拥有该密钥的人可以向您的应用程序的所有用户发送他们想要的任何消息。正如您可能想象的那样，这将是一个相当大的安全风险，这就是为什么推荐的架构如下所示：firebase.google.com/docs/cloud-messaging/fcm-architecture

@FrankvanPuffelen 我使用了我的 firebase 服务器密钥（const FIREBASE_API_KEY = "firebaseApiKey"）。作为回应，我取得了成功，但我无法收到通知

【参考方案1】：

https://firebase.google.com/docs/cloud-messaging/js/receive

您可以按照传入消息文档进行操作

// Handle incoming messages. Called when:
// - a message is received while the app has a focus
// - the user clicks on an app notification created by a service worker
//   `messaging.setBackgroundMessageHandler` handler.
      messaging.onMessage((payload) => 
      console.log('Message received. ', payload);
// ...
     );

在 App.js 的 useEffect 中

import React,useEffect from 'react'


importView,Text from 'react-native';

    async function onDisplayNotification() 
    // Create a channel
    const channelId = await notifee.createChannel(
      id: 'default',
      name: 'Default Channel',
    );

    // Display a notification
    await notifee.displayNotification(
      title: 'Notification Title',
      body: 'Main body content of the notification',
      android: 
        channelId,
        smallIcon: 'ic_launcher', // optional, defaults to 'ic_launcher'.
      ,
    );
  

const App=()=> 




        useEffect(() => 
    // Assume a message-notification contains a "type" property in the data payload of the screen to open


    messaging().onMessage((payload) => 
      console.log('Message received. ', payload);

      onDisplayNotification();


  // ...
    );

    messaging().onNotificationOpenedApp(remoteMessage => 
      console.log(
        'Notification caused app to open from background state:',
        remoteMessage.notification,
      );
        alert("Notification");
    );

    // Check whether an initial notification is available
    messaging()
      .getInitialNotification()
      .then(remoteMessage => 
        if (remoteMessage) 
          console.log(
            'Notification caused app to open from quit state:',
            remoteMessage.notification,
          );

        
      );
  , []);






    return (
        <View>
            
        </View>
    )


export default App;