Добавить работника сервиса для создания проекта приложения React - PullRequest
Новая
       9

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

0 голосов
/ 11 сентября 2018

Я устанавливаю систему уведомлений, которая называется «Подписчики», с проектом, созданным с помощью приложения «Реагировать». Они просят разработчика загрузить сервисного работника и включить его в корневой каталог проекта. Раньше мне никогда не приходилось устанавливать / использовать сервисного работника, что, скорее всего, является причиной моего недоразумения.

Как добавить сервисного работника в корневой каталог проекта React? В инструкциях сказано, что работник сервиса должен отображаться в корневом каталоге как https://yoursite.com/firebase-messaging-sw.js.. Чтобы зарегистрировать этот URL, я включил работника сервиса в src / index.js: 

import Environment from './Environment'

export default function LocalServiceWorkerRegister() {
    const swPath = `${Environment.getSelfDomain()}/firebase-messaging-sw.js`;
    if ('serviceWorker' in navigator) {
      window.addEventListener('load', function() {
        navigator.serviceWorker.register(swPath).then(function(registration) {
          // Registration was successful
          console.log('ServiceWorker registration successful with scope: ', registration.scope);
        }, function(err) {
          // registration failed :(
          console.log('ServiceWorker registration failed: ', err);
        });
      });
    }
}

На производстве я получаю ошибку 404. Я попытался поместить файл firebase-messaging-sw.js в корневой каталог и в папку src. Одна и та же ошибка каждый раз.

Вот инструкции от подписчиков: https://subscribers.freshdesk.com/support/solutions/articles/35000013054-diy-installation-instructions

1 Ответ

0 голосов
/ 10 октября 2018

Папка public является предоставленным «аварийным люком» для добавления ресурсов извне системы модуля. Из документов :

Если вы поместите файл в общую папку, он будет не обрабатываться Webpack. Вместо этого он будет скопирован в папку сборки без изменений. Для ссылки на ресурсы в общей папке необходимо использовать специальную переменную с именем PUBLIC_URL

Итак, скопировав в папку public, вы будете ссылаться на файл следующим образом: 

import Environment from './Environment'

export default function LocalServiceWorkerRegister() {
    const swPath = `${process.env.PUBLIC_URL}/firebase-messaging-sw.js`;
    if ('serviceWorker' in navigator) {
      window.addEventListener('load', function() {
        navigator.serviceWorker.register(swPath).then(function(registration) {
          // Registration was successful
          console.log('ServiceWorker registration successful with scope: ', registration.scope);
        }, function(err) {
          // registration failed :(
          console.log('ServiceWorker registration failed: ', err);
        });
      });
    }
}
...