如何使用浏览器修复Firebase SDK问题?

我在vuejs中使用Firebase设置推送通知。它与localhost一起使用,可能也可以在生产中使用。但是,当我使用“ yarn android”将其部署到android时,不会呈现该应用,并且此错误会在控制台中显示:

Uncaught Error: Messaging: This browser doesn't support the API's required to use the firebase SDK. (messaging/unsupported-browser).
    at Object.n [as messaging] (file:///android_asset/www/js/chunk-vendors.df02e511.js:484:69)
    at t._getService (file:///android_asset/www/js/chunk-vendors.df02e511.js:557:410951)
    at t.(anonymous function) [as messaging] (file:///android_asset/www/js/chunk-vendors.df02e511.js:590:1186)
    at Module.56d7 (file:///android_asset/www/js/app.1025a72c.js:1:21109)
    at c (file:///android_asset/www/js/app.1025a72c.js:1:2396)
    at Object.0 (file:///android_asset/www/js/app.1025a72c.js:1:7028)
    at c (file:///android_asset/www/js/app.1025a72c.js:1:2396)
    at t (file:///android_asset/www/js/app.1025a72c.js:1:388)
    at 0 (file:///android_asset/www/js/app.1025a72c.js:1:6993)
    at file:///android_asset/www/js/app.1025a72c.js:1:6998

这是我正在利用的代码:

public / firebase-messaging-sw.js

importScripts('https://www.gstatic.com/firebasejs/3.9.0/firebase-app.js');
importScripts('https://www.gstatic.com/firebasejs/3.9.0/firebase-messaging.js');

var config = {
    apiKey: "",authDomain: "",databaseURL: "",projectId: "",storageBucket: "",messagingSenderId: "",appId: "",measurementId: ""
};

firebase.initializeApp(config);

let messaging = firebase.messaging();
messaging.setBackgroundMessageHandler(function (payload) {
    const promiseChain = clients
        .matchAll({
            type: "window",includeUncontrolled: true
        })
        .then(windowClients => {
            for (let i = 0; i < windowClients.length; i++) {
                const windowClient = windowClients[i];
                windowClient.postMessage(payload);
            }
        })
        .then(() => {
            return registration.showNotification("my notification title");
        });
    return promiseChain;
});

/src/pushNotification.js

import * as firebase from "firebase/app";
import "firebase/messaging";

const initializedFirebaseApp = firebase.initializeApp({
    apiKey: "",measurementId: ""
});
export const messaging = initializedFirebaseApp.messaging();
messaging.usePublicVapidKey(
    ""
);

/src/main.js

if ("serviceWorker" in navigator) {
  navigator.serviceWorker
    .register("./firebase-messaging-sw.js")
    .then(function (registration) {
      console.log("Registration successful,scope is:",registration.scope);
    })
    .catch(function (err) {
      console.log("Service worker registration failed,error:",err);
    });
}
navigator.serviceWorker.addEventListener("message",message => {
  let data = message.data["firebase-messaging-msg-data"].notification
  var notificationTitle = data.title;
  var notificationOptions = {
    body: data.body,};
  var notification = new Notification(notificationTitle,notificationOptions);
  notification.onclick = function (event) {
    notification.close();
    console.log(event);
  };
});

/src/app.vue

<script>
import { messaging } from "./pushNotification";
export default {
  mounted() {
    messaging
      .requestPermission()
      .then(async function() {
        const token = await messaging.getToken();
        console.log(token);
      })
      .catch(function(err) {
        console.log("Unable to get permission to notify.",err);
      });
  }
};
</script>

我该如何解决这个问题,介意当我将焦点放在选项卡上或不在使用FMC API的浏览器中时,可以将其推送?

liyaozong 回答:如何使用浏览器修复Firebase SDK问题?

暂时没有好的解决方案,如果你有好的解决方案,请发邮件至:iooj@foxmail.com
本文链接:https://www.f2er.com/3144326.html

大家都在问