fix(pwa): handle sw registration error and status (#858)

This commit is contained in:
Joaquín Sánchez 2023-01-08 15:12:25 +01:00 committed by GitHub
parent 5f07fd2515
commit e92a983947
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 41 additions and 21 deletions

View file

@ -180,9 +180,6 @@ export function getUsersIndexByUserId(userId: string) {
} }
export async function removePushNotificationData(user: UserLogin, fromSWPushManager = true) { export async function removePushNotificationData(user: UserLogin, fromSWPushManager = true) {
if (!user.pushSubscription)
return
// clear push subscription // clear push subscription
user.pushSubscription = undefined user.pushSubscription = undefined
const { acct } = user.account const { acct } = user.account
@ -192,9 +189,12 @@ export async function removePushNotificationData(user: UserLogin, fromSWPushMana
delete useLocalStorage<PushNotificationPolicy>(STORAGE_KEY_NOTIFICATION_POLICY, {}).value[acct] delete useLocalStorage<PushNotificationPolicy>(STORAGE_KEY_NOTIFICATION_POLICY, {}).value[acct]
const pwaEnabled = useRuntimeConfig().public.pwaEnabled const pwaEnabled = useRuntimeConfig().public.pwaEnabled
const pwa = useNuxtApp().$pwa
const registrationError = pwa?.registrationError === true
const unregister = pwaEnabled && !registrationError && pwa?.registrationError === true && fromSWPushManager
// we remove the sw push manager if required and there are no more accounts with subscriptions // we remove the sw push manager if required and there are no more accounts with subscriptions
if (pwaEnabled && fromSWPushManager && (users.value.length === 0 || users.value.every(u => !u.pushSubscription))) { if (unregister && (users.value.length === 0 || users.value.every(u => !u.pushSubscription))) {
// clear sw push subscription // clear sw push subscription
try { try {
const registration = await navigator.serviceWorker.ready const registration = await navigator.serviceWorker.ready

View file

@ -2,30 +2,48 @@ import { useRegisterSW } from 'virtual:pwa-register/vue'
export default defineNuxtPlugin(() => { export default defineNuxtPlugin(() => {
const online = useOnline() const online = useOnline()
const registrationError = ref(false)
const swActivated = ref(false)
const registerPeriodicSync = (swUrl: string, r: ServiceWorkerRegistration) => {
setInterval(async () => {
if (!online.value)
return
const resp = await fetch(swUrl, {
cache: 'no-store',
headers: {
'cache': 'no-store',
'cache-control': 'no-cache',
},
})
if (resp?.status === 200)
await r.update()
}, 60 * 60 * 1000 /* 1 hour */)
}
const { const {
needRefresh, updateServiceWorker, needRefresh, updateServiceWorker,
} = useRegisterSW({ } = useRegisterSW({
immediate: true, immediate: true,
onRegisterError() {
registrationError.value = true
},
onRegisteredSW(swUrl, r) { onRegisteredSW(swUrl, r) {
if (!r || r.installing) // should add support in pwa plugin
return if (r?.active?.state === 'activated') {
swActivated.value = true
setInterval(async () => { registerPeriodicSync(swUrl, r)
if (!online.value) }
return else if (r?.installing) {
r.installing.addEventListener('statechange', (e) => {
const resp = await fetch(swUrl, { const sw = e.target as ServiceWorker
cache: 'no-store', swActivated.value = sw.state === 'activated'
headers: { if (swActivated.value)
'cache': 'no-store', registerPeriodicSync(swUrl, r)
'cache-control': 'no-cache',
},
}) })
}
if (resp?.status === 200)
await r.update()
}, 60 * 60 * 1000 /* 1 hour */)
}, },
}) })
@ -36,6 +54,8 @@ export default defineNuxtPlugin(() => {
return { return {
provide: { provide: {
pwa: reactive({ pwa: reactive({
swActivated,
registrationError,
needRefresh, needRefresh,
updateServiceWorker, updateServiceWorker,
close, close,