Как использовать Firebase JS SDK внутри Iframe, который загружает скрипт, содержащий Firebase? - PullRequest
0 голосов
/ 06 июня 2018

При попытке получить токен Firebase в моем приложении React появляется следующая ошибка:

browserErrorMessage: "Failed to register a ServiceWorker: No URL is associated with the caller's document."
code: "messaging/failed-serviceworker-registration"
message: "Messaging: We are unable to register the default service worker. Failed to register a ServiceWorker: No URL is associated with the caller's document. (messaging/failed-serviceworker-registration)."

Мое приложение - это виджет чата, который должен быть загружен на любой странице.Когда страница содержит мой файл JavaScript, мое приложение загружается и создает Iframe.Внутри Iframe включен другой скрипт, который содержит весь код виджета чата и библиотеку Firebase.

index.html

<!DOCTYPE html>
<html>
  <head>
    <script src="https://example.net/lib.js"></script>
  </head>
  <body>
    <script>
      Lib.init({});
    </script>
  </body>
</html>

lib.js

const div = document.createElement('div');
div.setAttribute('id', Components.ID_DIV);
document.body.appendChild(div);

const iframe = document.createElement('iframe');
iframe.setAttribute('id', Components.ID_FRAME);
iframe.setAttribute('allowFullScreen', '');
iframe.setAttribute('frameborder', '0');
iframe.setAttribute('scrolling', 'no');
iframe.className = Components.CLASS_BUTTON;
div.appendChild(iframe);

const iframeDocument = iframe.contentDocument;
iframeDocument.open();
iframeDocument.write(`
  <!DOCTYPE html>
  <html>
    <head>
      <script src="https://example.net/frame.js"></script>
    </head>
    <body/>
  </html>
`);
iframeDocument.close();

frame.js

const config = {
  apiKey: '<API_KEY>',
  projectId: '<PROJECT_ID>',
  messagingSenderId: '<SENDER_ID>',
};
firebase.initializeApp(config);
const messaging = firebase.messaging();
messaging.getToken().then((currentToken) => {
  if (currentToken) {
    console.log(currentToken);
  } else {
    messaging.requestPermission().then(() => {
      console.log('Notification permission granted.');
    }).catch((err) => {
      console.log('Unable to get permission to notify.', err);
    });
  }
}).catch((err) => {
  console.log('An error occurred while retrieving token. ', err);
});

Конфигурация Firebase будет предоставлена ​​клиентом.
Я запускаю все, используя HTTPS, включая страницу index.html.
Как заставить Firebase работать втакое приложение?

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...