Блог

Главная - Вопросы по программированию - Не удалось подключить расширение браузера для обмена сообщениями Firebase с помощью пустого ключа

Не удалось подключить расширение браузера для обмена сообщениями Firebase с помощью пустого ключа

# #javascript #google-chrome-extension #firebase-authentication #firebase-cloud-messaging

Вопрос:

Я пытаюсь подключить локальное расширение браузера Chrome к firebase для получения сообщений. Я получаю сообщение об ошибке всякий раз, когда пытаюсь использовать свой пустой ключ в запросе getToken.

введите описание изображения здесь

манифест.json

 {
  "version": "1.0.0",
  "name": "Chrome Test",
  "manifest_version": 2,
  "permissions": ["notifications"],
  "browser_action": {
    "default_popup": "popup.html"
  },
  "background": {
    "page": "popup.html"
  },
  "description": "Chrome Test.",
  "content_security_policy": "script-src 'self' https://www.gstatic.com; object-src 'self'"
}

popup.html

 <!DOCTYPE html>
<html>
  <head>
    <title>Chrome Test</title>
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no"
    />
  </head>
  <body>
    <p id="pushLabel">Test Label.</p>
    <script src="https://www.gstatic.com/firebasejs/7.13.1/firebase-app.js"></script>
    <script src="https://www.gstatic.com/firebasejs/7.13.1/firebase-auth.js"></script>
    <script src="https://www.gstatic.com/firebasejs/7.13.1/firebase-messaging.js"></script>
    <script src="popup.js"></script>
  </body>
</html>

popup.js

 const firebaseConfig = {
  ...config
};

firebase.initializeApp(firebaseConfig);

const messaging = firebase.messaging();
messaging.usePublicVapidKey(
  "<vapid key>"
);

console.log("Firebase: ", messaging);

messaging
  .getToken()
  .then((currentToken) => {
    if (currentToken) {
      console.log("getToken success: ", currentToken);
    } else {
      console.log("getToken failure");
    }
  })
  .catch((err) => {
    console.log("getToken error: ", err);
  });

messaging.onTokenRefresh(() => {
  messaging
    .getToken()
    .then((refreshedToken) => {
      console.log("getToken success: ", refreshedToken);
    })
    .catch((err) => {
      console.log("onTokenRefresh error: ", err);
    });
});

messaging.onMessage((payload) => {
  console.log("Message received: ", payload);
});

I receive this error in my console:

Has anyone encountered something like this before with a browser extension? I’m wondering if there are any gotchas when trying to connect through a chrome extension.

Метки: