Progressive Web Apps
Boa tarde, tudo bem? Espero que sim!
Estou fazendo um projeto de pequeno porte, porém preciso que esta página funcione através de um PWA.
Até ai tranquilo...
Vi alguns artigos de como fazer, inclusive o https://imasters.com.br/front-end/progressive-web-apps-pwa-e-evolucao-da-web registrado aqui na iMasters.
Fiz todos os passos (eu acho), não entendo muito... Mas segue abaixo os códigos que inseri:
Código manifest.json
{
"short_name": "SJ",
"name": "Sistema Jéssica",
"icons": [
{
"src": "arquivos/imagens/logo.png",
"sizes": "126x126",
"type": "image/png"
}
],
"scope": "/",
"start_url": "/inicio",
"orientation": "portrait",
"display": "fullscreen",
"theme_color": "#ffffff",
"background_color": "#ffffff"
}
Inserido no .js global do site
self.addEventListener('install', (event) => {
let plugins = [
new WorkboxPlugin({
globDirectory: DIST_DIR,
globPatterns: ['**/*.{php,js,css,json,png}'], // {21}
swDest: path.join(DIST_DIR, 'sw.js') //{22}
})
];
const workboxSW = new WorkboxSW();
const networkFirst = workboxSW.strategies.networkFirst();
workboxSW.router.registerRoute('/arquivos', networkFirst); // {23}
});
self.addEventListener('activate', (event) => {
// SW está instalado e ativo
// Podemos terminar o setup
// Ou limpar cache antigo
});
self.addEventListener('fetch', (event) => {
// Escuta cada evento de fetch
// E faz alguma coisa para cada request
// feito da app para API server
});
**Inserido dentro do <head> global do site**
<link rel="manifest" href="manifest.json">
Verifico e não há registro de cache no navegador, então não está funcionando.
Estou fazendo algo errado?
**Abraços, Wictor Pamplona.**Discussão (11)
Carregando comentários...