FCM not working in Flutter Web (background & foreground)

[blackshadowsoftwareltd]

I have configured by following flutterfire
my code

FirebaseMessaging messaging = FirebaseMessaging.instance;
String? _token;
late Stream<String> _tokenStream;

void fcmTokenStream() {
  FirebaseMessaging.instance
      .getToken(
          vapidKey:
              'BFg7SDSZ92cUlLfRctaenx2UYREawDxrcz6DJ4HADijdtSIZcq3etMOt82WZdHGLVNLqYEZNFEsdphXjwJ-kKSY')
      .then(setToken)
      .catchError((e) {
    log('Error getting FCM token: $e');
    return e;
  });
  _tokenStream = FirebaseMessaging.instance.onTokenRefresh;
  _tokenStream.listen(setToken);
}

void setToken(String? token) {
  _token = token;
  log('set FCM token: $_token');
}

Future<void> initFCM() async {
  final authorized = await hasFCMPermission();
  if (!authorized) return;
  log('...');
}
Future<bool> hasFCMPermission() async {
  NotificationSettings settings =
      await FirebaseMessaging.instance.getNotificationSettings();
  if (settings.authorizationStatus == AuthorizationStatus.authorized) {
    return true;
  }
  settings = await messaging.requestPermission(
    alert: true,
    announcement: false,
    badge: true,
    carPlay: false,
    criticalAlert: false,
    provisional: false,
    sound: true,
  );

  log('User granted permission: ${settings.authorizationStatus}');
  if (settings.authorizationStatus == AuthorizationStatus.authorized) {
    return true;
  }

  return false;
}
void listenForgroundMessage() {
  log('. . . . . . .');
  FirebaseMessaging.onMessage.listen((RemoteMessage message) {
    log('Got a message whilst in the foreground!');
    log('Message data: ${message.data}');

    if (message.notification != null) {
      log('Message also contained a notification: ${message.notification}');
    }
  });
}

Future<void> firebaseMessagingBackgroundHandler(RemoteMessage message) async {
  await Firebase.initializeApp(
    name: (kDebugMode && !kIsWeb) ? 'FoodOSResDev' : null,
    options: DefaultFirebaseOptions.currentPlatform,
  );

  print("Handling a background message: ${message.messageId}");
}

OAuth 2.0

POST /v1/projects/foo-60008/messages:send HTTP/1.1
Host: fcm.googleapis.com
Content-length: 261
Content-type: application/json
Authorization: Bearer ya29.a0AfB_byDKxMF_jMdikaLbhCWeJAByp1ziUMROopLYdGA5ZVHtZp-R6X22ekQyUw5Xafe-42Umv0PHzclCRjlXZSdhGcw94p2I5Chhh8SDCpYFJ-TuClIqTD6UdSEGLbH7ahLjYfP4c2t-bKWR9YuKMC5DVR3OE1waCgYKAQYSARMSFQHsvYlsh5TFXv2UlkVgXJPwqEWCqQ0173

{
   "message":{
      "token":"dx-ZIogXbOvj114N5hXziP:APA91bFDZ-7Q�mJwWSQs2AfGS4OrTb6ybX3kkA8Cr_iBm4dgM_jj8U9ZrO5oP3",
      "data":{},
      "notification":{
        "title":"FCM Message",
        "body":"This is an FCM notification message!"
      }
   }
}

OAuth Response

HTTP/1.1 400 Bad Request
Content-length: 302
X-xss-protection: 0
X-content-type-options: nosniff
Transfer-encoding: chunked
Vary: Origin, X-Origin, Referer
Server: scaffolding on HTTPServer2
-content-encoding: gzip
Cache-control: private
Date: Sat, 19 Aug 2023 15:27:07 GMT
X-frame-options: SAMEORIGIN
Alt-svc: h3=":443"; ma=2592000,h3-29=":443"; ma=2592000
Content-type: application/json; charset=UTF-8

{
  "error": {
    "status": "INVALID_ARGUMENT", 
    "message": "The registration token is not a valid FCM registration token", 
    "code": 400, 
    "details": [
      {
        "errorCode": "INVALID_ARGUMENT", 
        "@type": "type.googleapis.com/google.firebase.fcm.v1.FcmError"
      }
    ]
  }
}