добавляет оффлайн страницу
All checks were successful
continuous-integration/drone/push Build is passing

This commit is contained in:
Maxim Slipenko 2022-06-03 11:24:47 +03:00
parent 4b8e488517
commit 0c38005ec4
Signed by: Maks1mS
GPG Key ID: 7461AF39A8705FB8
4 changed files with 65 additions and 1 deletions

View File

@ -1,4 +1,58 @@
/* global self, caches */
import { precacheAndRoute } from 'workbox-precaching' import { precacheAndRoute } from 'workbox-precaching'
// eslint-disable-next-line no-undef
precacheAndRoute(self.__WB_MANIFEST) precacheAndRoute(self.__WB_MANIFEST)
const CACHE_NAME = 'static-v2'
const OFFLINE_URL = 'offline.html'
self.addEventListener('install', event => {
console.log('Install!')
event.waitUntil(
caches.open(CACHE_NAME).then(cache => {
return cache.addAll([
'/',
'/js/bundle.js',
'/css/index.css',
'/fonts/OpenSans-Bold.ttf',
'/fonts/OpenSans-Bold.woff',
'/fonts/OpenSans-Bold.woff2',
'/fonts/OpenSans-Regular.ttf',
'/fonts/OpenSans-Regular.woff',
'/fonts/OpenSans-Regular.woff2',
'/favicon.ico',
'/favicon.svg',
OFFLINE_URL
])
})
)
self.skipWaiting()
})
self.addEventListener('fetch', (event) => {
// Нам нужно вызвать функцию event.respondWith(), только если это запрос на переход между
// HTML-страницами.
if (event.request.mode === 'navigate') {
event.respondWith(
(async () => {
try {
const preloadResponse = await event.preloadResponse
if (preloadResponse) {
return preloadResponse
}
const networkResponse = await fetch(event.request)
return networkResponse
} catch (error) {
console.log('Не удалось получить данные; вместо этого возвращаем страницу для автономного режима.', error)
const cache = await caches.open(CACHE_NAME)
const cachedResponse = await cache.match(OFFLINE_URL)
return cachedResponse
}
})()
)
}
})

View File

@ -1,4 +1,7 @@
<main> <main>
<a href="/" class="block p-1 rounded-xl">
{{ '/src/images/logo.svg' | svgContents("max-h-12 block w-[50vw]") | safe }}
</a>
<article class="article-content"> <article class="article-content">
<h1>{{ note.data.title | safe }}</h1> <h1>{{ note.data.title | safe }}</h1>
{{ note.templateContent | safe }} {{ note.templateContent | safe }}

View File

@ -0,0 +1,5 @@
module.exports = {
layout: 'base.njk',
permalink: '/offline.html'
}

2
src/pages/offline.njk Normal file
View File

@ -0,0 +1,2 @@
<h1>Отсутствует подключение к сети</h1>
<a href="/">Вернуться на главную</a>