Я не могу хранить данные из setBackgroundMessageHandler

#javascript #angular #firebase #firebase-cloud-messaging

#javascript #угловой #firebase #firebase-облако-обмен сообщениями

Вопрос:

Я использую firebase для отправки уведомлений. Когда я получаю уведомление в фоновом режиме, я получаю данные. Я хочу сохранить эти данные в локальном хранилище, но я получаю эту ошибку

Ошибка типа: не удается прочитать свойство ‘setItem’ неопределенного

 importScripts('https://www.gstatic.com/firebasejs/3.9.0/firebase-app.js');
importScripts('https://www.gstatic.com/firebasejs/3.9.0/firebase-messaging.js');
firebase.initializeApp({
  messagingSenderId: '628214501041'
});
const messaging = firebase.messaging();
messaging.setBackgroundMessageHandler(function (payload) {
  console.log('[firebase-messaging-sw.js] Received background message ', payload);
  var notificationTitle = 'Background Message Title';
  var notificationOptions = {
    body: 'Background Message body.',
  };
  return self.registration.showNotification(notificationTitle,
    notificationOptions);
});
self.addEventListener('push', function (event) {
  var pushData = event.data.json();
  try {
    if(self.window.localStorage){
      self.localStorage.setItem('notificationData' , JSON.stringify(pushData) ) ;
    // }
  }
 catch (err) {
    console.log('Push error happened:', err);
  }
});
  

Комментарии:

1. Разве это не должно быть self.window.localStorage.setItem , поскольку это то, что вы проверяли в инструкции if ранее.

2. Это ваш сервисный работник?

3. Возможно ли перейти на последнюю версию FCM SDK? Вы используете довольно старую версию (в предыдущих версиях было много ошибок)

Ответ №1:

self Переменная, которую вы используете в своем коде, не является чем-то, что определено по умолчанию.

Но из вашего кода вы, вероятно, ищете:

 if(self.window.localStorage) {
  self.window.localStorage.setItem('notificationData' , JSON.stringify(pushData) ) ;
}
  

Таким образом, изменение там заключается в использовании self.window.localStorage , а не self.localStorage во второй строке.

Комментарии:

1. в этом случае у меня нет журнала ошибок, но я не получаю никакого ответа

Ответ №2:

Ну, вы не можете получить доступ к локальному хранилищу или хранилищу сеансов от вашего service worker, потому что у него нет доступа к DOM.

Вы должны использовать CacheAPI

Или для сохранения данных и доступа к ним из вашего service worker и экземпляра window используйте:

IndexedDB

Это входит в жизненный цикл вашего сервисного работника и также может быть доступно объекту window.

Комментарии:

1. Позвольте мне привести вам пример, я не понимаю

2. Извлечение данных в фоновом режиме осуществляется работниками службы. Они находятся между браузером и сетью. По соображениям безопасности работник службы не может напрямую получить доступ к локальному хранилищу, и вы получаете undefind объект. Я рекомендую прочитать это: developers.google.com/web/fundamentals/instant-and-offline /… .

3. итак, я должен использовать worker.postMessage () для передачи данных компонентам?

4. Я скорректировал свой ответ в соответствии с вашим вариантом использования.

5. Если я хочу использовать информацию уведомления, что я должен делать вне service worker?