ASP.NET Core 2.1 - PWA (Banner prompt be cancelled)

462 views Asked by At

Trying to make an Progressive Web App, using ASP.NET Core 2.1, using Nuget: WebEssentials.AspNetCore.PWA.

My serviceworker and manifest gets displayed in the Chrome Dev Tools, but when I hit the "Add to homescreen" nothing happens except displayed error on computer, and on phone the load banner on top is stuck loading.

The error:

Site cannot be installed: the page has requested the banner prompt be cancelled

I couldn't seem to find anything on this error, so hope you guys can help me out. Thanks in advance.

ServiceWorker:

self.addEventListener('install', async event => {
    const cache = await caches.open(CACHE_NAME);
    cache.addAll(urlsToCache).catch(err => console.log('An error occured: ', err));
});

self.addEventListener('fetch', event => {
    const request = event.request;
    const url = new URL(request.URL);

    if (url.orgin === location.orgin) {
        event.respondWith(cacheFirst(request));
    } else {
        event.responseWith(networkFirst(request));
    }
    
});

async function cacheFirst(request) {
    const cachedResponse = await caches.match(request);
    return cachedResponse || fetch(request);
}

async function networkFirst(request) {
    const cache = await caches.open('wportal-dynamic-v1');

    try {
        const res = await fetch(request);
        cache.put(request, res.clone());
        return res;
    } catch (exception) {
        console.log('An error occured in networkFirst: ', exception);
        return await cache.match(request);
    }
}

1

There are 1 answers

0
Mojo On

Found the solution..

var deferredPrompt = null;                

window.addEventListener('beforeinstallprompt', (e) => {
    e.preventDefault(); // Prevent Chrome 67 and earlier from automatically showing the prompt
    deferredPrompt = e;
});
<button onclick="deferredPrompt.prompt();">Click me to install pwa</button>