sending POST request to FCM not accepting authorization header in angular

问题

So I'm trying to use FCM to send notifications from Angular web application to mobile app using Firebase cloud messaging..

but I'm getting 401 response "the request was missing an Authentication Key", I tested the the same request on POSTMAN and it was working but on angular it is not..

here is my my code :

pushNotification(title , body){


this.http.post('https://fcm.googleapis.com/fcm/send' , {
  header: {
    'Content-Type':  'application/json',
    'Authorization' :  'key='+ environment.cloudMessages.serverKey
  }, 
  body: {
    "notification": {
      "title": title   ,
      "body":  body,
      "mutable_content": true      
      },
      "priority":"high",
  }
}).subscribe(res => {
  console.log(res);
})

}
}

Where my key is the server key from cloud messaging..

回答1:

You have to send the headers in as options parameter on the post.

let headers = new HttpHeaders({
  'Content-Type': 'application/json',
  Authorization: 'key=' + FB_MSG.serverKey
});
let options = {
  headers: headers
}

回答2:

//Interfaces containing payload
export interface FCMData {
  body: string;
  title: string;
}

export interface FCMPayload {
  to: string;
  collapse_key: string;
  data: FCMData;
}

// this method sends the notification
  async sendNotifications(message: string) {

    const headers: HttpHeaders = new HttpHeaders({
      'Content-Type': 'application/json',
      Authorization: 'key=' + AppSettings.SERVER_TOKEN
    });
 

      const data: FCMData = {
        body: message,
        title: 'Sup!'
      };
      const fcmPayload: FCMPayload = {
        to: reg.token,
        collapse_key: 'type_a',
        data
      };

      this.http.post('https://fcm.googleapis.com/fcm/send' , fcmPayload , {headers}).subscribe(res => {
        console.log(res);
      });
    );
  }

To Receive the Data Payload in Kotlin, Inside your FirebaseMessagingService -> override fun onMessageReceived

 if (remoteMessage.data.isNotEmpty()) {
    const body= (remoteMessage.data as ArrayMap).valueAt(0)
 }

来源：https://stackoverflow.com/questions/62855809/sending-post-request-to-fcm-not-accepting-authorization-header-in-angular